I have the problem always at the beginning that I start creating a modal when sending the data, the previous occasion changed jquery and it worked, but now I copy and paste the code of a modal that works by calling it with jquery.
I made the modal with as little code as possible to make it easier to read
The problem is that when I press the add button does not work submit or the console.log prints
<div class="modal-dialog modal-sm" role="document">
<div class="modal-content">
<form id="formularioAgregar" role="form">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true" >×</button>
<h4 class="modal-title" id="myModalLabel"><b>Agregar un celular</b></h4>
</div>
<div class="modal-body">
<div class="row">
<div class="form-group col-md-3">
<label class="control-label">Nombre de perfil</label>
<input type="text" name="Datos[nombrePerfil]" id="nombrePerfil" required>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
<button type="submit" name="enviar" id="agregar" class="btn btn-success">Agregar</button>
</div>
</form>
</div>
</div>
js
var contar = [], dias = [], diasSemana = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];
$(function () {
variable = $("#div_alert");
// alert(variable);
$("#tblPerfiles").DataTable();
$(".loader").fadeOut("slow");
if (typeof variable !== 'undefined' && variable !== null) {
// setTimeout(function(){cerrar("div_alert");}, 3000);
}
});
$( "#formularioAgregar" ).on( "submit", function( event ) {
console.log('asasasa');
event.preventDefault();
console.log( $( this ).serialize() );
});
function agregar(){
dias = [];
$.ajax({
url: 'index.php?accion=alta',
type: 'post',
success: function (data) {
$("#modalPerfil").html(data);
$(".timepicker").timepicker({ showInputs: false, showMeridian: false});
$('.selectpicker').selectpicker({style: 'btn-success btn-sm',size: 4,noneSelectedText: 'Seleccionar un elemento', liveSearchPlaceholder:'Buscar',noneResultsText: '¡No existe el elemento buscado!',countSelectedText:'{0} elementos seleccionados',actionsBox:true,selectAllText: 'Seleccionar todos',deselectAllText: 'Deseleccionar todos'});
$('#formAgregar').validator({focus:false});
},
});
$("#modalPerfil").modal("show");
}
function agregarFila(){
if ($('#diasTrabajados option:selected')=="") {
$('#entrada').hide();
$('#salida').hide();
$("#diasTrabajados").hide();
}else{
$('#entrada').show();
$('#salida').show();
$("#telefonoExtension").attr("required","required");
}
diasTmp = [], opciones = "";
$('#diasTrabajados option:selected').each(function(i, obj) {
//concatena dias y this
dias.push($(this).val());
});
//elimina nodos duplicados
$.grep(diasSemana, function(el) {
if ($.inArray(el, dias) == -1) diasTmp.push(el);
});
for(var i = 0; i < diasTmp.length; i++){
opciones += "<option>" + diasTmp[i] + "</option> ";
}
cajita = '<div class="form-group col-md-3"><div class="form-group"><label>Horarios</label><input type="text" name="horarioEntrada" class="form-control " value="'+$('#entrada').val()+'" readonly></div></div>';
cajita += '<div class="form-group col-md-3"><div class="form-group"><label></label><input type="text" name="horarioSalida" class="form-control" value="'+$('#entrada').val()+'" readonly></div></div>';
cajita += '<div class="form-group col-md-5"><label class="control-label">Dias trabajados</label><input type="hidden" name="diasTrabajados2" required>'+$('#diasTrabajados').val()+'</div>';
cajita += '<div class="form-group col-md-1"><a><i class="fa fa-minus eliminarFila" style="cursor:pointer" agregarFila() onclick="eliminarHorario(this,\''+$('#diasTrabajados').val()+'\');" ></i></a></div>';
cuadro = '<div class="form-group col-md-11 horarios">'+cajita+'</div>';
$("#prueba").append(cuadro);
$('.selectpicker').selectpicker({style: 'btn-success btn-sm',size: 4,noneSelectedText: 'Seleccionar un elemento', liveSearchPlaceholder:'Buscar',noneResultsText: '¡No existe el elemento buscado!',countSelectedText:'{0} elementos seleccionados',actionsBox:true,selectAllText: 'Seleccionar todos',deselectAllText: 'Deseleccionar todos'});
$(".timepicker").timepicker({ showInputs: false });
// console.log(dias);
$("#diasTrabajados").html(opciones);
$("#diasTrabajados").selectpicker("refresh");
}
function eliminarHorario(elemento, diasTmp){
opciones = "";
$(".loader").fadeIn("fast", function(){
diasTmp = diasTmp.split(",");
for(var i = 0; i < diasTmp.length; i++){
index = dias.indexOf(diasTmp[i]);
console.log(index);
if (index > -1) {
dias.splice(index, 1);
}
opciones += "<option>" + diasTmp[i] + "</option>";
}
$("#diasTrabajados").append(opciones);
$("#diasTrabajados").selectpicker("refresh");
$(elemento).closest('div.horarios').remove();
$(".loader").fadeOut("fast");
});
}
function modificar(id){
$.ajax({
url: 'index.php?accion=modificar&id='+id,
type: 'post',
success: function (data) {
$("#modalSalario").html(data);
$('.selectpicker').selectpicker({style: 'btn-success btn-sm',size: 4,noneSelectedText: 'Seleccionar un elemento', liveSearchPlaceholder:'Buscar',noneResultsText: '¡No existe el elemento buscado!',countSelectedText:'{0} elementos seleccionados',actionsBox:true,selectAllText: 'Seleccionar todos',deselectAllText: 'Deseleccionar todos'});
$('#formEditar').validator({focus:false});
},
});
$("#modalSalario").modal("show");
}
function eliminar(id){
$("#modalEliminar").unbind().modal({ backdrop: "static", keyboard: false }).one("click", "#eliminar", function (e) {
$(".loader").fadeIn("slow", function(){
$.ajax({
data:{id: id},
url: 'index.php?accion=eliminar',
type: 'post',
success: function (data) {
if(data == "OK")
window.location.replace("index.php?accion=index&clase=success");
else{
alert(data);
}
},
});
});
});
}