Block form from user to another

Web_Admin
Web_Admin used Ask the Experts™
on
Hello experts,

I have one form that has two section where user A can edit section one only and user B an edit section two. do you know how I can apply readonly , disabled to to form input so i don't allow user to modify something they are not supposed to change. problem is my form is very long i cannot add if statement on every input .
is there any jquery plugin to apply class on div so it makes all element in div disabled
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Project Lead
Top Expert 2011
Commented:
Check this. I have created the 2 sections. and dropdown box of user. Just select the user1 and user1. It will disabled and enabled form  fields accordingly using jquery

<html>
   <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" language="JavaScript" type="text/javascript"></script> 
     <script>
        $(document).ready(function () {
          
          $('#userselect').change(function(){
            if($(this).val()=="user1")
            {
              $('#section1 input, #section1 select').attr('disabled',true);
              $('#section2 input, #section2 select').attr('disabled',false);
            }
            else if($(this).val()=="user2")
            {
              $('#section2 input, #section2 select').attr('disabled',true);
              $('#section1 input, #section1 select').attr('disabled',true);
            }
            else
            {
              $('#section1 input, #section1 select').attr('disabled',false);
              $('#section2 input, #section2 select').attr('disabled',false);
            }
            
          });
        });
     </script>
   </head>
   <body>
<form id="form1" runat="server">
 <div id="section1">
         
        <h1>Section 1</h1>
        <input id="txtBox1" type="text"/><br />
        <input id="txtBox2" type="text" /><br />
        <input id="txtBox3" type="text" /><br />
        <input id="txtBox4" type="text" /><br />
        <input id="txtBox5" type="text" /><br /><br />
        <select id="select1"><option value="test">test1</option></select>
        
        </div>
        <br>
        <div id="section2">
         
        <h1>Section 1</h1>
        <input id="txtBox11" type="text"/><br />
        <input id="txtBox12" type="text" /><br />
        <input id="txtBox13" type="text" /><br />
        <input id="txtBox14" type="text" /><br />
        <input id="txtBox15" type="text" /><br />
        <select id="select11"><option value="test11">test1</option></select>
        
        </div>
        <div>
          <br><br><br>
           <select id="userselect"><option value="">Select User</option><option value="user1">user1</option><option value="user2">user2</option></select>
        </div>
        
    </form>
    </body>
    </html>

Open in new window

leakim971Multitechnician
Top Expert 2014
Commented:
$("input select textarea", "#div_ID").not(".dont_disable_me_class").each(function() {
      $(this).attr("disabled", "disabled");
      //$(this).attr("disabled", true);
})

Open in new window


set the dont_disable_me_class class to prevent disabling on some elements

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial