Boas pessoal estou com um grande problema, eu estou a criar um formulário num site, ele é assim:
Código (HTML):
Ele funcionava na perfeição até testar no firefox e no internet explorer...... O type date e hora não funcionam nesse browsers. Então comecei a procura de alternativas para a data já encontrei e está já alterada no código em cima. agora a hora não sei como fazer....... Encontrei isto: http://jdewit.github.io/bootstrap-timepicker/ aqui está exactamente o que procuro mas não consigo colocar a funcionar, será que me podem ajudar? Teoricamente seria apenas fazer o download disto: https://github.com/jdewit/bootstrap-timepicker e depois copy paste do exemplo que me interessa ou faltame algum passo?
Código (HTML):
<form class="form-horizontal ajax" action="reserva.php" method="post" >
<div class="form-group">
<label for="inputpercurso" class="col-sm-3 control-label">Percurso:</label>
<div class="col-sm-9">
<select class="form-control" id="inputpercurso" name="percurso">
<option value="Histórico Cultural" selected>Segway - Histórico Cultural</option>
<option value="Lazer">Segway - Lazer</option>
<option value="História e Lazer">Segway - História e Lazer</option>
<option value="Bom Jesus">Segway - Bom Jesus</option>
<option value="Voltinha">Segway - Voltinha</option>
<option value="" disabled></option>
<option value="Walking">Walking - Walking</option>
<option value="Gastronómico">Walking - Gastronómico</option>
<!--<option value="Gratuito">Walking - Gratuito</option>
<option value="" disabled></option>
<option value="Porto" disabled>Van - Porto</option>
<option value="Guimarães" disabled>Van - Guimarães</option>
<option value="Viana do Castelo" disabled>Van - Viana do Castelo</option>
<option value="Braga" disabled>Van - Braga</option>
<option value="Douro - Enológico" disabled>Van - Douro - Enológico</option>-->
</select>
</div>
</div>
<div class="form-group">
<label for="inputnome" class="col-sm-3 control-label">Nome:</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="inputnome" name="nome" placeholder="Nome" required>
</div>
</div>
<div class="form-group">
<label for="inputemail" class="col-sm-3 control-label">Email:</label>
<div class="col-sm-9">
<input type="email" class="form-control" name="email" id="inputemail" placeholder="email" required>
</div>
</div>
<div class="form-group">
<label for="inputtelefone" class="col-sm-3 control-label">Telefone:</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="inputtelefone" name="telefone" placeholder="Telefone" required>
</div>
</div>
<div class="form-group">
<label for="inputpessoas" class="col-sm-3 control-label">Numero de pessoas:</label>
<div class="col-sm-9">
<input type="number" min="1" max="8" class="form-control" name="pessoa" id="inputpessoas" placeholder="Pessoas" required>
</div>
</div>
<div class="form-group">
<label for="datepicker" class="col-sm-3 control-label">Data:</label>
<div class="col-sm-9">
<input type="text" class="span2 form-control date" name="dia" placeholder="dd/mm/aaaa" required readonly><span class="add-on"><i class="icon-th"></i></span>
</div>
</div>
<div class="form-group">
<label for="inputhora" class="col-sm-3 control-label">Hora:</label>
<div class="col-sm-9">
<input type="time" class="form-control" name="hora" id="inputhora" required>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-3 col-sm-9">
<div class="checkbox">
<label>
<input type="checkbox" name="visto" id="check"> Declaro que li e aceito todas as condições que estão nas FAQs.
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-3 col-sm-9">
<button type="submit" class="btn btn-default">Reservar</button>
<div id="alert"></div>
</div>
</div>
</form>
<div class="form-group">
<label for="inputpercurso" class="col-sm-3 control-label">Percurso:</label>
<div class="col-sm-9">
<select class="form-control" id="inputpercurso" name="percurso">
<option value="Histórico Cultural" selected>Segway - Histórico Cultural</option>
<option value="Lazer">Segway - Lazer</option>
<option value="História e Lazer">Segway - História e Lazer</option>
<option value="Bom Jesus">Segway - Bom Jesus</option>
<option value="Voltinha">Segway - Voltinha</option>
<option value="" disabled></option>
<option value="Walking">Walking - Walking</option>
<option value="Gastronómico">Walking - Gastronómico</option>
<!--<option value="Gratuito">Walking - Gratuito</option>
<option value="" disabled></option>
<option value="Porto" disabled>Van - Porto</option>
<option value="Guimarães" disabled>Van - Guimarães</option>
<option value="Viana do Castelo" disabled>Van - Viana do Castelo</option>
<option value="Braga" disabled>Van - Braga</option>
<option value="Douro - Enológico" disabled>Van - Douro - Enológico</option>-->
</select>
</div>
</div>
<div class="form-group">
<label for="inputnome" class="col-sm-3 control-label">Nome:</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="inputnome" name="nome" placeholder="Nome" required>
</div>
</div>
<div class="form-group">
<label for="inputemail" class="col-sm-3 control-label">Email:</label>
<div class="col-sm-9">
<input type="email" class="form-control" name="email" id="inputemail" placeholder="email" required>
</div>
</div>
<div class="form-group">
<label for="inputtelefone" class="col-sm-3 control-label">Telefone:</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="inputtelefone" name="telefone" placeholder="Telefone" required>
</div>
</div>
<div class="form-group">
<label for="inputpessoas" class="col-sm-3 control-label">Numero de pessoas:</label>
<div class="col-sm-9">
<input type="number" min="1" max="8" class="form-control" name="pessoa" id="inputpessoas" placeholder="Pessoas" required>
</div>
</div>
<div class="form-group">
<label for="datepicker" class="col-sm-3 control-label">Data:</label>
<div class="col-sm-9">
<input type="text" class="span2 form-control date" name="dia" placeholder="dd/mm/aaaa" required readonly><span class="add-on"><i class="icon-th"></i></span>
</div>
</div>
<div class="form-group">
<label for="inputhora" class="col-sm-3 control-label">Hora:</label>
<div class="col-sm-9">
<input type="time" class="form-control" name="hora" id="inputhora" required>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-3 col-sm-9">
<div class="checkbox">
<label>
<input type="checkbox" name="visto" id="check"> Declaro que li e aceito todas as condições que estão nas FAQs.
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-3 col-sm-9">
<button type="submit" class="btn btn-default">Reservar</button>
<div id="alert"></div>
</div>
</div>
</form>
Ele funcionava na perfeição até testar no firefox e no internet explorer...... O type date e hora não funcionam nesse browsers. Então comecei a procura de alternativas para a data já encontrei e está já alterada no código em cima. agora a hora não sei como fazer....... Encontrei isto: http://jdewit.github.io/bootstrap-timepicker/ aqui está exactamente o que procuro mas não consigo colocar a funcionar, será que me podem ajudar? Teoricamente seria apenas fazer o download disto: https://github.com/jdewit/bootstrap-timepicker e depois copy paste do exemplo que me interessa ou faltame algum passo?