Everything works fine across all browsers at this point except one check. I'm trying to show up text checking the database to see if an email is there or not. This works fine in IE. Chrom and Firefox don't show up the text at all. Here's the part it's calling.
PHP Code:
<script type="text/javascript">
//validate email upon input
$('form.register_form input[name=email]').bind("oninput", function ()
{
alert("here");
var messageBox = $('form.register_form span#msgbox2');
var input = $(this);
var getData = $.post('classes/class.availability.php', { email:input.val() });
getData.done(function(data) {
//if correct login detail
if (data == 'empty')
{
// blank input
messageBox.fadeTo(200,.8,function() {
//add message and change the class of the box and start fading
messageBox.html('Please put in a valid email!').addClass('messageboxerror').fadeTo(900,1);
});
}
if (data == 'yes')
{
// email is available
messageBox.fadeTo(200,0.8,function() {
//add message and change the class of the box and start fading
messageBox.html('This email is available to register!').addClass('messageboxok').fadeTo(900,1);
});
}
if (data == 'no')
{
// email is not in database
messageBox.fadeTo(200,0.8,function() {
//add message and change the class of the box and start fading
messageBox.html('This email could not be found in our database!').addClass('messageboxerror').fadeTo(900,1);
});
}
if (data == 'already')
{
// email has already been registered
messageBox.fadeTo(200,0.8,function() {
//add message and change the class of the box and start fading
messageBox.html('This email is already registered!').addClass('messageboxerror').fadeTo(900,1);
});
}
}).fail(function(jqXHR, textStatus, errorThrown) { alert(textStatus+ ': ' +errorThrown); });
});
Its not even calling this section, but the section under it does in fact work just fine (tried an alert and it didnt work).
this part right under it works great:
PHP Code:
//validate password match upon input
$('form.register_form input[name=pass2]').bind("oninput", function ()
{
var input = $(this);
if (input.val() != $('form.register_form input[name=pass1]').val()) {
input.setCustomValidity('The two passwords must match.');
} else {
// input is valid -- reset the error message
input.setCustomValidity('');
}
});
if you are getting a blank, i would guess teh post isnt returning any data.
you should trying putting alert(data) in your done function and Id bet it comes up empty.
This is a shot in the dark, but I think your selectors may have something to do with it, they dont typically need to be that specific when the element has an id or name already.
Well I have that first alert in there, and it's not even getting that far. It seems in Chrome/Firefox it's not even calling the function. Only works in IE.
Doesn't even get to this in Chrome/FF
PHP Code:
$('form.register_form input[name=email]').bind("oninput", function ()
{
alert("here");
same thing still. Works IE but nothing else. I don't know how to use firebug too well, but I don't see the call either.
and I believe the oninput is made from the link I'm using given in op. Maybe that's why its only IE? Would have to be user-created if jquery doesn't support it but works in IE right? I tried looking for anything browser specific in the code but didn't see anything.
oninput is actually the html5 event, and this shim I'm using (the link in op) lets IE 9 and less also work with html5 validation for forms. So I believe it's a phantom event to replicate the actual html5 validations that work in FF, Opera, Chrome, ect.
It's why it's weird it won't work, at least to me...
Not to ask a silly question, but why not avoid most of the jQuery stuff, temporarily, and just do:
Code:
$("#xyz").onchange = function() { alert("got here"); };
or even
document.getElementById("xyz").onchange = function() { alert("got here"); };
Naturally that means you first add id="XYZ" to that <input>.
If that works, then take it one step at a time to figure out what part jQuery is messing up.
The usability of the one I'm using (at least on IE) to where it checks as typed, instead of when losing focus.
Also to add, the first of yours didnt work. Second did on all browsers. I can put that in, but my point of posting what trying to get this actual one to work and I've run out of debug ideas. Figured I'd look for help to some kind of clash for IE to work (oddly, since ie sucks) and FF/Chrome not to work. It still didn't work with the code I was using for the verification of the email though, only the alert.
Like I said I know there is also that option, but it's not really what I'm trying to do...
I've been going through the shim code from the link posted in my op, trying to find anything that would stop FF/Chrome from working, but I don't see anything. I also need to catch the validation of the entire form on submit as well and have been searching through trying to find where it lets it go through with the submit button, but to no avail.