Clone
Clone

Reputation: 939

what is the best way to disable a html element in ajax form?

I have an element which is disabled when the page is loaded

<%= select_tag "count", get_count(local_trial_type).html_safe, :disabled => true %>

Then the count field is enabled again[2]:

jQuery("form").submit(function() {
    jQuery("#count").removeAttr("disabled");
});

then the form is submitted by errors.. and then again the same field is enabled. Because I am enabling the field just before submitting the form[2]. And it makes sense that the same state is returned back when the form is submitted. So now the field which is disabled is enabled just before the submit is occuring so its shown as enabled when the form comes back with the validation error.

How can I make it again a disabled field. Because the form is submitted with ajax it doesnt load the whole page and so there is no point in having a code defined in document.ready when it comes back with the error message.

Thanks!

Upvotes: 0

Views: 126

Answers (1)

John S
John S

Reputation: 21482

You would want to add a complete callback that re-disables the input element.

I believe you do something like this:

jQuery('form').bind('ajax:complete', function() {
    jQuery("#count").attr('disabled', 'disabled');
});

I assume you enable the input element so its value will be submitted. As an alternative to enabling and then re-disabling the input element, You could use two input elements: a visible, but permanently disabled, input element and a hidden input element. You would always give them the same value, but only the hidden input element would have a "name" attribute.

Upvotes: 1

Related Questions