Problem in form in modal bootstrap [closed]

1

Is there any modal constraint for bootstrap? When I put the form inside the modal, I do not get the Ajax alert, but if I take the form from within the modal, the data passes and I get the alert. When I put the form inside the modal I also get on the console: Undefined index ... Follow the code.

Modal

<div class="modal" id="cadastrarReserva" role="dialog" style="width:900px; height:650px; left:40%; top:2%;">
<div class="modal-dialog">
    <div class="modal-body" style="max-height:650px;">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <form method="post" id="cadastrarReserva" autocomplete="off">
            <label>Código:</label>
            <input type="text" id="idCliente" name="idCliente" >
            <label>Cliente:*</label>
            <input type="text" name="cliente" id="clienteReserva" autofocus required >
            <label>Data:*</label>
            <input type="text" name="data" value="<?php echo $dataFiltro; ?>" class="dataFiltro" required/>
            <label>Hora:*</label>
            <select name="hora" required>
                <option value="">Selecione...</option>
                <option value="11:30:00">11:30h</option>
                <option value="12:00:00">12:00h</option>
                <option value="14:00:00">14:00h</option>
                <option value="15:00:00">15:00h</option>
                <option value="15:30:00">15:30h</option>
                <option value="16:00:00">16:00h</option>
                <option value="16:30:00">16:30h</option>
                <option value="17:00:00">17:00h</option>
                <option value="17:30:00">17:30h</option>
                <option value="18:00:00">18:00h</option>
            </select>
            <label>Número de Pessoas:*</label>
            <input type="text" name="nmPessoas" required/>
            <label>Tipo Café:</label>
            <select name="tipoCafe">
                <option value="">Selecione...</option>
                <option value="Simples">Simples</option>
                <option value="Completo">Completo</option>
                <option value="Almoço">Almoço</option>
            </select>
            <label>Tipo Reserva:*</label>
            <label><input type="radio" name="tipo" value="Normal" required/> Normal </label>
            <label><input type="radio" name="tipo" value="Grupo" required/> Grupo </label>
            <label>Ouve Pagamento Adiantado?*</label>
            <label><input type="radio" name="pagamentoAdiantado" value="Não" required/> Não </label>
            <label><input type="radio" name="pagamentoAdiantado" value="Sim" required/> Sim </label>
            <label>Observação: </label>
            <textarea maxlength="96" name="observacao"></textarea>
            <br><br>
            <input type="hidden" name="status" value="Reserva" />
            <input type="submit" name="cadastrarReserva" value="Cadastrar" />
            <input type="reset" value="Limpar"/>
        </form>
    </div>
</div>

ajax.js

jQuery(document).ready(function(){ 
jQuery('#cadastrarReserva').submit(function(){
    var dados = jQuery( this ).serialize();

    $.ajax({
        type: 'POST',
        dataType: 'json',
        url: "crud/insere.php",
        data: dados,
        success: function(data) {

            alert('alerta');
        }
    });
    return false;
});
});

insere.php

<?php
date_default_timezone_set('America/Sao_Paulo'); 
include('../../resources/conexao/conexao.php');

$cliente = $_POST ['idCliente'];
$data = $_POST['data'];
$data = implode("-",array_reverse(explode("/", $data)));
$hora = $_POST['hora'];
$nmPessoas = $_POST['nmPessoas'];
$checkboxTipoCafe = $_POST['tipoCafe'];
$checkboxTipoReserva = $_POST['tipo'];
$pagamentoAdiantado = $_POST['pagamentoAdiantado'];
$observacao = $_POST['observacao'];
$status = $_POST['status'];
$dataCadastro = date('Y-m-d  H:i:s');

if(empty($hora)){
    $insert = "INSERT INTO Reserva(idCliente, data, numeroPessoas, tipoCafe, tipo, pagamentoAdiantado, observacao, status, dataCadastro, cancelado) 
               VALUES ('$cliente', '$data', '$nmPessoas','$checkboxTipoCafe','$checkboxTipoReserva', '$pagamentoAdiantado', '$observacao', '$status', '$dataCadastro', 'N')";
} else {
    $insert = "INSERT INTO Reserva(idCliente, data, hora, numeroPessoas, tipoCafe, tipo, pagamentoAdiantado, observacao, status, dataCadastro, cancelado) 
               VALUES ('$cliente', '$data', '$hora', '$nmPessoas','$checkboxTipoCafe','$checkboxTipoReserva', '$pagamentoAdiantado', '$observacao', '$status', '$dataCadastro', 'N')";
}
$conexao = conexao();
$PDO = $conexao -> prepare($insert);
$PDO -> execute();

$retorno = array('id' => "teste");
    echo json_encode($retorno);*/
    
asked by anonymous 13.05.2016 / 18:31

1 answer

2

You're using two identical id's, id's unique! in modal and in form this RegisterReserve, then you try to give submit with them, if you use submit with the "form" or put another id will work.

See an example at jsfiddle

    
13.05.2016 / 19:06