JQuery validation - error message not showing in Internet Explorer

Posted on 2009-12-17
Last Modified: 2012-05-08
Dear Experts,

Running into an issue with Internet explorer. I am doing form validation using Jquery. Most of the checks are standard like "required, min length, max length, email format etc"- All these error messages are showing up fine in all browsers.

Now just for the email field, apart from the email format, I'm also checking in the database to see if the email already exists - and if it does - show an error message to user.

In FireFox,Chrome - if the email address exists - it comes back and displays error saying -"Email id is already registered"

But in Internet Explorer - nothin happens - no error message is shown and the form just stays and nothing happens.

Any idea what this issue could be - I'm attaching the code below

thanks for your help
<script language="javascript">
		// Setup de dialog box
		$('#dialog').dialog('option', 'title', 'Register');
		$('#dialog').dialog('option', 'width', 340);
		$('#dialog').dialog('option', 'buttons', {
			'Send': function(){
			'Cancel': function(){

		// validate the form
			submitHandler: function(){
				$.post(baseUrl + '/register/register', $('#frmRegister').serialize(), function(data){
			rules: {
				password: {
					rangelength: [8, 16]
				password2: {
					equalTo: "#password"
				email: {
					remote: baseUrl + '/register/check-email'
			messages: {
				email: {
					remote: jQuery.format("{0} is already registered.")
			onkeyup: false,
			onfocusout: false,
			focusCleanup: true,
			focusInvalid: false,
			debug: false

<form name="frmRegister" id="frmRegister" class="frm" method="post" action="<?php echo $this->baseUrl(); ?>/register/register">
	<input type="hidden" name="redirect" value="<?php echo $this->getRequest()->getParam('redirect'); ?>"/>
	<input type="hidden" name="redirect_type" value="<?php echo $this->getRequest()->getParam('redirect_type'); ?>"/>
		<legend>Acount details</legend>

		<label for="name">Full name</label>
		<input type="text" name="name" id="name" class="required"/>
		<label for="name">Mobile Number</label>
		<input type="text" name="mobile_number" id="mobile_number" class="required"/>

		<label for="email">Email</label>
		<input type="text" name="email" id="email" class="required email"/>

		<label for="password">Password</label>
		<input type="password" name="password" id="password" class="required"/>

		<label for="password2">Retype password</label>
		<input type="password" name="password2" id="password2" class="required"/>

Open in new window

Question by:gublooo
    LVL 14

    Accepted Solution

    I think easiest to get to the source of your problem if you'd install the
    IE Debug bar and run your site with the JQuery script through it.

    Author Comment

    Thankyou that debug tool was really helpful in solving the issue. Appreciate your help. Sorry for the late response.
    LVL 14

    Expert Comment

    'Sorry for the late response.'

    pah - no problem, glad i could be of help to you.
    By the way, if you do web development it is in general always a good idea to look out for
    any kind of debug, verification, tidying and checking tools that come along as add ons for
    most of the browser versions these days. ;-))

    Featured Post

    Do You Know the 4 Main Threat Actor Types?

    Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

    Join & Write a Comment

    Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
    Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
    In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
    In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…

    754 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    17 Experts available now in Live!

    Get 1:1 Help Now