logo
Ask your WordPress questions! Pay money and get answers fast! (more info)

Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

If the asker does not get an answer then they have 10 days to request a refund.

$20
jQuery AJAX call response

I have a snippet of jQuery JS which I use to make an AJAX request back to the server within a WP Plugin and displays the result back into an element on the page (div#test) when the #myformButton is clicked :

// AJAX form submission
function option_get(button) {
$.post(
'http://domain.com/',
{
'setting1' : $("#setting1").val(),
'setting2' : $("#setting2").val(),
'setting3' : $("#setting3").val(),
'setting4' : $("#setting4").val(),
'setting5' : $("#setting5").val(),
},
function(data, textStatus) {
$('#test').html(data);
},
'text'
);
}
$('#myformButton').click(function() {
option_get();
});



How would I make a jQuery UI dialog box pop open if the server didn't respond?

Also, is there a way to make a dialog box with different text pop open if a particular chunk of text is returned? ie: if the returned text is "Error, data submitted is invalid", I'd like to be able to serve a corresponding dialog box to alert the user to the problem.




I can make a jQuery UI dialog box open on the page no problems at all. It's just figuring out how to make one pop open based on the result of the AJAX call which is confusing me.

Thanks :)

This question has been answered.

Ryan Hellyer | 09/12/11 at 1:36am Edit


(2) Possible Answers Submitted...

See a chronological view of answers?

Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

  • avatar
    Last edited:
    09/12/11
    2:42am
    Christianto says:

    Hi,

    To invoke a function if error happen on ajax request, you can use jQuery.ajaxError API, since the API will run each time there are error on ajax (all ajax request), you should specified your ajax url so only run on specific request error.

    var ajax_URL = 'http://domain.com/ajax-url';
    $( "div.log" ).ajaxError(function(e, jqxhr, settings, exception) {
    if ( settings.url == ajax_URL ) {
    // place the error dialog open method here
    $('#Error-ID').dialog('open');
    }
    });


    To make different box open when specific text return you just have to match the text in conditional statement inside $.post callback, the text return will be pass to callback (in your code 'data').

    // AJAX form submission
    function option_get(button) {

    $.post(
    'http://domain.com/',
    {
    'setting1' : $("#setting1").val(),
    'setting2' : $("#setting2").val(),
    'setting3' : $("#setting3").val(),
    'setting4' : $("#setting4").val(),
    'setting5' : $("#setting5").val(),
    },

    function(data, textStatus) {
    if(data == 'first-text-return'){
    // do first function
    $('#first-box').dialog('open');
    } else if(data == 'second-text-return'){
    // do second function
    $('#second-box').dialog('open');
    }
    },
    'text'
    );

    }

    $('#myformButton').click(function() {
    option_get();
    });


    Hope this help..

    • 09/12/11 4:26am

      Ryan Hellyer says:

      Yay! That second one worked perfectly. I now have irritating error messages popping up all over the place :)

      I'll have a bash at your other suggestion shortly to see if that works.

  • avatar
    Last edited:
    09/12/11
    2:51am
    John Cotton says:

    You could use the full ajax call to handle the errors and a switch statement to determine action on success:

    $.ajax({
    type: 'POST',
    url: 'http://domain.com/',
    data: {
    'setting1' : $("#setting1").val(),
    'setting2' : $("#setting2").val(),
    'setting3' : $("#setting3").val(),
    'setting4' : $("#setting4").val(),
    'setting5' : $("#setting5").val(),
    },
    success: function(data, textStatus) {
    switch(data) {
    case 'sought-text-1':
    // do something
    break;
    case 'sought-text-2':
    // do something else
    break;
    default:
    // do something othewise
    break;
    }
    },
    error: function(jqXHR, textStatus, errorThrown) {
    // react to any error
    // textStatus could be "null", "timeout", "error", "abort", or "parsererror"
    },
    dataType: 'html'
    });

    • 09/12/11 4:29am

      Ryan Hellyer says:

      That's a little beyond the scope of what I'd asked for, so thanks for the extra leads on improving things :)

    • 09/12/11 8:38am

      Ryan Hellyer says:

      The "success" feature you added turned out to be the solution to another problem I'd been having :)

This question has expired.



Ryan Hellyer voted on this question.



Current status of this question: Completed



Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

If the asker does not get an answer then they have 10 days to request a refund.