CODEWITHSUNDEEP
jqueryfield
Doug
Doug

Reputation: 821

jQuery - unable to update hidden input attribute

I'm trying to build a form that disables hidden fields determined by the users selection from a menu. At the outset I can disable all fields quite easily, and I can re-enable specific fields when the user selects a different option. However, I need to be able to re-disable all fields when the user clicks "change location" but I simply can't get this working!

Here is my code so far... The purpose behind my code may not be completely clear to you because it's heavily edited for the purposes of clarity but various other unrelated things happen. Suffice to say, this is what I need to do :)

jQuery:

$('input[name="hosted_button_id"]').attr("disabled",true);

$('#changelocation').click(function(){
    $('input[name="hosted_button_id"]').attr("disabled",true);
});


$('.deliveryselection').change(function(){    
    var deliveryLocation = $(this).val();
    $('input[title="' + deliveryLocation + '"]').removeAttr("disabled");
});

​

HTML:

<select class="deliveryselection">
    <option>Please select</option>
    <option value="UK">UK</option>
    <option value="Europe">Europe</option>
    <option value="North America">North America</option>
    <option value="Rest of World">Rest of World</option>
</select>
<a href="javascript:void(0)">Change location</a>
<form>
    <input type="hidden" name="cmd" value="_s-xclick">
    <input type="button" name="hosted_button_id" title="UK" value="UK"><br />
    <input type="button" name="hosted_button_id" title="Europe" value="Europe"><br />
    <input type="button" name="hosted_button_id" title="North America" value="North America"><br />
    <input type="button" name="hosted_button_id" title="Rest of World" value="Rest of World"><br /><br />
    <input type="submit" name="submit">
</form>
​

I've already got this set up in a jsfiddle here: http://jsfiddle.net/solomon/rS7nV/1/

EDIT I think I've discovered the issue. In my actual code I've been dealing with hidden fields, not button fields so I couldn't see directly the fruits of my labour - I've been using Firebug to determine the disabled conditions of the hidden fields. It was only by converting them to buttons whilst working with jsfiddle that I discovered my code worked OK (apart from a schoolboy error I made in deleting an ID... thanks for your help guys!). It turns out that Firebug was not updating its report and was still telling me that the fields were disabled when they weren't - despite the fact that my code was working just fine! That's a bit frustrating - my whole afternoon wasted on a Firebug bug! :)

Nevermind - it's all fixed now :)

Upvotes: 1

Views: 1778

Answers (3)

Mohan Raj
Mohan Raj

Reputation: 1

declare a class inside the div an call it using jQuery as below

jQuery(".declariedclassname").attr("disabled", true);

Upvotes: 0

BenjaminRH
BenjaminRH

Reputation: 12172

If you give the form containing the hidden fields an id, you can easily disable all of the hidden fields:

$("#hiddenFormId input").attr("disabled", true);

Upvotes: 0

James Montagne
James Montagne

Reputation: 78650

The problem is that you don't have an element with the id changelocation. Add the id and it's fine.

http://jsfiddle.net/rS7nV/4/

Upvotes: 3

Related Questions