Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Bom dia pessoal!
Tenho este formulário que carrega dois inputs do banco de dados. O primeiro lista os pacotes, e o segundo é listado em função do primeiro.
Quero enviar estas três variáveis : "servico" $serv, $price, $id , como também #date e #hour que contém os valores selecionados , pois vou precisar delas na outra página. Como enviar via Ajax ?
Script que fica dentro da pagina formulario.php
//pega o id do select pacote e manda para pagina valida.php.
$(document).ready(function(){
$('#pacote').change(function(){
var id_pacote = $(this).val();
var data = 'id_pacote='+id_pacote;
$.ajax({
type : "POST",
url : "assets/third_party/login/valida.php",
data : data,
cache : false,
success: function(html)
{
$('#servico').html(html);
}
})
});
});
Formulário.php
<form id="form-order" action="booking/personal.php" method="post" class="sky-form vp-form">
<div id="residential" class="service-list vp-form-line clearfix">
<span class="vp-form-icon"><i class="vp-icon vp-add"></i></span>
<label class="vp-form-item select">
<select class="pacote" name = "pacote" id = "pacote">
<?php
$SQL = "SELECT * FROM tb_pacote";
$query = mysqli_query($mysqli, $SQL);
while ($row = mysqli_fetch_array($query)){
$res = "<option ";
$res .="value='".$row['id_pacote']."' >";
$nome= $res .= $row['nome_pacote'];
$res .="</option>";
echo $res;
}
?>
</select>
<i></i>
</label>
</div>
<div class="vp-form-line clearfix">
<span class="vp-form-icon"><i class="vp-icon vp-supplies"></i></span>
<label class="vp-form-item select">
<select name="servico" class="select-service" id="servico">
<option value="0">Cleaning Plain</option>
</select>
<i></i>
</label>
</div>
<script>
$(document).ready(function(){
$('#servico').change(function(){
$serv = $(this).find('option:selected').text();
$price = $(this).find('option:selected').data("price");
$id = $(this).find('option:selected').val();
});
});
</script>
<div class="vp-form-line clearfix">
<span class="vp-form-icon"><i class="vp-icon vp-date"></i></span>
<label class="vp-form-item input">
<input name="date" type="text" name="date" id="date" value="Select date" />
</label>
</div>
<div class="vp-form-line clearfix">
<span class="vp-form-icon"><i class="vp-icon vp-time"></i></span>
<label class="vp-form-item select">
<select name="hour" id="hour">
<option value="0">Select Time</option>
<option value="08:00 AM">08:00 AM</option>
<option value="08:30 AM">08:30 AM</option>
<option value="09:00 AM">09:00 AM</option>
<option value="09:30 AM">09:30 AM</option>
<option value="10:00 AM">10:00 AM</option>
<option value="10:30 AM">10:30 AM</option>
<option value="11:00 AM">11:00 AM</option>
<option value="11:30 AM">11:30 AM</option>
<option value="12:00 PM">12:00 PM</option>
<option value="12:30 PM">12:30 PM</option>
<option value="01:00 PM">01:00 PM</option>
<option value="01:30 PM">01:30 PM</option>
<option value="02:00 PM">02:00 PM</option>
<option value="02:30 PM">02:30 PM</option>
<option value="03:00 PM">03:00 PM</option>
<option value="03:30 PM">03:30 PM</option>
<option value="04:00 PM">04:00 PM</option>
<option value="04:30 PM">04:30 PM</option>
<option value="05:00 PM">05:00 PM</option>
<option value="05:30 PM">05:30 PM</option>
<option value="06:00 PM">06:00 PM</option>
<option value="06:30 PM">06:30 PM</option>
<option value="07:00 PM">07:00 PM</option>
<option value="07:30 PM">07:30 PM</option>
<option value="08:00 PM">08:00 PM</option>
</select>
<i></i>
</label>
</div>
<input type="hidden" name="cart" id="cart-input" value="" />
<div class="vp-form-cart clearfix">
<span class="vp-form-icon"><i class="vp-icon vp-cart"></i></span>
<span class="vp-form-item">Cart</span>
</div>
<div id="cart"></div>
</div> <!-- end: box-content -->
<script type="text/template" id="item_template">
<span><%= this.model.get("title") %></span><span><%= this.model.get("price") %></span>
</script>
<script type="text/template" id="cart_template">
<div class="services clearfix">
<div id="cleaning_service" class="cart-line">
<div class="title">Cleaning Services</div>
<div class="price"><%= parseFloat(this.model.get("cleaning_total")).toFixed(2) %> </div>
<ul class="cart_added" id="teste"><li><span><%= this.model.get("cleaning_name") %></span><span><%= parseFloat(this.model.get("cleaning_total")).toFixed(2) %></span></li></ul>
</div>
<div id="additional_service" class="cart-line">
<div class="title"></div>
<div class="price"></div>
<ul id="additional_items" class="cart_added"></ul>
</div>
<div >
<div></div>
<div></div>
</div>
<div>
<div></div>
<div></div>
<ul></ul>
</div>
</div>
<div class="footer">
<table id="price-total">
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td> </td>
<td </td>
</tr>
<tr class="total">
<td>TOTAL</td>
<td class="text-right"><%= parseFloat(this.model.get("total") * 0 + +this.model.get("total")).toFixed(2) %></td>
</tr>
</table>
</div>
</script>
</form>
Página valida php.
<?php
include "conexao.php";
if(isset($_POST['id_pacote']))
{
$SQL = "SELECT * FROM tb_servico WHERE tb_pacote_id_pacote = '".$_POST['id_pacote'] . "'";
$query = mysqli_query($mysqli, $SQL);
while ($row = mysqli_fetch_array($query)){
$res = "<option ";
$res .="value='".$row['id_servico']."'";
$res .="data-price='".$row['preco_servico']."' >";
$res .= $row['nome_servico'];
$res .="</option>";
echo $res;
}
}
?>Carregando comentários...