JQuery .submit function will not submit form in IE

Question

I have a form that submits some values to JQuery code,which then which sends off an email with the values from the form.It works perfectly in Firefox, but does not work in IE6(surprise!) or IE7. Has anyone any suggestions why? greatly appreciated?I saw on some blogs that it may have something to do with the submit button in my form but nothing Ive tried seems to work.

Here is the form html:

<form id="myform1">

<input type="hidden" name="itempoints" id="itempoints" value="200"> </input>

<input type="hidden" name="itemname" id="itemname" value="testaccount"> </input>

<div class="username">
    Nickname:

    <input name="nickname" type="text" id="nickname" />
</div>
<div class="email">
    Email:
    <input name="email" type="text" id="email" />
</div>
<div class="submitit">
    <input type="submit" value="Submit" class="submit" id="submit" />
</div>

</form>

and here is my JQuery:

var $j = jQuery;

$j("form[id^='myForm']").submit(function(event) {

 var nickname = this.nickname.value;
 var itempoints = this.itempoints.value;
 var itemname = this.itemname.value;
 event.preventDefault();  
 var email = this.email.value;
 var resp = $j.ajax({
  type:'post',
  url:'/common/mail/application.aspx',
  async: true,
  data: 'email=' +email 
   + '&nickname=' + nickname 
   + '&itempoints=' + itempoints 
   + '&itemname=' + itemname,
  success: function(data, textStatus, XMLHttpRequest) {
   alert("Your mail has been sent!");
   window.closepopup();

  }
 }).responseText;
 return false;
});

Answer 1

Looks like your form needs a method and action.

Answer 2

Since you are not actually submitting the form why don't you just make the submit button as a button instead of submit and do the stuff in click event() as shown below:

var $j = jQuery;

$j("#btnSubmit").click(function(event) {

 var nickname = $("#nickname").val();
 var itempoints = $("#itempoints").val();
 var itemname = $("#itemname").val();

 var email = this.email.value;
 var resp = $j.ajax({
  type:'post',
  url:'/common/mail/application.aspx',
  async: true,
  data: 'email=' +email 
   + '&nickname=' + nickname 
   + '&itempoints=' + itempoints 
   + '&itemname=' + itemname,
  success: function(data, textStatus, XMLHttpRequest) {
   alert("Your mail has been sent!");
   window.closepopup();

  }
 })
});

HTH

Answer 3

Your jQuery selector is looking for myForm, but the form's id is myForm1

$j("form[id^='myForm']") vs. form id="myform1"

Try $j('form#myform1')...

Answer 4

Hi all,thanks for your replies. JGubby I tried the .hide() and once again it works in Firefox(hides the form) and not IE.Not sure what this tells me?

Raja thanks for that code!Ive tried it,and renamed my form input type from submit to button,added new id to it called btnSubmit. But form does nothing then?even stops working in FF too.Sorry, my JQuery knowledge is not great...