How to make variable editor on RITEM read only on service portal

ritaaudi
Tera Contributor

Hi: I have the variable editor displayed on request items on the portal as such:

find_real_file.png

As you can see the variable editor fields are editable. I need to make them read only after the request is submitted. I tried the following client script on Both UI Type but it didn't seem to work:

function onLoad() {  

//Type appropriate comment here, and begin script below  

if(g_user.hasRole('admin')) {  

g_form.setVariablesReadOnly(false); //so that admins can edit the variables.  

} else {  

g_form.setVariablesReadOnly(true);  

}  

}  

Any ideas?

Thank you!

1 ACCEPTED SOLUTION

Hi Rita,
Firstly, sorry for the delay - I wasn't online yesterday.
So let's get into it!
1. You might also want to remove the 'Save' button from it - you can do this by simply commenting out the line in HTML with element <button>, or the whole footer div
2. Important remark is, that we will not be able to embed the widget at exactly the same place as the original variables were. It's because the whole form is being generated dynamically from the script. What we can do, is to place it at the very beginning, or very end - before the buttons.
So if we want to put it in the beginning, open your cloned form widget in editor and in HTML go somewhere about line 62, where you see <!-- form -->
right before it place these lines:


        <!-- Embedded variables -->


          <sp-widget widget="data.embedVariables"></sp-widget>


Screen Shot 2017-06-16 at 8.52.09 AM.png



If you want the variables after the form, place the lines right before the <!-- UI Action Links -->


3. Go to server script part and somewhere where the data objects are assigned, place this line


        data.embedVariables = $sp.getWidget('your_cloned_variables_widget');


Screen Shot 2017-06-16 at 8.52.36 AM.png


And this should work. Again, if you're using this page for more than just sc_req_item, you need to embed a condition so your variables are called only for the tables that can have variables. It could look like this:
HTML:



<!-- Embedded variables -->


          <div ng-if="data.hasVariables">


              <sp-widget widget="data.embedVariables"></sp-widget>


          </div>



Server Script: (almost at the end - maybe right before the line // Activity formatter is hardcoded to set specific options)


if (data.table == 'sc_req_item') {


  data.hasVariables = true;


        }



Hope this helps!


View solution in original post

12 REPLIES 12

ritaaudi
Tera Contributor

Kate, thank you so much for the thorough explanation. Really appreciate it! P.S. How would you suggest I learn more about angular scripting? Is there a video or book that you would recommend? Best regards, Rita


Hi Rita,



Happy it helped Regarding AngularJS, I think I took the one at Codecademy - Learn AngularJS 1.X | Course | Codecademy . Although if you don't have deep knowledge in web development, it might bit little bit confusing. A great way how to get decent fundamentals in web is a free course on Coursera (after I finished the course I wished I had done it prior working with Service Portal) - https://www.coursera.org/learn/html-css-javascript-for-web-developers .I found it super helpful. It not only explains the coding, but gives lots of insights into other practical topics too. I truly can't express how much this course helped me


And then the same professor has another course - related to AngularJS - Single Page Web Applications with AngularJS | Coursera . Haven't taken this one, but I bet the quality is awesome, based on the teacher.



Have a great day.


Hi Kate,

Hope you are doing well.

First of all thanks for the post and answer. It resolves my issue but this is working only for RITM variables. I have refered https://hi.service-now.com/kb_view.do?sysparm_article=KB0621064 to add variable editor for sc-task records but when I am applying your logic of making variables readonly its not working on sc-task variables.

 

Here is my code for your reference:

 

try {
var catItem = data.table == "sc_task" ? gr.request_item.cat_item : gr.cat_item;
data.sc_cat_item = $sp.getCatalogItem(catItem,!!options.isOrdering, data.table);
var values = getValues(data.table, gr);

for(var f in data.sc_cat_item._fields) {
// Put the values into the cat item fields
if (typeof values[f] != "undefined" && typeof values[f].value != "undefined") {
data.sc_cat_item._fields[f].readonly = true;
data.sc_cat_item._fields[f].value = values[f].value;
data.sc_cat_item._fields[f].displayValue = values[f].displayValue;
data.sc_cat_item._fields[f].display_value_list = values[f].display_value_list;
}
}
} catch (e) {
console.log("Error loading the variable editor: " + e);
}
}

Its making RITM variables readonly but not sc-task variables.

Any insights? @kate737