Streaming live at 10am (PST)

I need to pass input data to another page in webflow


#1

Hello,

I’m trying to pass data to a second page in my site. I was given a plugin by our hotel management system. However, i cant get the java script to be called to display the calendar.

I need to pass data in this format to an embed page.

http://beach-break-surf-camp.webflow.io/playa-venao-instant-book?to=2018-03-16&from=2018-03-14

Below is the code i was given. However, when rendered the calendar does not show up.

I need to put this code in the header but i think it causes a conflict as it is not rendered on publishing.

put this 3 lines on the header of the website, be careful, this uses jquery, if other javascript library is present, must use jquery No Conflict

<link href="http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css" rel="stylesheet">
  <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
|


<div class="reservation-picker">
<div style="font-weight: bold; height: 30px; padding: 15px 0 10px 0;"><span class="restext"> Reservas </span></div>

<input id="from" type="text" value="DESDE" /> <br /> <input id="to" type="text" value="HASTA" /> <br /> <button id="search" class="minimal-indent">Buscar</button> <br /><br />
<script type="text/javascript">// <![CDATA[
$.datepicker.regional['es'] = {
 closeText: 'Cerrar',
 prevText: '<Ant',
 nextText: 'Sig>',
 currentText: 'Hoy',
 monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
 monthNamesShort: ['Ene','Feb','Mar','Abr', 'May','Jun','Jul','Ago','Sep', 'Oct','Nov','Dic'],
 dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'],
 dayNamesShort: ['Dom','Lun','Mar','Mié','Juv','Vie','Sáb'],
 dayNamesMin: ['Do','Lu','Ma','Mi','Ju','Vi','Sá'],
 weekHeader: 'Sm',
 firstDay: 1,
 isRTL: false,
 showMonthAfterYear: false,
 yearSuffix: ''
 };

 $.datepicker.setDefaults($.datepicker.regional['es']);

$(function() {

var to,
from;

$( "#from" ).datepicker({
defaultDate: "+1w",
showOn: "both",
buttonImage: "http://jqueryui.com/resources/demos/datepicker/images/calendar.gif",
buttonImageOnly: true,
changeMonth: true,
numberOfMonths: 1,
dateFormat: "yy-mm-dd",
onClose: function( selectedDate ) {
$( "#to" ).datepicker( "option", "minDate", selectedDate );
}
});
$( "#to" ).datepicker({
defaultDate: "+1w",
showOn: "both",
buttonImage: "http://jqueryui.com/resources/demos/datepicker/images/calendar.gif",
buttonImageOnly: true,
changeMonth: true,
dateFormat: "yy-mm-dd",
numberOfMonths: 1,
onClose: function( selectedDate ) {
$( "#from" ).datepicker( "option", "maxDate", selectedDate );
}

});

$('#search').click(function(){
from = $("#from").datepicker().val();
to = $("#to").datepicker().val();
window.location.href = "http://beach-break-surf-camp.webflow.io/playa-venao-instant-book?to="+to+"&from="+from;
});

});
// ]]></script>
</div>

#2

Welcome to the Webflow forum!

Could you please edit your post Screenshot_2017-08-16_140811 and provide ALL the necessary details in your post so we can take a look at your site/issue?

If you want faster replies and more accurate answers, it is recommended that you put in a bit more effort to include all the details listed in this link, so that forum members don’t have to waste time following up with you to request more information.

Hope to hear from you soon. Thanks!!!