Question

I want to preface this with, “I’m a total noob so please explain like I’m five.” I’ve looked at a lot of answers to this common question but I was unable to find a suitable answer to my particular problem. Below is the scripty bit in question. Currently, the user inputs an order number. This gets sent via the ajax call to a php processor script. The processor script validates the order number and then sends data back. If data !=”NO” we get sent to a new page.

<script type="text/javascript">
function resetTextFields()
{
    $("#orderNum").val("");                
}

function onSuccess(data, status)
{
    resetTextFields();
    // Notify the user the new post was saved
    $("#message").fadeIn(2000);
    data = $.trim(data);
    if(data != "NO")
    {
        location.href="labOrders.php";
    }
    else
    {
        $("#message").css("background-color", "#ff0000");
        $("#message").text("Not a valid order number...");
    }
    $("#message").fadeOut(2500);
}

$(document).ready(function() {
    $("#submitSearch").click(function(e){

        var formData = $("#labOrderFind").serialize();

        $.ajax({
            type: "POST",
            url: "labSearch.php",
            cache: false,
            data: formData,
            success: onSuccess
        });

        e.preventDefault();
    });


});

What I would like to do is onSuccess if data!=”NO”, POST the formData again to the labOrders.php so that labOrders.php can use it to do more lookups against a db. I’ve tried to do this many ways but I’ve not been successful. Am I going about this the wrong way? As long as we can use POST, I’m open to all solutions.

Extra info:
jquery and jquery.mobile are loaded in the head (it’s a tablet app).

Maybe stackoverflow needs a noob tag for questions like this.

Answer 1

I solved my own problem. Below is my solution in case someone else runs into a problem like this in the future.

I found this function.

function post(URL, PARAMS) {
    var temp=document.createElement("form");
    temp.action=URL;
    temp.method="POST";
    temp.style.display="none";
    for(var x in PARAMS) {
        var opt=document.createElement("textarea");
        opt.name=x;
        opt.value=PARAMS[x];
        temp.appendChild(opt);
    }
    document.body.appendChild(temp);
    temp.submit();
    return temp;

}

I then slightly modified my onSuccess function:

    function onSuccess(data, status)
{
    data = $.trim(data);
    if(data != "NO")
    {
                    post("labOrders.php", {
                        orderNum:data
                    })
    }
    else
    {
            resetTextFields();
        $("#message").css("background-color", "#ff0000");
        $("#message").text("Not a valid order number...");
    }
    $("#message").fadeOut(2500);
}