Question

i have a simple form with two fields whose data are being validated against a database on keyup with jquery. I am also having a button which is currently enabled or disabled based on the number of characters entered in these two fields. THe two jquery functions return an “accept” or “cancel” image for the two fields. I want to enable the button only if both the functions return the accept image or i can even make them return true along with it, which will not be a problem. I just wanna know how to compute a local result based on the returned value from two different ajax requests.

These are two functions that validate teh field against a database.

$("#agentName").keyup(function(){
        var agentName = $("#agentName").val();
        if(agentName.length > 3)
        {
            $("#agt-name-result").html(ajax_load).load(loadUrl, "val="+agentName+"&fld=agent_name");
        }
        else{
            $("#agt-name-result").html("<img src=\"images/cancel.png\" />");
        }
    });

    $("#agentSource").keyup(function(){
        var agentSource = $("#agentSource").val();
        if(agentSource.length > 9)
        {
            $("#agt-src-result").html(ajax_load).load(loadUrl, "val="+agentSource+"&fld=agent_url");
        }
        else{
            $("#agt-src-result").html("<img src=\"images/cancel.png\" />");
        }
    });

This is the function that validates the button

$("#agentName,#agentSource").keyup(function(){
        var validate;           
        var agentName = $("#agentName").val();
        var agentSource = $("#agentSource").val();
        if((agentName === "") || (agentSource === "") || (agentName.length < 3) || (agentSource.length < 10))
        {
            validate = false;
        }
        else { validate = true; }                   
        if(validate === true) { 
            $("#addAgntBtn").removeAttr("disabled");
            $("#addAgntBtn").removeClass("dialog-btn-disabled").addClass("dialog-btn");
        }
        else {
            $("#addAgntBtn").attr("disabled", "disabled");
            $("#addAgntBtn").removeClass("dialog-btn").addClass("dialog-btn-disabled");
        }
    });

Any ideas?

Answer 1

I would use a setInterval to poll a $.data() value in which the two ajax calls put their results. You have to pay attention to concurrent accesses, but it should work