1

My form properly submits data via POST utilizing Ajax. However I am trying to redirect the user upon successful submission. The problem is, even though the form successfully submits, instead of redirecting the user it displays an error. According to firebug the page I am submitting to, is throwing up a 200 success code. I am using jquery 1.8.3.

My Code:

$(document).ready(function() {
$("#form4").submit(function(e) {
    e.preventDefault();
    var frm = $('#form4');
    $.ajax({
        type: 'POST',
        url: 'http://requestb.in',
        data: frm.serialize(),
        success : function() {
            window.location = "http://www.google.com";
        },
        /*error : function() {
            alert("Something went bad");
        }*/
    });
});

Here is my form HTML:

<form action="" method="post" id="form4" name="form4" enctype="multipart/form-data">
    <input id="name" name="name" type="text" tabindex="1" value="Insert your name" class="required">
    <input id="email" name="email" type="text" tabindex="2" value="Insert your e-mail" class="required email">
    <input id="phone" name="phone" type="text" tabindex="3" value="Insert your phone number">
    <input type="submit" name="submit_button" value="Try it free">
</form>

In an attempt to figure out the exact error, I added the following code to the top of my script, which I found from this POST:

$(function() {
    $.ajaxSetup({
        error: function(jqXHR, exception) {
            if (jqXHR.status === 0) {
                alert('Not connect.\n Verify Network.');
            } else if (jqXHR.status == 404) {
                alert('Requested page not found. [404]');
            } else if (jqXHR.status == 500) {
                alert('Internal Server Error [500].');
            } else if (exception === 'parsererror') {
                alert('Requested JSON parse failed.');
            } else if (exception === 'timeout') {
                alert('Time out error.');
            } else if (exception === 'abort') {
                alert('Ajax request aborted.');
            } else {
                alert('Uncaught Error.\n' + jqXHR.responseText);
            }
        }
    });
});

After adding that code, that following error I get is from the first error code check: 'Not connect.\n Verify Network.'. I tested this is both firefox and Chrome with same results.

Edit: Additional information

I am trying to post the data from my website to a 3rd party form processor service which accepts post, get, and put commands. The service is zapier.com and requestb.in is a service I am using to troubleshoot my form submissions.

Community
  • 1
  • 1
Damainman
  • 515
  • 9
  • 21
  • 2
    What is the value of `exception`? – James Montagne Sep 11 '13 at 14:10
  • Try `window.location.replace("http://www.google.com");` for redirecting – Khalid Dabjan Sep 11 '13 at 14:12
  • @JamesMontagne to be honest I am not sure. This is sort of new to me but everything is working except retrieving the 200 code so that it executes the success function. khalid , I used your code but it did not make a difference I think because the code doesn't execute the success function. – Damainman Sep 11 '13 at 14:16
  • How do you know that the form successfully submits? Can you check Fiddler to see what's actually going across the wire? – xdumaine Sep 11 '13 at 14:18
  • I submit it to http://requestb.in service which captures the form submission data. After hitting submit I can see the data I submitted in the http://requestb.in service even though I get the error popup. I also have another service I am using for production which is also capturing the data correctly. – Damainman Sep 11 '13 at 14:21
  • Your second argument `exception` is actually the status code. the exception is the third argument. – Kevin B Sep 11 '13 at 14:25
  • 1
    Open your javascript console. Do you see anything related to *"ACCESS DENIED DUE TO SAME ORIGIN POLICY"*? – Kevin B Sep 11 '13 at 14:27
  • @kevin does that mean that code I am using to check the error is incorrect? – Damainman Sep 11 '13 at 14:27
  • Yes, that's what it means. – Kevin B Sep 11 '13 at 14:27
  • @KevinB, oh I copied that from another post to test but thank you for pointing that out I'll see if I can correct the code. In my firebug console I see no errors, just "POST http://requestb.in 200 OK 157ms" for every time I hit submit. To the right of the code it says "jquery.min.js (line 2)" – Damainman Sep 11 '13 at 14:31
  • We need to know what the exception is then. If it's not failing due to statuscode, it's likely failing due to parseerror. – Kevin B Sep 11 '13 at 14:32
  • @KevinB , I am researching the correct way to retrieve the proper error code. It looks like the person who posted that code got it from here: http://www.unseenrevolution.com/jquery-ajax-error-handling-function/ – Damainman Sep 11 '13 at 14:35
  • 1
    in your code above, `(jqXHR, exception, realexception){alert(realexception);...` – Kevin B Sep 11 '13 at 14:36
  • @KevinB I commented out the ajaxsetup code above and added (jqXHR, exception, realexception){alert(realexception); to the error portion of my original ajax code. The error popup is blank with no text. – Damainman Sep 11 '13 at 14:43
  • 1
    What does `jqXHR.responseText` give you? When you look in your console, what is the contentType header returned from the server set to? – Kevin B Sep 11 '13 at 14:44
  • The response header content-type is "text/html; charset=utf-8" , the request header content-type is "application/x-www-form-urlencoded; charset=UTF-8" – Damainman Sep 11 '13 at 14:50
  • Also I added jqXHR.responseText into the alert message area, and it is still a blank popup window. – Damainman Sep 11 '13 at 14:50
  • @KevinB I changed the error code to (xhr, textStatus, errorThrown) {alert(textStatus);} and that causes the popup window to display just the word "error". – Damainman Sep 11 '13 at 15:00
  • I don't see anything that should result in the error callback. :( – Kevin B Sep 11 '13 at 15:01
  • @KevinB this has me stumped too, but thank you for your assistance. – Damainman Sep 11 '13 at 15:56
  • @KevinB, looks like it be related to crossdomain issues with ajax since I am trying to post to a 3rd party processor. – Damainman Sep 12 '13 at 14:36
  • 1
    If that is the problem, somewhere in your console you will see an error mentioning the same origin policy. – Kevin B Sep 12 '13 at 14:37

0 Answers0