Foros del Web » Programando para Internet » Jquery »

checkbox datatable jquery

Estas en el tema de checkbox datatable jquery en el foro de Jquery en Foros del Web. Hola a todos, tengo un tabla en jquery que se rellena por medio de una BD en MYSQL. En la tabla tengo una columna de ...
  #1 (permalink)  
Antiguo 27/01/2010, 10:56
 
Fecha de Ingreso: marzo-2008
Mensajes: 17
Antigüedad: 16 años, 8 meses
Puntos: 0
checkbox datatable jquery

Hola a todos,
tengo un tabla en jquery que se rellena por medio de una BD en MYSQL. En la tabla tengo una columna de todo checkbox. Lo que quiero hacer es que cuando haga click sobre alguno de los checkbox de esa fila muestra un alert con el valor del checkbox y el valor de la primera columna correspondiente al ID.

pongo el codigo.
Código:
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<link rel="shortcut icon" type="image/ico" href="http://www.sprymedia.co.uk/media/images/favicon.ico" />
		
		<title>DataTables example</title>
		<style type="text/css" title="currentStyle">
			@import "./media/css/demo_page.css";
			@import "./media/css/demo_table.css";
		</style>
		<script type="text/*‬javascript" language="*‬javascript" src="./media/js/jquery.js"></script>
		<script type="text/*‬javascript" language="*‬javascript" src="./media/js/jquery.dataTables.js"></script>
		
	
		<script type="text/*‬javascript" charset="utf-8">
			var oTable;
			
			$(document).ready(function() {

			$("#checkme2_1").click(function(){
				alert('sdfasf');
			});

				oTable = $('#example').dataTable( {
					"bProcessing": true,  
					"sPaginationType": "full_numbers",  
					"sAjaxSource": "./server_processing1.php"
				} );
							
				
			} );
		</script>
	</head>
	<body id="dt_example">
	
	
		<div id="container">
			<div id="demo">
			<h1>Ejemplo</h1>			
			
				<form id="form">
					<div style="text-align:right; padding-bottom:1em;">
						<button type="submit">Enviar</button>
					</div>
			
		
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
	<thead>
		<tr>
			<th width="5%">Id</th>
			<th width="15%">Proveedor</th>
			<th width="15%">Fabricante</th>
			<th width="20%">Ref</th>
			<th width="25%">Nombre</th>
			<th width="15%">Ean13</th>
				<th width="15%">checkbox</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td colspan="5" class="dataTables_empty">Loading data from server</td> 
		</tr>
	
	</tbody>
 
	<tfoot>
		<tr>
			<th>Id</th>
			<th>Proveedor</th>
			<th>Fabricante</th>
			<th>Ref</th>
			<th>Nombre</th>
			<th>Ean13</th>
			<th>checkbox</th>
		</tr>
	</tfoot> 
	
</table>
				</form>
</div></div>
	</body>
</html>
fichero : serverprocessing1.php

Código:
Código:
<?php
  /* MySQL connection */
	// include( $_SERVER['DOCUMENT_ROOT']."/datatables/mysql.php" ); /* ;-) */
	include( "./config/mysql.php" ); /* ;-) */

	/* Paging */
	$sLimit = "";
	if ( isset( $_GET['iDisplayStart'] ) && $_GET['iDisplayLength'] != '-1' )
	{
		$sLimit = "LIMIT ".mysql_real_escape_string( $_GET['iDisplayStart'] ).", ".
			mysql_real_escape_string( $_GET['iDisplayLength'] );
	}
	
	/* Ordering */
	if ( isset( $_GET['iSortCol_0'] ) )
	{
		$sOrder = "ORDER BY  ";
		for ( $i=0 ; $i<mysql_real_escape_string( $_GET['iSortingCols'] ) ; $i++ )
		{
			$sOrder .= fnColumnToField(mysql_real_escape_string( $_GET['iSortCol_'.$i] ))."
			 	".mysql_real_escape_string( $_GET['iSortDir_'.$i] ) .", ";
		}
		$sOrder = substr_replace( $sOrder, "", -2 );
	}
	
	/* Filtering - NOTE this does not match the built-in DataTables filtering which does it
	 * word by word on any field. It's possible to do here, but concerned about efficiency
	 * on very large tables, and MySQL's regex functionality is very limited
	 */
	$sWhere = "";
	if ( $_GET['sSearch'] != "" )
	{
		$sWhere = "AND nombreproveedor LIKE '%".mysql_real_escape_string( $_GET['sSearch'] )."%' OR ".
		                "id_manufacturer LIKE '%".mysql_real_escape_string( $_GET['sSearch'] )."%' OR ".
		                "reference LIKE '%".mysql_real_escape_string( $_GET['sSearch'] )."%' OR ".
		                "ean13 LIKE '%".mysql_real_escape_string( $_GET['sSearch'] )."%' OR ".
		                "ean13 LIKE '%".mysql_real_escape_string( $_GET['sSearch'] )."%'";
	}
	
	$sQuery = "
	SELECT SQL_CALC_FOUND_ROWS ar.id_product, pr.name AS nombreproveedor, fa.name as nombrefabricante,
	lang.name as nombrearticulo,
    reference, ean13, price
	FROM   ps_product as ar 
    LEFT JOIN ps_supplier as pr ON ar.id_supplier=pr.id_supplier
	LEFT JOIN ps_manufacturer as fa ON fa.id_manufacturer=ar.id_manufacturer
    LEFT JOIN ps_product_lang AS lang ON ar.id_product=lang.id_product AND id_lang=1
	$sWhere
	$sOrder
	$sLimit		
	";	
	

	$rResult = mysql_query( $sQuery, $gaSql['link'] ) or die(mysql_error());
	
	$sQuery = "
		SELECT FOUND_ROWS()
	";
	$rResultFilterTotal = mysql_query( $sQuery, $gaSql['link'] ) or die(mysql_error());
	$aResultFilterTotal = mysql_fetch_array($rResultFilterTotal);
	$iFilteredTotal = $aResultFilterTotal[0];
	
	$sQuery = "
		SELECT COUNT(id_product)
		FROM   ps_product
	";
	

	$rResultTotal = mysql_query( $sQuery, $gaSql['link'] ) or die(mysql_error());
	$aResultTotal = mysql_fetch_array($rResultTotal);
	$iTotal = $aResultTotal[0];
	
	$sOutput = '{';
	$sOutput .= '"sEcho": '.intval($_GET['sEcho']).', ';
	$sOutput .= '"iTotalRecords": '.$iTotal.', ';
	$sOutput .= '"iTotalDisplayRecords": '.$iFilteredTotal.', ';

	$contador=1;
	$sOutput .= '"aaData": [ ';
	while ( $aRow = mysql_fetch_array( $rResult ) )
	{
		$sOutput .= "[";
		$sOutput .= '"'.addslashes($aRow['id_product']).'",';
		$sOutput .= '"'.addslashes($aRow['nombreproveedor']).'",';
		
		$enlace="<a href='http://www.google.com'>prueba</a>";
		$sOutput .= '"'.$enlace.'",';

		$sOutput .= '"'.addslashes($aRow['nombreproveedor']).'",';
		$sOutput .= '"'.addslashes($aRow['reference']).'",';
		if ( $aRow['nombrearticulo'] == "Prueba01" )
			$sOutput .= '"-",';
		else
			$sOutput .= '"'.addslashes($aRow['nombrearticulo']).'",';
		
		$ckacc="<input id='checkme2_".$contador."' type='checkbox' value='1' />";
		$sOutput .= '"'.$ckacc.'"';

		$sOutput .= "],";
		
		$contador=$contador+1;
	}
	$sOutput = substr_replace( $sOutput, "", -1 );
	$sOutput .= '] }';


	 echo $sOutput;

	
	function fnColumnToField( $i )
	{
		if ( $i == 0 )
			return "engine";
		else if ( $i == 1 )
			return "browser";
		else if ( $i == 2 )
			return "platform";
		else if ( $i == 3 )
			return "version";
		else if ( $i == 4 )
			return "grade";
	}
?>
Estoy desesperado, llevo dias con lo mismo sin éxito.
Por favor, me ayuda alguien?


Ni tan siquiera me muestra el ALERT al hacer click en el checkbox

$("#checkme2_1").click(function(){
alert('sdfasf');
});


Gracias
  #2 (permalink)  
Antiguo 25/05/2011, 09:46
Avatar de slide22  
Fecha de Ingreso: mayo-2011
Ubicación: Madrid
Mensajes: 17
Antigüedad: 13 años, 6 meses
Puntos: 0
Respuesta: checkbox datatable jquery

Hola. Lei en un post de este foro que la funcion que tienes del alert tienes que ponerla despues de que se cree el elemento, es decir despues de los checkbutton. Mira a ver si es por eso por lo que no te salta el alert.
  #3 (permalink)  
Antiguo 26/05/2011, 00:56
Avatar de livemusic  
Fecha de Ingreso: abril-2011
Ubicación: Lima - Chorrillos
Mensajes: 150
Antigüedad: 13 años, 7 meses
Puntos: 18
Respuesta: checkbox datatable jquery

Amigo, intenta con este codigo, me comentas si te funciono....

Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function(){
	$('.check').live('click', function(){
		// .attr('checked')
		if($(this).is(':checked')){
			alert('Check Seleccionado '+this.value);
		}
	})
})
</script>
</head>

<body>
<table width="200" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="31">&nbsp;</td>
    <td width="169"><strong>Nombres</strong></td>
  </tr>
  <tr>
    <td><input type="checkbox" name="nombre" class="check" value="1" /></td>
    <td>Antony</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="nombre" class="check" value="2" /></td>
    <td>Carolina</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="nombre" class="check" value="3" /></td>
    <td>Marisol</td>
  </tr>
</table>
</body>
</html> 

Última edición por livemusic; 26/05/2011 a las 01:06
  #4 (permalink)  
Antiguo 26/05/2011, 17:44
 
Fecha de Ingreso: noviembre-2005
Mensajes: 426
Antigüedad: 19 años
Puntos: 87
Respuesta: checkbox datatable jquery

El post original es de enero del 2010... sospecho que este problema ya no es de su interes...

Etiquetas: checkbox, datatable, javascript
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:46.