JQuery DatePicker: How do I add a watermark?

A watermark is always a great way to provider a meaningful hint to a user. Using the JQuery DatePicker control, I wanted to tell the user the expected format of the date.

 I added a new class called 'watermarkrequired' to the required html elements to help me identify them.

I looked at several option:
1. Using the blur and focus events.

$('.watermarkrequired').blur(function () {
if ($(this).val().length == 0)
   $(this).val(watermark).addClass('watermark');
}).focus(function () {
if ($(this).val() == watermark)
    $(this).val('').removeClass('watermark');
}).val(watermark).addClass('watermark');

2. Using the 'AppendText' option of the DatePicker

$( ".watermarkrequired" ).datepicker( "option", "appendText", "(yyyy-mm-dd)" );

Finally, I settled on the placeholder attribute

$( ".watermarkrequired" ).attr("placeholder", "dd/mm/yyyy");

Comments

Post a Comment

Popular posts from this blog

SharePoint 2013: Error updating managed account credentials

I encountered the following message when trying to change a password for a managed account: Error deploying administration application pool credentials. Another deployment may be active. An object of the type Microsoft.SharePoint.Administration.SPAdminAppPoolCredentialDeploymentJobDefinition named "job-admin-apppool-change" already exists under the parent Microsoft.SharePoint.Administration.SPTimerService named "SPTimerV4".  Rename your object or delete the existing object. The error message is self explanatory - Rename your object or delete the existing object.  I choose the latter. Powershell to the rescue. $job = Get-SPTimerJob -Identity "job-admin-apppool-change" $job.Delete() Reset the password and all should be good.
Read more

Error deploying Nintex workflow: An item with the same key has already been added

My client recently upgraded their version of Nintex Workflow 2010 and suddenly some of my workflows started to fail on deployment. The following error cropped up: Error deploying workflow: Server was unable to process request. ---> An item with the same key has already been added. ---> An item with the same key has already been added. WTF???? A little digging unveiled the problem - I had two items in a 'Create Item' shape with the SAME DISPLAYNAME. I needed to move the second item to a new 'Update Item' shape in order for it to work. I order to get the workflow to deploy, I had to manually remove the 'duplicate' item from the serialized XML. Hooray!! It was then a simple matter of creating a new shape to update the 'duplicate' value.
Read more