Tenho um formulário de booking que envia os dados para uma URL e na página da URL os dados são tratados. Contudo tenho o problema, a URL não consegue ler a variável dos campos data, pois o date picker envia os parâmetros com barra "/".
Estou utilizando o datepicker do Foundation.
http://jsfiddle.net/thallysondias/6e03wgLL/
$(function () {
window.prettyPrint && prettyPrint();
$('#dp1').fdatepicker({
format: 'dd/mm/yyyy'
});
$('#dp2').fdatepicker({
closeButton: true
});
// implementation of disabled form fields
var nowTemp = new Date();
var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);
var checkin = $('#dpd1').fdatepicker({
onRender: function (date) {
return date.valueOf() < now.valueOf() ? 'disabled' : '';
}
}).on('changeDate', function (ev) {
if (ev.date.valueOf() > checkout.date.valueOf()) {
var newDate = new Date(ev.date)
newDate.setDate(newDate.getDate() + 1);
checkout.update(newDate);
}
checkin.hide();
$('#dpd2')[0].focus();
}).data('datepicker');
var checkout = $('#dpd2').fdatepicker({
onRender: function (date) {
return date.valueOf() <= checkin.date.valueOf() ? 'disabled' : '';
}
}).on('changeDate', function (ev) {
checkout.hide();
}).data('datepicker');
});
<link href="http://luteciahotel.com/css/foundation-datepicker.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://luteciahotel.com/js/datepicker/foundation-datepicker.js"></script>
<!-- INICIO BOOKING -->
<div id="booking" class="booking show-for-medium-up">
<div class="row">
<form action="https://reservations.omnibees.com/default.aspx" method="GET" target="_blank">
<input type="hidden" id="q" name="q" value="1316" />
<input type="hidden" id="lang" name="lang" value="pt-PT" />
<div class="medium-2 columns">
<input type="text" value="" id="dpd1" placeholder="Check-in" name="CheckIn" readonly/>
</div>
<div class="medium-2 columns">
<input type="text" value="" id="dpd2" name="CheckOut" placeholder="Check-out" readonly/>
</div>
<div class="medium-2 columns">
<select id="ad" name="ad">
<option value="1" selected>Adulto</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
</div>
<div class="medium-2 columns">
<select id="ch" name="ch">
<option value="0" selected>Criança</option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
</div>
<div class="medium-2 columns">
<input type="text" name="Code" id="Code" placeholder="cod. promocial"/>
</div>
<div class="medium-2 columns">
<input type="submit" class="button expand tiny" style="margin:0;border:0 !important;" value="Reservar">
</div>
</form>
</div>
</div>
<!--/ FIM BOOKING -->
Neste momento a o valor da data fica com este formato na URL
CheckIn=31%2F01%2F2015
&CheckOut=18%2F03%2F2015
.
Impossibilitando assim a leitura correta da variavel, pois o correto seria:
CheckIn=31012015
&CheckOut=18032015
.
Removendo o valor %2F
.
Como eu poderia enviar a variavel sem a "/" do datepicker?
Vi algo assim:
var textarea = $('#the_textarea');
var txt = textarea.val();
textarea.val(txt.replace(' ', '-'));
Mas não estou sabendo como usar!
javascript
?onSubmit
na tag doform
e executar umreturn
de um método que retiraria as barras e retornariatrue
. Vale uma tentativa. (onSubmit="return metodo()"
)