How to enable form fields with a JQuery function

Question

I am setting up a form with 11 rows 11 columns. Normally the form rows and columns should be disabled but when i click a button called "EDIT" it should enable all the form fields. It would be nice if someone help me in this case. thanks in advance

my edit button :

<table class="auto-style15" style="width: 100%; height: 100%;">
<tr>
    <td class="auto-style11" rowspan="2" style="width: 70px"><strong>Operation No</strong></td>
    <td class="auto-style22" rowspan="2" style="width: 156px"><strong>Fixture No</strong></td>
    <td class="auto-style22" rowspan="2" style="width: 55px"><strong>Rev</strong></td>
    <td class="auto-style22" colspan="5"><strong>Status</strong></td>
    <td class="auto-style22" rowspan="2" style="width: 59px"><strong>Storage</strong></td>
    <td class="auto-style22" rowspan="2" style="width: 42px"><strong>ChecksTo Be<br />
    Done</strong></td>
    <td class="auto-style22" rowspan="2" style="width: 154px"><strong>Remarks</strong></td>
</tr>
<tr>
    <td class="auto-style7" style="width: 70px; height: 25px">
    <input name="oprno1" type="text" style="width: 70px" /></td>
    <td class="auto-style7" style="height: 25px; width: 156px">
    <input name="fixno1" style="width: 150px" type="text" /></td>
    <td class="auto-style7" style="height: 25px; width: 55px">
    <input name="rev1" style="width: 50px" type="text" /></td>

<input name="Button1" type="button" value="EDIT" disabled class="auto-style12" />

Community · Accepted Answer · 2017-05-23 12:01:53Z

1

If I understand right what you want, is to enable or disable controls on a form ... This issue has been debated here and it was answered. Kindly see if it is what you need.

http://jsfiddle.net/vGc5P/1/

$().ready(function() {


$('#clicker').click(function() {
    $('input').each(function() {
        if ($(this).attr('disabled')) {
            $(this).removeAttr('disabled');
        }
        else {
            $(this).attr({
                'disabled': 'disabled'
            });
        }
    });
});

});

Question Script to enable/disable input elements?

edited May 23, 2017 at 12:01

CommunityBot

11 silver badge

answered Feb 12, 2014 at 16:09

Elvis Lima

1445 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Shry Vishnu Murugesan Over a year ago

hello thanks but colud you please see my code once again, i had enter in my question..

AfromanJ · Accepted Answer · 2014-02-12 16:13:09Z

0

jQuery 1.6+

You can enable the fields by setting .prop('disabled', false);.

$('input').prop('disabled', false);

jQuery 1.5 and below

$('input').removeAttr('disabled');

The function

$(document).on('click', '.edit', function () {
    $('input').prop('disabled', false);
});

You can target input and textarea fields within your table and give it a class or ID.

$('table#edit input, table#edit textarea').prop('disabled', false);

Demo

edited Feb 12, 2014 at 16:13

answered Feb 12, 2014 at 16:06

AfromanJ

3,9323 gold badges20 silver badges34 bronze badges

3 Comments

AfromanJ Over a year ago

Add your HTML and JQuery to the question.

Shry Vishnu Murugesan Over a year ago

could you please help me now, i had entered my code too

AfromanJ Over a year ago

@ShryVishnuMurugesan It's a bit unclear what you are asking, as you have updated the question multiple times. You can't click the "EDIT" button to start with if you have disabled it. Please explain why my answer doesn't solve your problem.

pavel · Accepted Answer · 2015-04-23 07:25:50Z

0

<strong>
<input name="Button1" type="button" value="EDIT" disabled class="auto-style12" />
<script>
$('.auto-style12').click(function(){
    $('#textfield-id').removeAttr('disabled');
})
</script>

with jQuery

edited Apr 23, 2015 at 7:25

pavel

27.3k11 gold badges47 silver badges63 bronze badges

answered Feb 12, 2014 at 15:57

GoE

5961 gold badge9 silver badges19 bronze badges

1 Comment

Shry Vishnu Murugesan Over a year ago

thank you!! is I need to specify any id for my table forms and buttons

Collectives™ on Stack Overflow

How to enable form fields with a JQuery function

3 Answers 3

1 Comment

3 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related