You are viewing limited content. For full access, please sign in.

Question

Question

Read-only field in Form

asked on October 5, 2015

I have a Form with a group of fields that I wish to make read-only until a check-box is checked.  These fields contain data from a lookup.  If the data is incorrect the user can check the check-box and update them.

While the check-box is not checked, the fields should be read-only

The following code changes the background of the fields to gray, as if they were read-only or disabled, but the user can still edit them.

Please advise if this code is correct.


//Disable group details until checkbox checked

    { $('.updategroup').attr('disabled', 'True');}            //initial disable CSS 'updategroup'
  
    $('.checkedit').click(function () {                   
       if($('input[value="Yes"]').is(':checked'))             //checkbox value = 'Yes'
          {  $('.updategroup').removeAttr ('disabled');  
          }
       else {  $('.updategroup').attr ('disabled', 'True');   //hide again if un-checked
            }
     });
// end disable

 

0 0

Answer

SELECTED ANSWER
replied on October 6, 2015 Show version history

This should work; I have tested it in Forms on my end.

$(document).ready(function() {	// WHEN THE DOCUMENT LOADS
  $('.updategroup input').attr('disabled',true);  // DISABLE ALL .updategroup INPUT FIELDS
});

$(document).on('change', '.checkedit input:checkbox', function () { // WHEN A .checkedit CHECKBOX IS TOGGLED
  if(this.checked) {	// IF CHECKED
    $('.updategroup input').attr('disabled',false); // ENABLE ALL .updategroup INPUT FIELDS
  } else {	// OTHERWISE
    $('.updategroup input').each(function() { // FOR EACH .updategroup INPUT FIELD
      $(this).val($(this).attr('value'));  // RESET TO DEFAULT VALUE
      $(this).attr('disabled',true);  // DISABLE
    });
  }
});

I think the error in your code was trying to access the 'disabled' attributes of the .updategroup class items; if you look at the HTML of the generated form, however, those custom classes are applied to a list item containing the form field, not the field itself. To access the input fields in the .updategroup class, you need to specify the selector $('.updategroup input'), etc.

Hope this helps!

3 0
replied on October 6, 2015

Hi James,

Thanks for your reply.  I liked your extra addition of the 'reset to default values'.

0 0

Replies

replied on October 6, 2015

Try something like this

$('.read-only input').attr('readonly',true);

instead of using the disabled attribute.

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.