Reputation: 85
Presently my project page is having a jQuery datepicker inline placed on one of the section of the page. The below code is used to achieve the same.
<link rel="stylesheet" href="~/Scripts/Calendar/jquery-ui-1.10.1.custom.css">
<script src="~/Scripts/Calendar/jquery-1.9.1.js"></script>
<script src="~/Scripts/Calendar/jquery-ui-1.10.1.custom.js"></script>
<script>
$(document).on("change", "#datepicker", function () {
var date = $(this).val();
$( "#dialog" ).dialog();
});
</script>
// The below section is in one of the sections
<div id="datepicker" style="font: 80% 'Trebuchet MS', sans-serif;"></div>
<script>
$("#datepicker").datepicker();
</script>
.
.
.
<div id="dialog-modal" title="Basic modal dialog">
<p>Adding the modal overlay screen.</p>
</div>
Now I would have to show a jQuery dialog with information, when the user click's on a specific date.
Well I tried to call the dialog
$(document).on("change", "#datepicker", function () {
var date = $(this).val();
$( "#dialog" ).dialog();
});
but it shows an error as Object doesn't support property or method dialog.
Could any body put me in the right direction.
Thank you
Upvotes: 1
Views: 2487
Reputation: 546
I think you are including jquery
twice. You have a jquery-1.9.1.js
and also some other jquery-1.x.x.js
script files included, or same jquery-1.9.1.js
2nd time Everything seems to be plugging into the first instance and then the last include overrides $
. So that's why you're seeing this error message.
Please review once again..
also Include $j = jQuery.noConflict();
into your script tag to avoid conflicts!
Upvotes: 0
Reputation: 123739
Have a look this fiddle to see if this helps.
$("#datepicker").datepicker();
$("#datepicker").change(function(){
var date = $(this).val();
$('<div>' + date + '</div>').dialog();
});
Upvotes: 1