Jump to content
View in the app

A better way to browse. Learn more.

FMForums.com

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

How to change date format for inputs in forms

Featured Replies

  • Author

Hi,

How can i change date format for inputs in forms into d/M/yyyy form?

Thanks

Adam Djuby

Hi,

How can i change date format for inputs in forms into d/M/yyyy form?

Thanks

Adam Djuby

  • Author

Hi,

How can i change date format for inputs in forms into d/M/yyyy form?

Thanks

Adam Djuby

Use three '<input' fields?

I've had to do this for hand-held display when using pop-downs ('<select', '<option'). You can recombine the fields into one date field if necessary.

Use three '<input' fields?

I've had to do this for hand-held display when using pop-downs ('<select', '<option'). You can recombine the fields into one date field if necessary.

Use three '<input' fields?

I've had to do this for hand-held display when using pop-downs ('<select', '<option'). You can recombine the fields into one date field if necessary.

  • Author

Thanks I'll use it as you advise.

But it was be beter if i could use in one input which has ">, <, ..." operator options.

Thanks

Adam Djuby

  • Author

Thanks I'll use it as you advise.

But it was be beter if i could use in one input which has ">, <, ..." operator options.

Thanks

Adam Djuby

  • Author

Thanks I'll use it as you advise.

But it was be beter if i could use in one input which has ">, <, ..." operator options.

Thanks

Adam Djuby

Because this is client-side, you need some JavaScript for format changes or date checks. The best is to do a Google search with terms like "javascript form dates" for examples.

Martin

Because this is client-side, you need some JavaScript for format changes or date checks. The best is to do a Google search with terms like "javascript form dates" for examples.

Martin

Because this is client-side, you need some JavaScript for format changes or date checks. The best is to do a Google search with terms like "javascript form dates" for examples.

Martin

  • 1 month later...

Right well I wish to input a date in the format dd/MM/yyyy but the wpe expects it in MM/dd/yyyy.

(I've changed the < > brackets for ( ) brackets to avoid the examples from being rendered.)

So I figured I'd take the tag (input type="text" name="date" size="15"/) and replace it with (input type="hidden" name="date" value=""/)

Then add three nameless (so they don't get submitted) fields (input type="text" size="2") (input type="text" size="2") (input type="text" size="4")

Next create an onSubmit attribute for the form tag like so ....

(form method="POST" enctype="x-www-form-urlencoded" onSubmit="buildDate();") (xsl:attribute name="action") results.xsl (/xsl:attribute)

Then create a simple javascript that joins the three nameless text fields into the hidden date field with the appropriate / delimeters, like so.

(script language="JAVASCRIPT")

(!--

function buildDate() {

document.forms[1].elements[8].value = document.forms[1].elements[18].value + '/' + document.forms[1].elements[17].value + '/' + document.forms[1].elements[19].value;

}

// --)

(/script)

All good, so you would think, ..well possibly you don't but I did anyway. However it doesn't work. The function just gets ignored. Change the extension of the file from xsl to html and all of a sudden the function works. So why is it my rather simple javascript function doesn't work with the xsl?

In contrast to XSLT, JavaScript elements start counting with 0 (zero).

Yeah I know. There are two forms on that page. Like I say the same code with an .html extension works (well the javascript function bit does) but with a .xsl extension it gets completely ignored.

I looked into one of my XSLT files that has JavaScript code in it, and found that I never used the comment tags after the script and before the /script tag.

The comment tags in your code are XSLT comment tags, which means that the text within them is just left out by the XSLT engine.

If you want to have comment tags in the resulting HTML code, use <xsl:comment>.

Easy solution, finally smile.gif

grin.gif Haha I feel so stupid. Yes, unsurprisingly removing the comments works perfectly.

Thankyou Martin for all you help.

Oh by the way, just in case anybody wishes to use the javascript above a couple of changes need to be made.

In the script as it is written above, the value of date if nothing entered is '//', this will error.

The solution would be to wrap it in a conditional statement to only set the date if the date component fields are entered.

If you do this you need to add an else statement to reset the value of date in case the user clicks on the Back button in their browser and enters another search after having searched on date. This is because the date is set from the previous search and when you go back those values aren't reset unless of course you reset them. As a hidden field though it isn't obvious that you need to do this.

Anyway the end result would look like this.

function buildDate() {

if (document.forms[1].elements[16].value != "" || document.forms[1].elements[17].value != "" || document.forms[1].elements[18].value != "") {

document.forms[1].elements[19].value = document.forms[1].elements[17].value + '/' + document.forms[1].elements[16].value + '/' + document.forms[1].elements[18].value;

} else {

document.forms[1].elements[19].value = ""

}

}

(elements[19] is the hidden date field and elements[16], [17] and [18] are the component parts of the date that display as text boxes)

You could add a return true; or return false; like this:

function buildDate() {

if (document.forms[1].elements[16].value != "" || document.forms[1].elements[17].value != "" || document.forms[1].elements[18].value != "") {

document.forms[1].elements[19].value = document.forms[1].elements[17].value + '/' + document.forms[1].elements[16].value + '/' + document.forms[1].elements[18].value;

return true;

} else {

document.forms[1].elements[19].value = "";

return false;

}

}

If true is returned, the form is submitted, if false, not.

Yep, JavaScript is great unless you need to do something with the PDAs & cell phones that don't use it. smile.gif

Create an account or sign in to comment

Important Information

By using this site, you agree to our Terms of Use.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.