Interested in a ServiceNow event built for developers? Registration for now[dev]26 is officially open!

way to pass variables from client script to HTML in UI page ? Thanks in advance!

Sunidhi Srivast
Kilo Contributor

Hi,

Can anyone tell me the way to pass variables from client script to HTML in UI page ? 

Thanks in advance!

1 ACCEPTED SOLUTION

Hi,

you will have to set the value of some html tag using dom

Something like this

<div class="col-md-5 text-right" style="padding-left:3px">
<g:form_label for="service_select">
${gs.getMessage("How many request you want to clone ")}
</g:form_label>
</div>

<p id="my_id" style="display:none"></p>
<div class="col-md-5 text-left" style="padding-left:3px" >
<select id="times" name="times">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>

I am fetching "times " in client script as below: 

$j("#times").on("change", function(e) {
var testt = $j("#times").val();
alert(testt);

document.getElementById('my_id').innerHTML = testt;

document.getElementById('my_id').style.display = '';
});

Regards
Ankur

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 10x ServiceNow MVP  ||  ✨ ServiceNow Community Leader

View solution in original post

19 REPLIES 19

Okay thanks!

 

Hello ,

Can we pass a Client Script function in <j2:while> </j2:while > tag? If yes, can you please tell the syntax.

you cannot call client script function from <j2:while>

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 10x ServiceNow MVP  ||  ✨ ServiceNow Community Leader

Thanks Ankur. We have a requirement where we need to color the cells J,F,M,A----- basis on the start and end date shown in Picture.

find_real_file.png

 

We have used the below code:

 

HTML:

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
<g2:evaluate >
var gr = new GlideRecord("sn_apm_business_type");
gr.query();

</g2:evaluate>
<style>
.package {
width:70%;
margin-right:auto;
margin-left:auto;
background-color:#f5f5f5;
padding:20px;
border:1px solid #c5c5c5;
}</style>
<div class="package">
<table width="30%" border="1" class="table table-striped table-hover">
<tr class="header">
<td colspan="17">Total Records</td>
</tr>

<tr class="header">
<td>Business Application</td>
<td>Owner/Contact</td>
<td>Start Date</td>
<td>End Date</td>
<td>Refernce ID</td>
<td>Description</td>
<td id="1">J</td>
<td id="2">F</td>
<td id="3">M</td>
<td id="4">A</td>
<td id="5">M</td>
<td id="6">J</td>
<td id="7">J</td>
<td id="8">A</td>
<td id="9">S</td>
<td id="10">O</td>
<td id="11">N</td>
<td id="12">D</td>
</tr>

<j2:while test="$[gr.next()]">
<tr >
<td> $[gr.getDisplayValue('u_business_application') ]</td>
<td> $[gr.getDisplayValue('u_owner') ]</td>
<td id="demo1"> $[gr.getDisplayValue('u_start_date')]</td>
<td id="demo2"> $[gr.getDisplayValue('u_end_date')]</td>
<td> $[gr.getDisplayValue('u_refernce_id')]</td>
<td>$[gr.getDisplayValue('u_description')]</td>
<td id="xyz"></td>
<td id="abc"></td>
<td id="pqr"></td>
<td id="def"></td>
<td id="ghi"></td>
<td id="yes"></td>
<td id="app"></td>
<td id="page" ></td>
<td id="text1"></td>
<td id="text2"></td>
<td id="text3"></td>
<td id="text4"></td>

<script>

var d1= document.getElementById("demo1").innerHTML;
var moonLanding = new Date(d1);
var m1= (moonLanding.getMonth()+1)



var d2= document.getElementById("demo2").innerHTML;
var moonLanding1 = new Date(d2);
var m2 = (moonLanding.getMonth()+1)

var c1 = parseInt(m1);
var c2 = parseInt(m2);

for(var i=c1; i<=c2.length ; i++){
document.getElementById("xyz").style.backgroundColor= "#4169E1";

}

</script>

</tr>


</j2:while >
</table>
<footer id="okCancel" class="modal-footer">
<button id="ok" class="btn btn-primary" onclick="return highLightCells(); ">
${gs.getMessage('Ok')}
</button>
</footer>
</div>
</j:jelly>

 

With the above code we are able to generate a tabular form but the coloring of the cells is not happening as we are unable to save a form because of the error in For loop. 

 

Do you have any suggestions how we can achieve this?

Hi,

why not color it during populating itself?

Regards
Ankur

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 10x ServiceNow MVP  ||  ✨ ServiceNow Community Leader