jQuery placeholder in IE passing validation…

[standuncan]

I have a small form where I cannot use labels, so I am using placeholders as labels. For the older browsers (this site has old IE users) I have installed a jQuery snippet to use the same placeholders, however now those placeholders pass the validation. Anyway around this?

form:

php

if(!empty($_POST)){



$name = stripcleantohtml($_POST);



$errors = array();



//Check the form fields

if(empty($name)){

$errors = '*';

}

jQuery

if (!("placeholder" in i)) {

$("input[placeholder]").each(function () {

var self = $(this);

self.val(self.attr("placeholder")).bind({

focus: function () {

if (self.val() === self.attr("placeholder")) {

self.val("");

}

},

blur: function () {

var label = self.attr("placeholder");

if (label && self.val() === "") {

self.val(label);

}

}

});

});

}

[standuncan]

Ughh, I never see the sections when I post, they always end up int he wrong spot :/

My bad!

[standuncan]

Yes, in IE due to the jQuery placeholder script, the actual placeholder “Name” (and others) pass validation, since I am only checking to see if the input has a string in it. This does not happen on email, because I am also checking to see if it is a valid email. I’m not 100% sure I understand what you’re saying. Can you explain it again or show an example for me please?

[standuncan]

This site was pushed live, (not up to me), and it has an adwords account, so it is getting traffic now. Some of the forms coming in are:

Name: John Doe

Phone: Phone <– placeholder

Email: [email protected]

etc. Any help would be appreciated.

[Mottie]

I’m confused, if it is PASSING validation. then what is the problem?

If you mean that is isn’t passing, then maybe put the placeholder content into the “alt” attribute, and if placeholder is supported in the browser, then copy the alt value over to placeholder.

Input

Script

// check if the browser supports placeholder

if (typeof(document.createElement('input').placeholder) !== 'undefined'){

// yes it does!

$('input[alt]').each(function(){

this.placeholder = this.alt;

});

} else {

// no it doesn't, add your placeholder plugin here

// but pull the placeholder value from the alt

}

[standuncan]

I tried what @TT_Mark said after a lot trying to figure out how and I came up with this, but don’t know if it is correct? It seems to be working though…

Any thoughts?

html:

php:

if(empty($name)){

$errors = 'Enter';

} else {

if (is_string("Name")) {

$errors = 'Enter your name';

}

}

[standuncan]

and for some reason this was working on 1 input, but not another, so then I tried this and it seems to be working for the most part too. Are either of these even correct?

if(empty($phone)){

$errors = '*';

} else {

if ($phone = "Phone") {

$errors = 'Enter your phone';

}

}

[standuncan]

Just in case anyone further reads or cares lol

I got it right above pretty much, but had the wrong assignment operator instead of the comparison operator.

Got it working now :D

if(empty($name)){

$errors = '*';

} else {

if ($name == "Name") {

$errors = '*';

}

}

[Mottie]

YAY!

[Author]

Posts