У меня есть слайдер на моей главной странице и разработано простое приложение datepicker, которое также должно отображаться на главной странице. Я использовал Jumi для создания модуля, который имеет полный модуль datepicker, включая часть Javascript и вызов библиотеки Joomla JQuery. Однако, когда я пытаюсь отобразить как слайдер, так и датупик на той же странице, ползунок исчезает. Я уверен, что это проблема JQuery. Когда я удаляю вызов Jquery из моего модуля, появляется слайдер, но функция datepicker перестает работать.
Я пробовал практически все, включая режим NoConflict, но ничего не решил. Каков наилучший способ вызвать библиотеку JQuery в этом модуле Jumi? Мне в основном нужно вызывать эту библиотеку только один раз и использовать обе функции, но способ сделать это за пределами меня.
Код в модуле:
<link rel="stylesheet" href="/jquery-ui-1.10.3.custom.css" type="text/css" />
<script src="/jquery-1.9.1.js"></script>
<script src="/jquery-ui-1.10.3.custom.js"> </script>
<script src="/jquery.ui.datepicker-nl.js"></script>
<script src="/staying_length_cal.js"></script>
<script type="text/javascript">
$(function() {
$('input.datepicker').datepicker({
dateFormat: 'dd/mm/yy',
yearRange: "-0:+2",
changeMonth: true,
buttonImage: 'images/calendar.gif',
changeYear: true,
showOn: 'both',
buttonImageOnly: false
},
$.datepicker.regional['nl']);
});
</script>
<?php
if(isset($_POST['submit']))
{
$nights = $_POST['nights'];
$persons = $_POST['persons'];
$start_date = $_POST['start_date'];
$end_date = $_POST['end_date'];
header ("Location: Link that uses form information");}
?>
<form method="post" id="stayingCalculation">
<fieldset>
<h4>Ik zoek</h4>
<select id="stayLength" name="nights" onchange="calculateTotal(); " />
<option value="week">Week</option>
<option value="midweek">Midweek</option>
<option value="weekend">Weekend</option>
<option value="twoweek">Twee weken</option>
<option value="threeweek">Drie weken</option>
<option value="3">3 Nachten</option>
<option value="4">4 Nachten</option>
<option value="5">5 Nachten</option>
<option value="6">6 Nachten</option>
<option value="7">7 Nachten</option>
<option value="8">8 Nachten</option>
<option value="9">9 Nachten</option>
<option value="10">10 Nachten</option>
<option value="11">11 Nachten</option>
<option value="12">12 Nachten</option>
<option value="13">13 Nachten</option>
<option value="14">14 Nachten</option>
<option value="15">15 Nachten</option>
<option value="16">16 Nachten</option>
<option value="17">17 Nachten</option>
<option value="18">18 Nachten</option>
<option value="19">19 Nachten</option>
<option value="20">20 Nachten</option>
</select>
<h4>met</h4>
<select name="persons">
<option value="0">Niet relevant</option>
<option value="1">1 persoon</option>
<option value="2">2 personen</option>
<option value="3">3 personen</option>
<option value="4">4 personen</option>
<option value="5">5 personen</option>
<option value="6">6 personen</option>
</select>
<br/>
<h4>tussen</h4>
<p> <input type="text" name="start_date" id="start_date" value="" class="datepicker" data-jquerydateformat="dd-mm-yy" data-isodateformat="dd-mm-yyyy" onchange="setExpDate(this.value)" />
</p>
<h4>en</h4>
<p> <input type="text" name="end_date" id="end_Date" value="" class="datepicker" data-jquerydateformat="dd-mm-yy" data-isodateformate="dd-mm-yyyy" onchange="setStartDate(this.value)" /> </p>
</fieldset>
<input type="submit" name="submit" value="Zoeken" class="btn btn-primary"><br>
</form>
Заранее спасибо!
У меня была та же проблема, и я решил это, используя:
<script>
jQuery.noConflict();
jQuery(function() {
jQuery( "#datepicker1" ).datepicker();
jQuery( "#datepicker2" ).datepicker();
});
</script>
вместо $(...
Возможно, это тоже поможет вам!
Для множественных включений jQuery вы можете использовать плагин jQueryEasy, который пытается включить только один раз jQuery.
Загрузить плагин Установить плагин Включить плагин На странице конфигурации плагина включите jQuery.
Все это.
http://extensions.joomla.org/extensions/core-enhancements/performance/jquery-scripts/18327