Quantcast
Channel: Tópicos
Viewing all articles
Browse latest Browse all 14700

FORM Submit com AJAX/Jquery

$
0
0
Olá amigos,

Sou novo no fórum, estou precisando de ajuda, de uma luz no fundo do túnel,  de um caminho para transforma uma tabela em forma de calendário, utilizando AJAX, conforme imagem abaixo:

Imagem Colocada

Atualmente quando clico em Reservar, é verificado se o cliente tem menos de 5 mesas, se sim é gravado no banco de dados, é feito um submit e a pagina carregada novamente.

Como eu poderia fazer essa verificação e gravação utilizando AJAX?

Desde já agradeço a ajuda!

Abaixo segue meu código:

Código :
<?php
//Rotina em php utilizado para verificar a quantidade de mesas e gravação no BD
if (isset($_POST['submit']) && $_POST['submit'] == 'reservarMesa') {

//Consulta quantidade de mesas reservadas para cliente
$check = $mysqli->query("SELECT 'X' FROM mesa WHERE cliente_id = '".$cliente_id."'");

$totaMesa = $check->num_rows;



// Sen o cliente tem mais de 5 mesas, retorna mensagem de erro
if ($totalMesa >= 5) {

//Mensagem
$msgBox = alertBox("Você não pode reservar mais mesas.", "<i class='icon-remove-sign'></i>", "danger");

} else {

//Reserva a mesa se menor que 5 reservas
$stmt = $mysqli->prepare("
         INSERT INTO
         mesa(
                 cliente_id,
                 mesa_id,
                 dia_id
               
         ) VALUES (
                 ?,
                 ?,
                 ?
         )");
$stmt->bind_param('sss',
$_POST['cliente_id'],
$_POST['mesa_id'],
$_POST['dia_id']
);
$stmt->execute();

//Retorna mensagem de reservado
$msgBox = alertBox("Reservado", "<i class='icon-check-sign'></i>", "success");
$stmt->close();

}

}
?>

Código HTML:

Código :
<html>
<head>
<title>Reserva Mesa</title>
</head>
<body>

<?php if ($msgBox) { echo $msgBox; } ?>

<table width="353" border="1">
<tr>
<td width="64"> </td>
<td width="123">Dia 1</td>
<td width="144">Dia 2</td>
</tr>
<tr>
<td>Mesa 1</td>
<td>
<form method="post" class="iconForm">
<input name="cliente_id" type="hidden" value="1" />
<input name="mesa_id" type="hidden" value="1" />
<input name="dia_id" type="hidden" value="1" />
<button type="input" name="submit" id="submit" value="reservarMesa">Reservar</button>
</form>

</td>
<td>
<form method="post" class="iconForm">
<input name="cliente_id" type="hidden" value="1" />
<input name="mesa_id" type="hidden" value="1" />
<input name="dia_id" type="hidden" value="2" />
<button type="input" name="submit" id="submit" value="reservarMesa">Reservar</button>
</form>
</td>
</tr>
<tr>
<td>Mesa 2</td>
<td><img src="img/reservado.gif"/></td>
<td><img src="img/reservado.gif"/></td>
</tr>
<tr>
<td>Mesa 3</td>
<td><img src="img/reservado.gif"/></td>
<td><img src="img/reservado.gif"/></td>
</tr>
</table>
</body>
</html>

Viewing all articles
Browse latest Browse all 14700