CODEWITHSUNDEEP
javascriptjqueryjquery-uijquery-pluginsplaceholder
heron
heron

Reputation: 3661

How to set placeholder with JS

Please take a look at this fiddle:

http://jsfiddle.net/KA85s/3/

JQ-UI sets first option as default. I don't want it to be happened: instead I want to set HTML5 placeholder.

How can I set HTML 5 placeholder (instead of first available <option>) for these JS generated inputs?

enter image description here

Upvotes: 5

Views: 25454

Answers (3)

Aamir Shahzad
Aamir Shahzad

Reputation: 6834

This will do all you need without cross browser compatibility issue i have tested in ie7,8,9 runs perfect.

<input type="text" value="Search" onfocus="if (this.value == 'Search') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search';}">

good luck!

Upvotes: 2

Meligy
Meligy

Reputation: 36594

Use:

input.attr("placeholder", value);

Updated jsfiddle:

http://jsfiddle.net/Meligy/KA85s/5/

In the example I just replaced your val() call, obviously, you can completely remove the part from the function and add it separately with any text you want.

Upvotes: 3

ShrekOverflow
ShrekOverflow

Reputation: 6916

@Mohamed Meligy came with the same solution

http://jsfiddle.net/KA85s/8/

Though i used something else..

here is how it works when your input element is created with use jQuery to give it a placholder attribute and we are done :D

** UPDATED **

http://jsfiddle.net/KA85s/19/

added custom default value :D

Upvotes: 1

Related Questions