Ola pessoal alguem poderia me dizer de como eu faço para criar um select igual da imagem
Eu vi isso em um site estrangeiro e achei top isso para reserva de hotel
Eu vi o codigo do select deles esta assim
<!-- = reservation form /--><sectionclass="st-row"id="reservation"><divclass="container"><divclass="hr-heading rotate"><h1>Reservation</h1><small>book your unforgettable pleasure time</small></div><divclass="row"><!-- ¬ form /--><divclass="col-sm-6 col-md-5 col-md-offset-1 col-lg-4 col-lg-offset-2 item-sm"><formclass="booking-form js-form-booking"action="#"method="POST"autocomplete="off"><divclass="row row-sm"><divclass="form-group col-xs-12"><labelclass="label-control">Your name <spanclass="label-warn">*</span></label><inputclass="form-control"type="text"name="name"required></div><divclass="form-group col-xs-12"><labelclass="label-control">Your e-mail <spanclass="label-warn">*</span></label><inputclass="form-control"type="email"name="email"required></div><!-- datepicker/clockpicker *--><divclass="form-group col-xs-12"><divclass="row row-sm input-daterange"><divclass="col-xs-6"><labelclass="label-control">date from <spanclass="label-warn">*</span></label><inputclass="form-control datepicker"data-date-format="mm/dd/yyyy"name="date_from"required></div><divclass="col-xs-6"><labelclass="label-control">date to <spanclass="label-warn">*</span></label><inputclass="form-control datepicker"data-date-format="mm/dd/yyyy"name="date_to"required></div></div></div><divclass="form-group col-xs-12"><divclass="row row-sm"><divclass="col-xs-6"><labelclass="label-control">time <spanclass="label-warn">*</span></label><inputclass="form-control clockpicker js-input-time"type="text"name="time_from"required></div><divclass="col-xs-6"><labelclass="label-control">time <spanclass="label-warn">*</span></label><inputclass="form-control clockpicker js-input-time"type="text"name="time_to"required></div></div></div><!-- ¬ number-of-reversed /--><divclass="form-group col-xs-12"><labelclass="label-control"># people <spanclass="label-warn">*</span></label><divclass="select-reserved"><divclass="row row-sm"><divclass="form-group col col-xs-6"><selectclass="js-select-reserved"><optionvalue="1">1</option><optionvalue="2">2</option><optionvalue="3">3</option><optionvalue="4">4</option><optionvalue="5">5</option><optionvalue="6">6</option></select></div><divclass="form-group col col-xs-6"><inputclass="select-reserved__check js-reserved-check"id="checkReset"type="checkbox"><labelfor="checkReset"><iclass="fa fa-check"></i><spanclass="span">I have more than 6 people in my party</span></label></div></div></div></div><!-- end number-of-reversed /--><divclass="col-xs-12"><divclass="form-group"><labelclass="label-control">Special requests</label><textareaclass="form-control"rows="10"name="message"></textarea></div></div><divclass="col-xs-12"><divclass="booking-form__submit col-auto"><buttonclass="btn btn--darker"type="submit">make reservation</button></div></div></div></form></div><!-- end form /-->
Coloquei ele completo para que possam ver o Formulario completo
porem preciso apenas fazer da mesma forma no SELECT
<!-- ¬ number-of-reversed /--><divclass="form-group col-xs-12"><labelclass="label-control"># people <spanclass="label-warn">*</span></label><divclass="select-reserved"><divclass="row row-sm"><divclass="form-group col col-xs-6"><selectclass="js-select-reserved"><optionvalue="1">1</option><optionvalue="2">2</option><optionvalue="3">3</option><optionvalue="4">4</option><optionvalue="5">5</option><optionvalue="6">6</option></select></div>
Ola bom dia pessoal..
Quero fazer do meu select option que ele se torne uma caixa de pesquisa sendo ela automatico
quando for selecionado o nome fiz assim mais não tive o resultado que eu precisei
Ex:
<div class="col-md-12">
<div class="form-group">
<!--<label>Categoria:</label>-->
<select class="form-control select2" required>
<option>Selecione uma Cidade</option>
<?php $Query = DBRead('c_cidade','*','WHERE id > 0 ORDER BY categoria ASC'); if (is_array($Query)) { foreach ($Query as $c_dados) { ?>
<option value="https://meudominio.com/<?php echo $c_dados['categoria']; ?>"><?php echo $c_dados['categoria']; ?> <?php echo $c_dados['uf']; ?> <?php echo $c_dados['pais']; ?></option>
<?php } } ?>
</select>
</div> </div>
script
<script type="text/javascript">
$(document).ready(function() {
$(".select2").select2();
});
</script>
Css
<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet" />
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>
Se puderem me ajudar ai ficaria grato
tenho um select option que lista uma tabela com nomes dos clientes, quando uso esse select em outro form ele lista os nomes completo como: Josenilson pereira, Vanderlei Divino etc.
Só que ao retornar isso em uma variável para verificar se esta passando o valor correto como esta na tabela, só esta retornando o primeiro nome Josenilson o pode ser ?
desde já agraço, abaixo esta o código de como estou fazendo para listar os dados vindo da tabela em um select option.
<select>
<option name"motorista">
MOTORISTA
<?php
$busca = 'SELECT * FROM motorista order by motorista';
$result = $db->query($busca, PDO::FETCH_ASSOC) or die("erro ao conectar");
foreach ($result as $row){
echo '<option value='.$row['motorista'].'>'.$row['motorista'].'</option>';
}
?>
</option>
</select>
Olá galera, por favor estou tentando exibir o resultado desses Select options porem quando eu tento mostrar no ECHO do php
ele só esta me retornando o ID da tabela, o que esta errado ?
Código HTML com o select option
<?php
require_once('php/conecta.php');
$busca = 'SELECT * FROM frota_cavalo ';
$result = $db->query($busca, PDO::FETCH_ASSOC) or die("erro");
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Estados e cidades</title>
<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="js/meuCodigo.js"></script>
</head>
<body>
<table>
<form name="" action="teste.php" method="post">
<select id="categoria" name="frota">
<option value="" name"frota">
Selecione a frota
</option>
<?php
foreach ($result as $row){
echo '<option value='.$row['idFrota_Cavalo'].'>'.$row['N_Frota_Cavalo'].'</option>';
}
?>
</select>
</div>
<select id= "resultado" name="placa" >
<option value="estados" name"placa">
Selecione a placa
</option>
</select>
</td>
</tr>
<button type="submit" name="cadastro" class="btn btn-success">Cadastrar</button>
</form>
</table>
</body>
</html>
Pagina que recebe o resultado,
obs: abaixo na parte html eu já tentei retornar todas as variáveis possíveis, porem só recebo como retorno o ID da tabela, e não
os valores que coloco nos Select.
<?php
//----------------------FUNÇÃO CADASTRO---------------------
if (isset($_POST['cadastro'])) :
$frota = filter_input(INPUT_POST,"frota",FILTER_SANITIZE_STRING);
$placa = filter_input(INPUT_POST,"placa",FILTER_SANITIZE_STRING);
$estados = filter_input(INPUT_POST,"estados",FILTER_SANITIZE_STRING);
$categoria = filter_input(INPUT_POST,"categoria",FILTER_SANITIZE_STRING);
else :
echo "erro ao cadastrar";
endif;
//endif;
//--------------FIM---DA----FUNÇÃO CADASTRO---------------------
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="bootstrap-3.3.6-dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="CSS/A4.css">
<title>teste</title>
</head>
<body>
<?php echo "$frota";?><br>
<?php echo "$placa";?><br>
<?php echo "$estados";?><br>
<?php echo "$categoria";?><br>
</body>
</html>
Olá pessoal estou usando uma função Ajax com uma lista de arquivos para manipular em um <select option> os ESTADOS E CIDADES no meu formulário.
a função e esta
<script type="text/javascript">
$(document).ready(function () {
$.getJSON('estados_cidades.json', function (data) {
var items = [];
var options = '<option value="">escolha um estado</option>';
$.each(data, function (key, val) {
options += '<option value="' + val.nome + '">' + val.nome + '</option>';
});
$("#estados").html(options);
$("#estados").change(function () {
var options_cidades = '';
var str = "";
$("#estados option:selected").each(function () {
str += $(this).text();
});
$.each(data, function (key, val) {
if(val.nome == str) {
$.each(val.cidades, function (key_city, val_city) {
options_cidades += '<option value="' + val_city + '">' + val_city + '</option>';
});
}
});
$("#cidades").html(options_cidades);
}).change();
});
});
</script>
e o meu html no caso o select option
<!--inicio do seletor-ESTADO-->
<select id="estados" style="width:170px;font-size: 13px" name="uf" required class="form-control">
<option value=""></option>
</select>
<!--fim do seletor-ESTADO-->
<!--inicio do seletor-CIDADE-->
<select id="cidades" style="width:220px;font-size: 13px" name="cidade" value="<?php echo $cliente['Cidade']; ?>"required class="form-control" >
<option value=""></option>
</select>
<!--fim do seletor-CIDADE-->
Esta funcionando tudo bem, eu consigo salvar o que seleciono no option normalmente, porem a minha dificuldade e na hora de editar esse bendito select option, como eu retorno os valores em option ? digo na hora de editar os inputs eu consigo trazer o que já esta cadastrado só que o select option vem vazio, não estou conseguindo retornar os valores no select de ESTADOS e Cidades.
como faço isso ?
Deixo aqui meu agradecimento e um pequeno pedido, se for possível posta a resolução como chego nesse resultado, pois estou iniciando na programação.
Ola pessoal alguem poderia me dizer de como eu faço para criar um select igual da imagem
Eu vi isso em um site estrangeiro e achei top isso para reserva de hotel
Eu vi o codigo do select deles esta assim
Coloquei ele completo para que possam ver o Formulario completo
porem preciso apenas fazer da mesma forma no SELECT
Desde já agradeço...
Compartilhar este post
Link para o post
Compartilhar em outros sites