1,105,594 Community Members

How to disable and enable form?

Member Avatar
Farhad.idrees
Junior Poster
102 posts since Dec 2010
Reputation Points: 1 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

HI i have many forms in my application..
when some one see any form so i want to show form as "Only readable form" means i want to use disable form..
when someone click edit button so my form should enable for editing..
how to do it? can anyone help me?
Regards..
Farhad

Member Avatar
JorgeM
IT Addict
6,418 posts since Dec 2011
Reputation Points: 581 [?]
Q&As Helped to Solve: 963 [?]
Skill Endorsements: 172 [?]
Moderator
Featured
Sponsor
 
0
 

On a form, you will have many HTML input elements. These elements can have an attributed called 'disabled'. If you enable/disable this attribute via JavaScript or easier with the jQuery library, you can control that behavior.

For example, the following code produces a disabled input button of type 'submit'.

<input type="button" value="Submit" disabled/>

Using jQuery, you can remove this attribute as follows: $("input").removeAttr("disabled")

Member Avatar
AARTI SHRIVAS
Posting Pro in Training
410 posts since Dec 2012
Reputation Points: 2 [?]
Q&As Helped to Solve: 38 [?]
Skill Endorsements: 3 [?]
 
0
 
<input  type="text" name="name" id="name"  onkeyup="document.getElementById('box_submit').disabled = this.value=='' ? true : false;"/>
    <input id="box_submit" type="button" value="Continue" name="check" disabled=""/>

try this button is enable only when some-one input somthing in text box

Member Avatar
Bachov Varghese
Posting Whiz in Training
205 posts since Sep 2011
Reputation Points: 45 [?]
Q&As Helped to Solve: 52 [?]
Skill Endorsements: 6 [?]
 
0
 

Try this

<!DOCTYPE HTML>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>

</head>
<body>
<form id="formElem">
<label for="txtName">Name</label>
<input type="text" name="txtName" />
<label for="txtAddress">Address</label>
<textarea name="txtAddress"></textarea>
</form>
<a href="#NOD" class="disableForm" >Disable Form</a>
<a href="#NOD" class="enableForm" >Enable Form</a>

<script type="text/javascript">
$(function(){
    $('.disableForm').click(function(){
        $('input, textarea').attr('disabled', true);
    });
    $('.enableForm').click(function(){
        $('input, textarea').attr('disabled', false);
    });
});
</script>

</body>
</html>
Member Avatar
code739
Posting Whiz in Training
213 posts since May 2012
Reputation Points: 17 [?]
Q&As Helped to Solve: 30 [?]
Skill Endorsements: 6 [?]
 
0
 

if youre using jquery

function set_status(){
    $('formname input').each(function() {
        if(this.disabled==true){
            this.disabled=false;
        }else{
            this.disabled=true;
        }
});
}

or native javascript

function set_status(){
        var len = document.former.elements.length;  //please be noted that former is the name of your form
        for(var x=0;x<len;x++){
            if(document.former.elements[x].disabled==true){
                document.former.elements[x].disabled=false;
            }else{
                document.former.elements[x].disabled=true;
            }
        }
    }
You
This article has been dead for over three months: Start a new discussion instead
Post:
Start New Discussion
Tags Related to this Article