Make list clickable in Modal PopUp
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
05-20-2022 08:54 AM
I need to be able to have the list of Existing Conferences in he spmodal window selectable so the user can click on an existing conference and the name is filled in on the catalog variable for the event name.
Is this possible?
Thank you
This is my spmodal.open : In this example how can I make the List of names selectable.
So the user can choose from any of the existing names?
function onChange(control, oldValue, newValue, isLoading) {
if (isLoading || newValue == '') {
return;
}
var onlyNew = g_form.getValue('conference_option');
if(onlyNew == 'new_conference'){
var ga = new GlideAjax('ConfAjaxUtils'); //x_btig_bookings.ChoiceAvailable
ga.addParam('sysparm_name', 'getExisting');
ga.addParam('sysparm_table', "u_conferences");
ga.getXML(getresponse);
}
function getresponse(response) {
var answer = response.responseXML.documentElement.getAttribute("answer");
if (answer) {
spModal.open({
"title": "List of Existing Conferences:",
"message": answer,
"buttons": [{
label: "✘ Close",
primary: true
}
],
"backdrop": "static",
"keyboard": false
}).then(function(answer) {
});
}
}
}
- Labels:
-
Scripting and Coding
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
05-21-2022 12:45 AM
I would recommend creating a widget for this and then using the widgetId
property in the options when you call spModal.open()
to display your widget template. This means you can instead do:
if(onlyNew == 'new_conference'){
spModal.open({
"title": "List of Existing Conferences:",
"widget": "<your widget id>", // widget id (not sys_id)
"buttons": [{
label: "✘ Close",
primary: true,
}],
"shared": {
"g_form": g_form // gives us access to g_form in the widget client code
},
"backdrop": "static",
"keyboard": false
});
}
Rather than using GlideAjax
to fetch your data from your client script, you can use the server script editor in the widget that you create to fetch your list of conferences, and then use angularjs to display those conferences (using ng-repeat
). For each conference that you list, you can add an ng-click
directive to add a click handler for each item in your list, which can call a function in your widget's client-side code. The client-side code can do any processing it needs, such as an additional call to the server (if needed). It can then use c.options.shared.g_form.setValue(...)
to set/update any variables on your catalog item, such as the event name. See example widget below:
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
05-23-2022 04:36 PM
Hey Nick, I tried this but still cannot get it working.
The Widget Loads and the list of names but I am not able to make them clickable to select.
Any other suggestions?
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
05-23-2022 04:37 PM
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
05-23-2022 07:39 PM
Hi @triciav, are you able share what your widget code looks like?
Please make sure that you have used ng-click
and that you have added your click function to $scope
using $scope.functionName = ...
(which must be specified as a parameter in the client script function wrapper). You can use things such as alert("test");
in your click handler function to double check that the click is occurring. You can also open up your browser's dev-tools (right click + inspect) and view the "console" tab to see if your widget might have some sort of error that is preventing it from working correctly.