Click here to Skip to main content
11,631,896 members (72,132 online)
Rate this: bad
good
Please Sign up or sign in to vote.
Dear Experts,

i need a javascript to add an attribute in a class...

Here is the below Html code of HTML SELECT..


<select id="ddl_State" name="validation-select" class="select validate[required]">
 
<option value="">Please select</option>
<option value="1">First option</option>
<option value="2">Second option</option>
<option value="3">Third options</option>
</select>
 


I need a javascript code for add an attribute in this class.. Eg :

<select id="ddl_State" name="validation-select" class="select validate[required] Disabled">

Here i have added "Disabled" in the class attribute.....

How can i add this using javascript, without delete the existing class attributes....

Thanks and Regards,

Dileep
Posted 3-Apr-13 23:03pm
dilzz1.2K
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

Using Javascript, you can do it using setAttribute()[^] method.
var elem = document.getElementById("ddl_State");
elem.setAttribute("class", "select validate[required] Disabled");

Using jQuery, it's pretty simple:
$("#ddl_State").attr("class", "select validate[required] Disabled");
[Edit]
.prop()[^] is recommended way and supported in newer versions of jQuery. So below code is better:
$("#ddl_State").prop("class", "select validate[required] Disabled");
  Permalink  
v2
Comments
dilzz at 4-Apr-13 5:55am
   
These code are working fine.. i can see the change when i check in the inspect Element.. But this drop downlist will not be disabled.... :( when i hard coded this , then it become disabled.. but when i use the above code then it didn't disabled......

please advice me...

Thanks
Ankur\m/ at 4-Apr-13 6:00am
   
Add this line to your javascript code and it should be fine:
$("#ddl_State").attr("disabled", "disabled");
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 2

using jQuery
var existingClass= $('#ddl_State').prop('class');
$('#ddl_State').prop('class',existingClass + ' Disabled');
  Permalink  
Comments
dilzz at 4-Apr-13 5:55am
   
These code are working fine.. i can see the change when i check in the inspect Element.. But this drop downlist will not be disabled.... :( when i hard coded this , then it become disabled.. but when i use the above code then it didn't disabled......

please advice me...

Thanks
patel_vijay at 4-Apr-13 6:05am
   
If you want to disable dropdown then disabled value should not be inside class attribute. It should be added as separate attribute. try below code to disable dropdown.

$('#ddl_State').prop('disabled','disabled');

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 OriginalGriff 8,393
1 Sergey Alexandrovich Kryukov 8,044
2 Mika Wendelius 6,260
3 F-ES Sitecore 2,321
4 Suvendu Shekhar Giri 1,970


Advertise | Privacy | Mobile
Web03 | 2.8.150728.1 | Last Updated 4 Apr 2013
Copyright © CodeProject, 1999-2015
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100