Jquery, clases iguales ejecutan mas de una vez la función
Publicado por Alberto (2 intervenciones) el 27/12/2013 16:37:27
Estimados:
Agradeceré su ayuda.
Este es el problema.
Dinámicamente y mediante AJAX inserto una tabla más de una vez en el DOM del documento. La tabla tiene el mismo ID y los DIV de la tabla tienen una clase nnn. Al evento click de la clase NNN le he asociado una función AAA.
El problema sucede cuando doy click en un div que tiene asociada la clase NNN. Supuestamente se debería ejecutar una sola vez la funcion AAA, pero, no sucede asi, se ejectuta tantas veces como tablas se hayan insertado en el DOM del documento.
Como puedo evitar que cada una de las Clases NNN pongan en la pila de ejecución varias veces la funcion AAA.
Estye es el código HTML5:
Este es el código JQuery:
Agradeceré su ayuda.
Este es el problema.
Dinámicamente y mediante AJAX inserto una tabla más de una vez en el DOM del documento. La tabla tiene el mismo ID y los DIV de la tabla tienen una clase nnn. Al evento click de la clase NNN le he asociado una función AAA.
El problema sucede cuando doy click en un div que tiene asociada la clase NNN. Supuestamente se debería ejecutar una sola vez la funcion AAA, pero, no sucede asi, se ejectuta tantas veces como tablas se hayan insertado en el DOM del documento.
Como puedo evitar que cada una de las Clases NNN pongan en la pila de ejecución varias veces la funcion AAA.
Estye es el código HTML5:
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
<table id="tabAsiSis" class="csstabAsiSis ">
<tr class="titSubTab" >
<th colspan="3" class="tdIzq">Asigne Sistemas</th>
</tr>
@foreach (var item in Model) {
<tr>
<td id="@ViewBag.codper-@Html.DisplayFor(modelItem => item.cod_sistema)" >
<div id="divBotFun" class="cssdivToolsMUSistemas cssdivSisCenPro" title="Asigne Programas"></div>
</td>
<td class="tdIzq">
@Html.DisplayFor(modelItem => item.descripcion)
</td>
<td class="tdDer">
@if (item.asignado)
{@Html.CheckBox("Sist" + item.cod_sistema, true,new { @class="chkFunAso"})
} else {
@Html.CheckBox("Sist" + item.cod_sistema, false, new { @class="chkFunAso"})
}</td>
</tr>
}</table>
Este es el código JQuery:
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
<script type="text/javascript" >
$(document).ready(function () {
$('.cssdivToolsMUSistemas').click(function () {
if ($(this).hasClass('cssdivSistemaCerrar')) {
$('#trAsoSisPro' + $(this).closest("td").attr("id")).remove();
$(this).removeClass('cssdivSistemaCerrar');
$(this).addClass('cssdivSisCenPro');
return false;
}if ($(this).hasClass('cssdivSisCenPro')) {
var idnewtr = 'AsoSisPro' + $(this).closest("td").attr("id")
$("<tr id='tr" + idnewtr + "'><td></td><td colspan=2></td></tr>").insertAfter($(this).closest("tr"));
$('#' + idnewtr).addClass('tdIzq');
$(this).removeClass('cssdivSisCenPro');
$(this).addClass('cssdivSistemaCerrar');
$(this).css({ 'float': 'none', 'margin': 'auto' });
funAsignaSistemasPrograma('tr' + idnewtr, $(this).closest("td").attr("id"));
return false;
}})
})
var funAsignaSistemasPrograma = function (objtr, codpersis) {
$.ajax({
url: "sisSeguridad/showSistemaProgramaPerfil",
type: "post",
data: { "d": codpersis },
success: function (response, textStatus, jqXHR) {
$('#' + objtr).find("td").eq(1).html(response);
},
error: function (jqXHR, textStatus, errorThrown) {
alert("error");
},
})
}</script>
Valora esta pregunta
0
