Tech
Forums
Jobs
Books
Events
Interviews
Live
More
Learn
Training
Career
Members
Videos
News
Blogs
Login
Sign Up
Ask Question
3
Reply
Disabling and Enabling text box based on selection option
venance haule
Feb 6 2017 3:20 AM
240
Reply
i'm developing a system about group registration, i have four category of groups, which are men group, women group, youth group and both group (men and women)
during registration of groups at the category there is selection option where a user can choose either group, and below that selection option i have two text box, one text box is to enter number of men and other text box is to enter number of women, by default they are disabled, what i want is if user choose men category, only the textbox for men should be active, and if user choose women category only the textbox for women should be active, if a user choose both or youth category all the text box should be active. below is my code please help
$(document).on(
'change'
,
'#combo'
,
function
(){
var
shouldEnable = $(
this
).val() !==
'Men'
;
$(
'#input1'
).prop(
'disabled'
, shouldEnable);
});
<
div
class
=
"form-group"
>
<
label
for
=
"category"
class
=
"col-sm-2 control-label"
>
Group Category
</
label
>
<
div
class
=
"col-sm-3"
>
<
select
class
=
"form-control"
name
=
"category"
id
=
"combo"
>
<
option
value
=
""
>
Select Category
</
option
>
<
option
value
=
"Men"
>
Men
</
option
>
<
option
value
=
"Women"
>
Women
</
option
>
<
option
value
=
"Youth"
>
Youth
</
option
>
<
option
value
=
"Both"
>
Both
</
option
>
</
select
>
</
div
>
</
div
>
<
div
class
=
"form-group"
>
<
label
for
=
"name"
class
=
"col-sm-2 control-label"
>
Number Of Men
</
label
>
<
div
class
=
"col-sm-8"
>
<
input
type
=
'text'
size
=
'5'
name
=
"man"
id
=
"input1"
value
=
""
class
=
'input'
disabled
>
</
input
>
</
div
>
</
div
>
<
div
class
=
"form-group"
>
<
label
for
=
"name"
class
=
"col-sm-2 control-label"
>
Number Of Women
</
label
>
<
div
class
=
"col-sm-8"
>
<
input
type
=
'text'
size
=
'5'
name
=
"woman"
id
=
"input2"
value
=
""
class
=
'input'
disabled
>
</
input
>
</
div
>
</
div
>
Upload Source Code
Select only zip and rar file.
Post
Reset
Cancel
Answers (
3
)
Next Recommended Forum
how to calculate number of months and days in javascript
How to focus all the text filed at the same time??