JavaScript - Recorrer Listview Checkbox

   
Vista:

Recorrer Listview Checkbox

Publicado por Steven (1 intervención) el 21/11/2017 16:20:33
Hola a todos, soy nuevo por aqui, y nuevo tambien en estos temas, quisiera una ayuda con esto, en lo que estoy algo perdido, estoy tratando de hacer un listview con checkbox a la izquierda, y encontre unos recursos muy buenos, pero ahora me quede atorado en como hacer que con un determinado evento, por ejemplo, presionar un boton, me capture el id de los items que estan marcados.

Este es el codigo, desde ya agradezco el interes y apoyo.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<!DOCTYPE html>
<html>
  <head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
 
	<title>Jobber Test</title>
 
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
	<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
	<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
 
	<style>
		/* Aplicar a data-role=listview que contiene checkboxes */
		[data-role=listview].jobber-checkbox-list a.ui-link-inherit {
			padding: 0 .7em 0 0;
		}
		[data-role=listview].jobber-checkbox-list label {
			border: none; margin: 0;
		}
		[data-role=listview].jobber-checkbox-list .ui-li-aside {
			width: 20%;
		}
	</style>
  </head>
 
<body>
<div data-role="page">
  <div data-role="content">
    <form>
		<ul data-role="listview" data-inset="false" data-divider-theme="d" data-split-theme="c" class="ui-icon-alt jobber-checkbox-list">
 
			<li data-icon="false">
				<a id="i1" href="#">
					<label data-corners="false">
						<h2>Follow up with new client</h2>
						<p>2011-09-02: 10:00AM - 11:00AM</p>
						<p>Some notes about something.</p>
						<input type="checkbox" checked="false">
					</label>
				</a>
			</li>
 
			<li data-icon="false">
				<a id="i2" href="#">
					<label data-corners="false">
						<h2>Follow up with new client</h2>
						<p>2011-09-02: 10:00AM - 11:00AM</p>
						<input type="checkbox" checked="false">
					</label>
				</a>
			</li>
 
			<li data-icon="false">
				<a id="i3" href="#">
					<label data-corners="false">
						<h2>Follow up with new client</h2>
						<p>2011-09-02: 10:00AM - 11:00AM</p>
						<input type="checkbox" checked="false">
					</label>
				</a>
			</li>
		</ul>
		<br>
		<button>Enviar</button>
    </form>
  </div>
</div>
 
</body>
</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve

Recorrer Listview Checkbox

Publicado por xve (1913 intervenciones) el 21/11/2017 19:35:43
Hola Esteven, con este simple bucle de javascript puedes tener-lo:

1
2
3
4
for (var i=0;i<document.getElementsByTagName("input").length;i++)
{
    console.log(document.getElementsByTagName("input")[i].checked);
}

Lo que pasa, es que no tienes ningun identificados a los check... por lo que no se como diferenciarlos
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar