Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Galera alguem poderia me explicar como faço isto ultilizando php? estou perdido
tenho que usar varias imagens?
De acordo que ele clica e seleciona a poltrona ela muda de cor
RED: OCUPADA
AZUL: LIVRE
/monthly_2019_08/DISTRIBUI--O-BANCOS-AZULSINHO.png.c9920eed3ac7c403b030729d1e14a4a9.png" />
@Salvatore eu recomendo você a fazer com JavaScript a mudança dos botões (poltronas), colocar os botões dentro de um FORM para chamar o arquivo PHP responsável por fazer a efetivação da compra, acho que o código abaixo vai de dar uma ajuda.
Botões mudam de cor ao clicar, de AZUL para VERMELHO.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Valida Checkbox</title>
<style>
button{
border-radius: 12px;
padding: 35px 50px;
font-weight: bolder;
color: #fff;
}
</style>
<script type="text/javascript">
function mudaCor(el){
var cor = el.style.backgroundColor;
if(cor == 'rgb(0, 0, 255)') {
el.style.backgroundColor = '#FF0000';
} else {
el.style.backgroundColor = '#0000FF';
}
}
</script>
<!-- Formulário de Cadastro Cliente -->
<div class="row container">
<p> </p>
<fieldset class="formulario" style="padding: 5px">
<legend><img src="imagens/sacola.png" alt="[imagem]"style="width:80px; height:45px"></legend>
<br>
<!-- Botões -->
<div class="input-field col s12">
<div class="linha1">
<button id="botao" data-numero="01" class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">01</button>
<button id="botao" data-numero="02" class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">02</button>
<button id="botao" data-numero="03" class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">03</button>
<button id="botao" data-numero="04" class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">04</button>
<button id="botao" data-numero="05" class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">05</button
</div>
<div class="linha2">
<button id="botao" data-numero="06"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">06</button>
<button id="botao" data-numero="07"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">07</button>
<button id="botao" data-numero="08"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">08</button>
<button id="botao" data-numero="09"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">09</button>
<button id="botao" data-numero="10"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">10</button>
</div>
<div class="linha3">
<button id="botao" data-numero="11"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">11</button>
<button id="botao" data-numero="12"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">12</button>
<button id="botao" data-numero="13"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">13</button>
<button id="botao" data-numero="14"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">14</button>
<button id="botao" data-numero="15"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">15</button>
</div>
<div class="linha4">
<button id="botao" data-numero="16"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">16</button>
<button id="botao" data-numero="17"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">17</button>
<button id="botao" data-numero="18"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">18</button>
<button id="botao" data-numero="19"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">19</button>
<button id="botao" data-numero="20"class="btn blue" style="width:120px; height:37px; background-color: #0000FF;" onclick="mudaCor(this)">20</button>
</div>
</div>
</fieldset>
</div>
</body>
</html>
Espero ter ajudado.
Att.
***Felipe Coutinho***
>
3 horas atrás, Salvatore disse:
tenho que usar varias imagens?
Não. Você pode usar o php para fazer a construção do html por repetições.
exemplo:
$img = "<div><img src=\"arquivo-de-imagem.formato\" alt=\"imagem\" /></div>";
echo (str_repeat($img, 30)); // A string será repetida 30 vezes
// OU
for ($i = 1; $i < 31; $i++) { // A string será repetida 30 vezes
>
3 horas atrás, Salvatore disse:
De acordo que ele clica e seleciona a poltrona ela muda de cor
Para isso você pode usar o css (input checkbox + label), só então enviar a informação de qual cadeira foi clicada para o servidor.
Porque?
A ação do click é computada pelo hardware do usuário, ou seja, jamais o php que é executado no servidor irá saber em que local o usuário clicou, por isso a necessidade de enviar os dados.
Vejamos um exemplo: