Calendar Widget call in dialog box
I would like a dialog box to appear on my page that lets the user select a date from the calendar widget, however I cannot get the calendar to display from input fields within the dialog box. My code is:
<script type="text/javascript">
$(function(){
$('#cal').datepicker();
$('#create_sch').dialog({
modal: true,
autoOpen: false,
width: 240,
buttons: {
"Create Schedule": function(){
document.forms['create_sch_frm'].submit();
},
"Cancel": function(){
$(this).dialog("close");
}
}
});
$('#create_sch_link').click(
function(){
$('#create_sch').dialog('open');
return false;
}
).hover(
function(){ $(this).addClass('ui-state-hover'); },
function() { $(this).removeClass('ui-state-hover'); }
);
});
</script>
<div id="create_sch" title="Create Schedule">
<form id="create_sch_frm" action="create_schedule.php" method="post">
<input type="text" name="start" id="start" class="text ui-widget-content ui-corner-all" id="cal" />
</form>
</div>
Thanks