Make A Submit Clickable After Validations Are Met

I have the following html:

Genre: {{ create_production_form.genre }}

Privacy: {{ create_production_form.privacy }}

live() or on() depending on the version of jQuery you're using. This means that an essential piece of the equation has been left out.

The 'event' methods I'm speaking of are submit, change or click. You must delegate the code to one of these events -- using the aforementioned live() or on() methods.

Otherwise, if you're just simply looking to enable them if data has been fille din.

$('form :input').change(function(){
  if ($("id_genre").val() && $("id_privacy").val()) {
    $("input[name=next]").attr("disabled","")
  }
});

This wil check the form to see if the inputs change, if they do, it will test the values and you'll get your result.

Solution 2:

Assuming they're both text-inputs, you could validate on keyup, otherwise validating on change would also work.

Solution 3:

try using on hover cause user has to hover over the button before click i hope it helps

$("input[name=next]").hover(function() {


    if ($("id_genre").val()!="" && $("id_privacy").val()!="") {
        $("input[name=next]").removeAttr("disabled")
    }
});

Solution 4:

 $('form').change(function() {
    if ($("id_genre").val().length > 0 && $("id_privacy").val().length > 0) {
        $("input[type='submit']").prop("disabled", false)
    }
  })

Solution 5:

Demohttp://jsfiddle.net/8AtAz/1/

In the demo when you click the valid button it will enable the next button: Please lemme know if I missed any point.

code

$("input[type='submit']").prop('disabled', true);
$("#valid").click(function() {

    $("input[type='submit']").prop('disabled', false);
})​

OR In your case

if ($("id_genre").val() != "" && $("id_privacy").val() != "") {
        $("input[type='submit']").prop("disabled", false)
    }