Hola!!! Estoy trabajando con una tabla dinámica para agregar/eliminar relaciones de acceso a los roles de mi aplicación. Todo funciona bien al agregar, pero al eliminar una fila de la tabla dinámica (en mi vista) me lanza el siguiente error en javascript: [Violation] 'click' handler took 6331ms javascript Todos los coemntarios dicen que es un bug de chrome versión 58, 56, etc pero mi versión es la 68 y el error sigue ahí. Les comparto mi código (ya probé sustituyendo el checkbox por button y el error sigue)
<div class="box box-success" style="padding:30px;">
<div class="panel panel-primary">
<div class="panel-heading">Cadena de Ventas/Rol</div>
</div>
<div class="row" id="mydiv">
<div class="card card-warning">
{!! Form::open(array('url' => '', 'method' => 'POST'))!!}
{!! Form::hidden('id_role', $id_role, ['id' => 'id_role'] )!!}
{{ csrf_field() }}
<div class="form-group">
<label>Canal:</label>
{!! Form::select('id_canal', [''=>'::Seleccione::']+$canales, NULL, ['class' => 'form-control', 'id' => 'id_canal', 'required' ] )!!}
</div>
<div class="form-group">
<label>Cadena Ventas:</label>
{!! Form::select('id_cadena_venta', $cadena_ventas, NULL, ['class' => 'form-control', 'id' => 'id_cadena_venta', 'required'])!!}
</div>
<div class="card-footer">
<button type="button" id="add" class="add-row ">Agregar</button>
</div>
<table class="table table-hover" id="tabla">
<thead class="thead-light">
<tr>
<th>Seleccione</th>
<th>Canal</th>
<th>Cadena Ventas</th>
</tr>
</thead>
<tbody>
<?php
//dd($cadena_roles);
?>
@foreach ($cadena_roles as $object)
<tr >
<td><input type='checkbox' value="{{ $object->id_cadena_roles }}" name='record' id="{{ $object->id_cadena_roles }}"></td>
<!-- <td><input type='checkbox' value="{{ $object->id_cadena_venta }}" name='record'></td> -->
<td>{{ $object->des_canal }}</td>
<td>{{ $object->des_cadena_venta }}</td>
</tr>
@endforeach
</tbody>
</table>
<button type="button" class="delete-row">Borrar</button>
{!! Form::close() !!}
</div>
</div>
</div>
</section>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$('#id_canal').change(function(){
var id_canal = $(this).val();
var id_rol = $("#id_role").val();
var token = $("input[name='_token']").val();
$.ajax({
url: "selectEditAjax",
method: 'POST',
data: {id_canal:id_canal, id_rol:id_rol, _token:token},
success: function(data) {
$("select[name='id_cadena_venta'").html('');
$("select[name='id_cadena_venta'").html(data.options);
}
});
});
$(document).ready(function(){
//$('#mydiv').find('input, textarea, button, select').attr('disabled','disabled');
var arrayvalores = [];
var id_rol = $("#id_role").val();
var token = $("input[name='_token']").val();
$(".add-row").click(function(){
var name = $("#id_canal option:selected").text();
var email = $("#id_cadena_venta option:selected").text();
var id_canal = $("#id_canal").val();
var id_cadena_venta = $("#id_cadena_venta").val();
//alert(arrayvalores+ "id rol "+id_rol+" cadena venta "+id_cadena_venta_+" token "+token);
$.ajax({
url: "storeEditAjax",
method: 'POST',
data: {id_rol:id_rol, id_cadena_venta:id_cadena_venta, _token:token},
success: function(data) {
//alert(data);
var markup = "<tr><td><input type='checkbox' value="+data+" name='record'></td><td>" + name + "</td><td>" + email + "</td></tr>";
//arrayvalores.push(id_cadena_venta_);
$("table tbody").append(markup);
//recargar el combo de cadenas, eliminando la que ya se guardó
$.ajax({
url: "selectEditAjax",
method: 'POST',
data: {id_canal:id_canal, id_rol:id_rol, _token:token},
success: function(data) {
$("select[name='id_cadena_venta'").html('');
$("select[name='id_cadena_venta'").html(data.options);
}
});
}
});
});
// Find and remove selected table rows
$(".delete-row").click(function(){
$("input[type=checkbox]").each(function(){
if($(this).is(":checked")) {
//alert($(this).val());
var id_cadena_roles = $(this).val();
$(this).parents("tr").remove();
//alert("id "+id_cadena_venta+" id rol "+id_rol);
$.ajax({
url: "deleteEditAjax",
method: 'POST',
data: {id_cadena_roles:id_cadena_roles, _token:token},
success: function(data) {
$(this).parents("tr").remove();
}
});
//recargar el combo de cadenas, eliminando la que ya se guardó
$.ajax({
url: "selectEditAjax",
method: 'POST',
data: {id_canal:id_canal, id_rol:id_rol, _token:token},
success: function(data) {
$("select[name='id_cadena_venta'").html('');
$("select[name='id_cadena_venta'").html(data.options);
}
});
}
});
});
});
</script>