1

I am having this weird issue where i am just unable to get some fields changed to read only. The following are the JQuery codes used and i have a screen shot as well. Request and Request Description are the 2 fields in question. Other text fields like First Name and Last Name are changed to read only fine

$("input[title='Request']").attr("readonly","true").css('background-color','#F6F6F6');

$("textarea[title='Request Description']").attr("readonly","true").css('background-color','#F6F6F6');

$("select[title='Request Type']").prop("disabled","true").css('background-color','#F6F6F6');

$("input[title='First Name']").attr("disabled","true").css('background-color','#F6F6F6');

$("input[title='Last Name']").attr("disabled","true").css('background-color','#F6F6F6');

screenshot

Not sure what else to do here. This has been driving me crazy

  • May I know why you have not used disabled =true property for request and request description. Whether that also not working for you. And one more thing can you also check what are the internal column name of request and request description. Might be its different. Use f12 developer tool and find the control of request text box and run your command in console. See whether you receive any error – vinit kumar Sep 5 '18 at 1:13
  • Hi Thanks for the prompt reponse. Is this what you mean? Sorry i am still learning all this stuff $("input[title='Title']").attr(disabled =true).css('background-color','#F6F6F6'); $("textarea[title='Request_x0020_Description']").attr(disabled =true).css('background-color','#F6F6F6'); Title and Request_x0020_Description are the FieldInternalName for both fields – Tommy0824 Sep 5 '18 at 1:30
  • Yes. Did you try that. – vinit kumar Sep 5 '18 at 2:30
  • You need quotes around true (the value of the attribute) – A.k.A. Fritz Sep 5 '18 at 2:32
  • @vinitkumar hi i tried it and sadly it didn't work. – Tommy0824 Sep 5 '18 at 3:14
1

Use F12 to check the “Request” element and “Request Description” element.

“Request” field: (single line of text)

enter image description here

Script:

$("input[title='Request Required Field']").attr("readonly","true").css('background-color','#F6F6F6');
// you can aslo use the following scritp to diable field
$("input[Title='Request Required Field']").attr("disabled", "disabled");

“Request” field: (Multiple lines of text)

enter image description here

It is a div.

Script:

$("div[id^='Request_x0020_Description']").attr("contentEditable","false").css('background-color','#F6F6F6');    

Summary:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function()
{
//Set the Field to Read only and change its background colour
$("input[title='Request Required Field']").attr("readonly","true").css('background-color','#F6F6F6');
// you can aslo use the following scritp to diable field
$("input[Title='Request Required Field']").attr("disabled", "disabled");

$("div[id^='Request_x0020_Description']").attr("contentEditable","false").css('background-color','#F6F6F6');
});
</script>

Result:

enter image description here

Update:

For the single line of text. It is a "input" field. (use F12 to check the element).

For the "input" field, we can set "disabled" attribute to disable field. Or, set "readonly" attribute to make the field read only. ("reda-only" will not grey out the field.)

For the multiple lines of text, it is not a "input" element. It is a div. It does not support "disabled" and "readonly".

We need to change "contentEditable" to false to make it read-only. However, it will not grey out the field. So that, we need to change the background color by ourselves.

  • thanks man! this is the code i used instead which worked. $($("[id^=Request Description][id$=inplacerte]")[0]).attr("contenteditable","false"); – Tommy0824 Sep 5 '18 at 4:23
  • "$($("[id^='<id>'][id$=inplacerte]")[0]).attr("contenteditable","false")" and "$("div[id^='<id>']").attr("contentEditable","false")" should work with the same result. You need to use F12 to find the element detail and then use the particular script. – JoannaW_MSFT Sep 5 '18 at 4:28
  • Use .css('background-color','#F6F6F6'); to change its background color to make it greyed out. – JoannaW_MSFT Sep 5 '18 at 4:34
  • do you know if there is a way to make it disabled like the other fields? for example, if you look at my initial screen shot notice how both First Name and Last Name fields are disabled – Tommy0824 Sep 5 '18 at 4:43
  • This is the current code: $("div[id^='Request_x0020_Desciption_ed343dce-f6a1-4b07-80b7-426af743c3f4']").attr("contentEditable","false").css('background-color','#F6F6F6'); the .css script at the end is not making it grey for some reason – Tommy0824 Sep 5 '18 at 4:50
0
$(document).ready(function()
{
  jQuery("input[title='Title Required Field']").attr("disabled", "disabled");
  jQuery("input[title='Request']").attr("disabled", "disabled");
  jQuery("textarea[title='Request Description']").attr("disabled", "disabled");
}

To enable the controls box by using button call function

jQuery("input[title='Title Required Field']").removeAttr('disabled');
jQuery("input[title='Request']").removeAttr('disabled');
jQuery("textarea[title='Request Description']").removeAttr('disabled');
  • hi i actually tried those codes and it didn't fix it. i just found this other code and it seems to made the Request Description field readonly. $($("[id^=Request Description][id$=inplacerte]")[0]).attr("contenteditable","false");. need to make it greyed out (disabled) – Tommy0824 Sep 5 '18 at 4:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.