Obtenga el valor de una entrada después de un evento de cambio

So I have a number of input type="number" fields - and when they're changed I run this:

$('.amount-input').change(function() {
   checkAmount($(this));
   setPrices();
   allowSubmit();
});

The checkAmount function runs a ajax request with the value of the changed element, to check if the number is lower or higher than some other number (lets say 5). If it is higher, it sets the value of a hidden field, unique to each number field, to "true":

var $toHighAmount = aElement.prev().prev().prev();
$toHighAmount.val('true');

Next, the allowSubmit function should check the value of all those true / false fields, and if ANY of them are set to true, it should disable a submit button.

function allowSubmit() {
    var givenError = "false";
    $( ".rowToHighAmount" ).each(function() {
    var val = $(this).get(0).value;
        if (val == "true") {
            givenError = "true";
        }       
    });

    if (givenError == "true") {
      $("#cartSubmitBtn").attr("disabled", "disabled");
    } else {
      $("#cartSubmitBtn").removeAttr("disabled");
    }                       
}

So - to the problem. checkAmounts() does change the value of the hidden true / false field. However - when allowSubmit() runs it handels the old value of that field. So, for example:

If I set the value of input type="number" to 4 than the true/false field is set to false. If I then change input type="number" to 6 - the true/false field is set to true (meaning that 6 is higher than 5) - but when allowSubmit runs it still thinks the value is false - and does not disable the submit button. Only if I increase the number again - allowSubmit understands that there's a true value.

It's the same the other way. I have to change to number field twice to something bellow 5 in order to activate the submit button again.

So - in conclusion - I need to make sure that the value allowSubmit picks up is the absolut current value - and not that one from before the change action.

¿Alguien tiene alguna idea?

preguntado el 05 de mayo de 13 a las 19:05

setPrices y allowSubmit should run as part of the success handler from your ajax request. -

2 Respuestas

This is a classical problem : as the ajax function is asynchronous, you need to execute allowSubmit from the callback you give to it, that is, if I follow you, inside checkAmount.

contestado el 05 de mayo de 13 a las 19:05

Thanks! It did the trick. I now run alowSubmit() in the .done segment of the ajax request. - Daniel Setréus

the allowSubmit function should check the value of all those true / false fields,

if you are checking the true/false of fields that was changed by the ajax request then you should call your allowsubmit inside the success callback of ajax.. and use prop() ..

if (givenError == "true") {
  $("#cartSubmitBtn").prop("disabled", true);
} else {
  $("#cartSubmitBtn").prop("disabled",false);
}     

contestado el 05 de mayo de 13 a las 19:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.