Need help in Portal Widget Checkbox

rishabh katari1
Mega Guru

‎12-16-2023 12:38 AM

I am newbie in Widgets, So require a little help. I have created a Custom Widget which is a checkbox with a link and on hover of mouse, Some text is being displayed in a box. I need to check this checkbox when the record is on a specific table. 
Here is the code for HTML (widget):

<div class="alignText">

 <form>
 <label><input class ="check" type="checkbox" ng-change = 'c.checkboxcheck()'ng-model='data.check'>
 <a href="https://www.google.com" target="_blank" rel="noopener" class="link">Important CheckBox<span class="tooltiptext">I am shown when someone hovers over the div above.</span></a></label>  
  </form>
</div>

Code for CSS (Widget):

.check{
display:inline-block;
 vertical-align:top;
  margin-right:10px;
  height: 16px;
  width: 16px;
  margin-left:4px;
}
input[type=checkbox]{
display:inline-block;
  vertical-align:center;
}

.link{
  font-size:16px;
}

.tooltiptext {
  visibility: hidden;
  width: 500px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 7px;
  padding: 5px 0;
  margin-left:10px;
  position: absolute;
  z-index: 1;
}
 
.link:hover .tooltiptext {
  visibility: visible;
}

Client Controller Code(widget):

api.controller = function() {
    /* widget controller */
    var c = this;
    var g_form = $scope.page.g_form;
    c.checkboxcheck = function() {
        g_form.setValue('checkbox', c.data.check);  // here I have defined Variable name in Service Portal
    };
};

Catalog Client Script:

	alert(g_form.getValue("checkbox"));
    var ga = new GlideAjax('global.TestingAjax'); 
    ga.addParam('sysparm_name', 'userPassRecCheck');  
    ga.addParam('sysparm_user_name', newValue);  
    ga.getXML(HelloWorldParse);

    function HelloWorldParse(response) {
        var answer = response.responseXML.documentElement.getAttribute("answer");
        if(answer == "true"){
			alert("answer");
			g_form.setValue("checkbox",true);
		}else{
			alert("not found");
		}
    }

Script include Function Code: 

	userPassRecCheck:function(){
		var userID = this.getParameter("sysparm_user_name");
		gs.log("user is: "+userID,"user");
		var userRef = new GlideRecord("u_user_password");
		userRef.addQuery("u_user",userID);
		userRef.query();
		gs.log("record found is: "+userRef.getRowCount(),"user");
		if(userRef.next()){
			return "true";
		}else{
			return "false";
		}
	},

 

Thank you in Advance!

0 Helpfuls
  • 1,157 Views
2 REPLIES 2

Ratnakar7
Mega Sage
Mega Sage

‎12-16-2023 03:49 AM - edited ‎12-16-2023 03:50 AM

Hi @rishabh katari1 ,

 

Here's an example of how you can achieve this in your widget's

HTML:

 

<div class="alignText">
    <form>
        <label>
            <input class="check" type="checkbox" ng-change='c.checkboxcheck()' ng-model='data.check'>
            <a href="https://www.google.com" target="_blank" rel="noopener" class="link">
                Important CheckBox
                <span class="tooltiptext">I am shown when someone hovers over the div above.</span>
            </a>
        </label>
    </form>
</div>

 

And in your widget's client controller:

 

api.controller = function() {
    var c = this;

    // Initialize data.check based on your condition
    // For example, you can use a GlideRecord query here
    c.data.check = false; // Set the default value

    // Function to update the checkbox state
    c.checkboxcheck = function() {
        // Update the checkbox state
        // You may want to perform some actions based on the checkbox state here
        // For example, you can use g_form.setValue to update a variable
        if (c.data.check) {
            // Checkbox is checked
        } else {
            // Checkbox is unchecked
        }
    };
};

 

In this example, when your widget is loaded, the data.check property will be initialized based on your condition. If the condition is met, the checkbox will be checked by default.

You might need to adapt this based on your specific use case and conditions. Make sure to replace the placeholder logic with your actual logic for checking the checkbox.

 

Thanks,

Ratnakar

0 Helpfuls

rishabh katari1
Mega Guru
In response to Ratnakar7

‎12-16-2023 05:50 AM

Hi @Ratnakar7 ,

In the client side Controller code I am using:

var c = this;
    c.data.check = false;
    //var g_form = $scope.page.g_form;
    c.checkboxcheck = function() {
        var ga = new GlideAjax('global.TestingAjax'); 
        ga.addParam('sysparm_name', 'userPassRecCheck'); 
        ga.addParam('sysparm_user_name', g_form.getValue("name")); 
        ga.getXML(HelloWorldParse);
        function HelloWorldParse(response) {
            var answer = response.responseXML.documentElement.getAttribute("answer");
            if (answer == "true") {
				c.data.check = true;
                g_form.setValue("checkbox", true);
            } else {
                alert("not found");
            }
        }
    };

This is not working as expected, Checkbox should be checked when user in the "requested for" on form is having a record in "user password" table.

Does this supports gliderecord directly or client call like this is fine?

 

0 Helpfuls