Support for HTML 5 placeholder attribute

[Jim Coyne]

I've created a function to add support for the HTML placeholder attribute. You can use it to include some extra helpful text in input fields:

It's real simple to use - just include a call to the function in an onLoad script with the name of the field/variable and the text you want displayed:

u_addPlaceholderAttribute('short_description', 'Enter a short description of the problem');

I've tested it in Chrome, Firefox and Opera on Windows 7 and it works. Of course it does not work in current version of IE, but it does work in the upcoming IE 10.

Here's the script:

function u_addPlaceholderAttribute(variableName, hint) {
   try{
       var fieldName = g_form.getControl(variableName).name.toString();
       if (Prototype.Browser.IE) {
           fieldName.placeholder = hint;
       } else {
           $(fieldName).writeAttribute('placeholder', hint);
       }
   } catch(err) {}
}

I've also attached it as an XML export of the function - just remove the ".txt" extension and import it into your instance.

[srikanth74]

Hi @Jim Coyne 

How can we add placeholder for Name-value-pair field? 

[will_smith]

Hi Jim, we're on Fuji (patch 11). I made the "u_addPlaceholderAttribute" as a UI Script. I couldn't tell from the posting where to put the script. Let me try it as a Script Include and see if that works...

[will_smith]

Still not working after moving to a script include.

[Jim Coyne]

My bad, I'm sorry, not enough sleep last night.   It should in fact be a UI Script as you had it originally.

You will want to add the onLoad script as a Catalog Client Script for that particular catalog item.

[will_smith]

Hmm... still not seeing it on the catalog item... works on the Incident table without an issue! I need just a bit more help to get me over the hurdle, as I'm not sure what else I'm missing.

-- Try It: Catalog item --

-- Cat Item Client Script --