CODEWITHSUNDEEP
javascriptjqueryajaxfirefox
jones
jones

Reputation: 1453

can't ajax post a from with firefox

I want to post a from using jQuery ajax without page reloading, it works fine in Chrome but not works in Firefox 6.0. Below is my code

 <html>
    <head>
    <script type="text/javascript">
      function save()
      {
        $('#myForm').submit(function(event){
          event.preventDefault();
          $.ajax({
                   type:'POST',
                   url:'save.php',
                   data:$('#myForm').serialize(),
                   success:function(data)
                   {
                        alert('form submitted');
                   },
                   error:function()
                   {
                       alert('unable to submit');
                   }   
               });
          });
      }
    </script>
    </head> 
       <body>
             <form id="myForm" action=''>
                <input type="text" name="firstName">
                <input type="text" name="lastName">
                <input type="submit" id="submitForm" onclick="save(myForm);">
             </form>
       <body>
</html>

Any help would be much appreciated.

Upvotes: 0

Views: 53

Answers (3)

charlietfl
charlietfl

Reputation: 171669

I would suggest you get rid of the onclick and save() and just use the jQuery submit handler

 <!-- make sure you have doctype -->
 <!DOCTYPE html>
 <html>
    <head>
     <script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
    <script type="text/javascript">
      $(function(){
        $('#myForm').submit(function(event){
          event.preventDefault();
          $.ajax({
                   type:'POST',
                   url:'save.php',
                   data:$('#myForm').serialize(),
                   success:function(data)
                   {
                        alert('form submitted');
                   },
                   error:function()
                   {
                       alert('unable to submit');
                   }   
               });
          });
      });
    </script>
    </head> 
       <body>
             <form id="myForm" action=''>
                <input type="text" name="firstName">
                <input type="text" name="lastName">
                <input type="submit" id="submitForm"><!-- remove onclick -->
             </form>
       <body>
</html>

Be sure to include jQuery.js also

Upvotes: 0

Nanhs Naram
Nanhs Naram

Reputation: 29

Include jQuery library in your header section.

Upvotes: 2

Red2678
Red2678

Reputation: 3297

You must have a cached version of jQuery in your FF cache, because I do not see you including jQuery anywhere on the page.

Add above other scripts in the head section:

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>

Upvotes: 2

Related Questions