evento click en tabla generada dinamicamente (jquery) Bueno soy aun nuevo en este tema , y tengo un problema que no puedo solucionar aun;
hey probado con los eventos on("click") , y pues nada tambien intente cargar de forma asincrona los archivos de jquery , bueno debo estar haciendo algo mal ,quiero poder clickear en cada selda de la tabla generada dinmicamente.
Código:
var app ={
init:function(){
//app.carga_datos();
//$("#btn_dominio").on("click",function(){ window.location.replace("config.html");});
app.carga_sformulario();
$(".keys").on("click",app.prueba);
},
prueba:function()
{
alert("se clickeo");
},
carga_sformulario:function(){
$.ajax({
type: 'POST',
url: 'configuracion_dhcp.php',
data:{accion:"subnet"},
success: function (rs) {
var obj = jQuery.parseJSON(rs);
var table;
$.each(obj,function(i,item){
//var patron1 =""+obj[0].idDataLog+"";
var cont=cont+1;
table = table +"<tr><th style=\"cursor: pointer;\" class=\"keys\">"+item.key+"</th><th style=\"cursor: pointer;\" class=\"values\">"+item.value+"</th> </tr>";
//var formulario="<table border='1' id='tlb_subnet' style='overflow: auto' HEIGHT='50'> <tr style='overflow: auto'><td rowspan='5' width='400' height='200' valign='TOP'> <strong>Datos</strong></br> <table border='1' style='overflow: auto'> "+table+" </table></td> <td style='overflow: auto'> <strong>Subnet IP</strong></br><input type='text' id='txt_domain'> </br><strong>Subnet Netmask</strong></br> <input type='text' id='txt_ip1'></td> </tr> <tr> <td> <strong>option routers</strong> </br><input type='text' id='txt_ip2'><br> <strong>option ubnt.unifi-address</strong></br><input type='text'> </td> </tr> <tr> <td> <input type='button' value='actualizar' id='btn_actualizar'></td> </tr> </table>";
$("#cerdo").html(table);
});
console.log(obj);
console.log(table);
//$("th#th_alias").html("null");
}
});
$("#tlb_subnet").on("click", "#tdt", function(){
alert("se selecciono");
});
},
}
$(document).ready(app.init);
aca mi plantilla html
Código HTML:
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"/> <title>Panel DHCP</title> <script src="js/jquery-1.11.3.js"></script> <script type="text/javascript" src="js/subred.js" async="async"></script> <!-- <script src="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script> <!-- <script type="text/javascript" src="js/busqueda.js"></script> async="async"--> <!-- <script type="text/javascript" src="js/detalle.js"></script>--> <!--<script type="text/javascript" src="js/app.js"></script>--> <link rel="stylesheet" href="css/layout.css" type="text/css" media="screen" /> </head> <body> <header id="header"> <hgroup> <h1 class="site_title"><a href="index.html">Panel de Control</a></h1> <h2 class="section_title">DHCP</h2><div class="btn_view_site"></div> </hgroup> </header> <!-- end of header bar --> <section id="secondary_bar"> <div class="user"> <p>Menú</p> <!-- <a class="logout_user" href="#" title="Logout">Logout</a> --> </div> <div class="breadcrumbs_container"> <article class="breadcrumbs"><a href="index.php">Panel de Control</a> <div class="breadcrumb_divider"></div> <a class="current">Tablero</a></article> </div> </section> <aside id="sidebar" class="column"> <!-- formulario de busqueda --> <form class="quick_search" id="frmSearch" method="post" > <input type="text" value="Quick Search" onfocus="if(!this._haschanged){this.value=''};this._haschanged=true;" name="palabra_busqueda" id="palabra_busqueda"> <input type="button" value="buscar" name="btn_buscar" id="btn_buscar"> </form> <hr/> <h3>Contenido</h3> <ul class="toggle"> <li class="icn_new_article"><a href="panel.html" >Panel de registros de DHCP</a></li> <ul> <li class="icn_edit_article" ><a href="config.html">Conf. Dominio</a></li> <li class="icn_edit_article"><a href="subred.html">Conf. Subnet</a></li> </ul> </ul> <footer> <hr /> </footer> </aside><!-- end of sidebar --> <section id="main" class="column"> <h4 class="alert_info">configuracion de servidor dhcp.</h4> <div class="clear"></div> </div> </article><!-- end of stats article --> <article class="module width_full"> <header><h3 class="tabs_involved">Configuracion de DHCP</h3></header> <div style="margin:o;"> <div class="tab_container" id="Layer1" style="width:500px; height:400px; overflow: scroll; float:left;"> <table id='scroll_table' > <tbody id="cerdo"> </tbody> </table> </div> <div style="float:right;"> <table border="0"> <tr> <td> <strong>Datos</strong> <hr> </td> <td> <strong>Configuracion</strong> <hr> </td> <td> <strong>Lineas</strong> <hr> </td> </tr> <tr> <td> <strong>IP Subred</strong> </td> <td> <input type="text"></br> </td> <td> <input type="text" size="3" readonly="readonly" > </td> </tr> <tr> <td> <strong>Mask Subred</strong> </td> <td> <input type="text"></br> </td> <td> <input type="text" size="3" readonly="readonly" > </td> </tr> <tr> <td> <strong>option routers</strong> </td> <td> <input type="text"></br> </td> <td> <input type="text" size="3" readonly="readonly" > </td> </tr> <tr> <td> <strong>option broadcast-address</strong> </td> <td> <input type="text"></br> </td> <td> <input type="text" size="3" readonly="readonly" > </td> </tr> <tr> <td> </td> <td> <pre><input type="button" value="modificar" onclick="alert('MODIFICADO');"> </td> </tr> </table> </form> </div> </div> <script src="js/jquery-1.11.3.js"></script> <script type="text/javascript" src="js/subred.js" async="async"></script> </article> </body> </html>
