javascript check box selected and filter

Solutions on MaxInterview for javascript check box selected and filter by the best coders in the world

showing results for - "javascript check box selected and filter"

25 Jul 2017

1<!DOCTYPE html>
2<html>
3
4<head>
5  <meta charset="UTF-8">
6</head>
7
8<body>
9  <div class="filter">
10    <h1>Select models</h1>
11    <div class="models">
12      <div class="checkbox">
13        <label><input type="checkbox" rel="apple" onchange="change();"/>Apple</label>
14      </div>
15      <div class="checkbox">
16        <label><input type="checkbox" rel="samsung" onchange="change();"/>Samsung</label>
17      </div>
18      <div class="checkbox">
19        <label><input type="checkbox" rel="xiaomi" onchange="change();"/>Xiaomi</label>
20      </div>
21    </div>
22    <h1>Select processors</h1>
23    <div class="processors">
24      <div class="checkbox">
25        <label><input type="checkbox" rel="a9" onchange="change();"/>A9</label>
26      </div>
27      <div class="checkbox">
28        <label><input type="checkbox" rel="a8" onchange="change();"/>A8</label>
29      </div>
30      <div class="checkbox">
31        <label><input type="checkbox" rel="snapdragon" onchange="change();"/>Snapdragon</label>
32      </div>
33      <div class="checkbox">
34        <label><input type="checkbox" rel="exynos" onchange="change();"/>Exynos</label>
35      </div>
36    </div>
37  </div>
38
39  <div class="result">
40    <div class="apple a9">
41      <h1>iPhone 7</h1>
42    </div>
43    <div class="apple a8">
44      <h1>iPhone 6</h1>
45    </div>
46    <div class="samsung exynos">
47      <h1>Samsung s7</h1>
48    </div>
49    <div class="xiaomi snapdragon">
50      <h1>Xiaomi Redmi note 4x</h1>
51    </div>
52  </div>
53</body>

source