close ad
WARNING: Do Not Install the DREAMWEAVER CC 2017 Update »
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

Date Picker for Data Assist?

Thread began 9/19/2010 7:38 am by post89658 | Last modified 12/11/2010 7:21 pm by post89658 | 4482 views | 39 replies

neilo

Hi Bjørn,

I don't think DataAssist supports datepicker (yet - I expect it will in a future release). It is a simple procedure to do for yourself, though.


1. Download and unzip the attached archive, (it contains the jquery .js & .css files and images folder) Upload that folder (datepicker) into to the same directory as your 'xxxxxInsert.php' file.

2. Paste the following three lines between the <head></head> tags of your 'xxxxxInsert.php' page:

<link type="text/css" href="datepicker/jquery-ui-1.8rc1.custom.css" rel="stylesheet" />
<script type="text/javascript" src="datepicker/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="datepicker/jquery-ui-1.8rc1.custom.min.js"></script>

3. Paste the following javascript code also between the <head></head> tags of your 'xxxxxInsert.php' page (somewhere after the lines mentioned in step 2 - just before the closing </head> tag would do:

<script type="text/javascript">
$(function(){
$('#event_date').datepicker({
changeMonth: true,
changeYear: true,
dateFormat: 'yy-mm-dd',
onClose: closeDatePicker_event_date
});
});
function closeDatePicker_event_date() {
var tElm = $('#event_date');
if (typeof Date_Picker_Spry != null && typeof Date_Picker_Spry != "undefined") {
Date_Picker_Spry.validate();
}
var docElm = document.getElementById("event_date");
var tBlur = docElm.getAttribute("onBlur");
if (!tBlur) tBlur = docElm.getAttribute("onblur");
if (!tBlur) tBlur = docElm.getAttribute("ONBLUR");
if (tBlur) {
tBlur = tBlur.replace(/\bthis\b/g, "docElm");
eval(tBlur);
}
}
</script>

4. Change the name of the variables (color-coded blue) in the code above to match the ID of the date field that you want to apply the date picker to. The ID will be shown in the code for the date field on your page, i.e. :


<td width="371" valign="top" class="WADADataTableCell"><input type="text" name="event_date" id="event_date" value="" size="38" /></td>

5. if you want a datepicker on more than one date field, just duplicate the block of javascript code in (3.) above, and change the same variables to the ID of your second date field.

6. Upload your 'xxxxxInsert.php' page and the datepicker folder containing the jquery .js and .css files.

Attached Files
datepicker.zip

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...