Question
FBI
US
Last activity: 3 Oct 2018 13:59 EDT
How to programmatically trigger the click on a link in Pega
Hello all I am trying to use jQuery in order to programmatically click on a dropdown on one of the pega pages. However, it does not seem to do anything.
I can not seem to do the following (click the Add button > click Attach File(s):
The HTML for this looks like this:
Hello all I am trying to use jQuery in order to programmatically click on a dropdown on one of the pega pages. However, it does not seem to do anything.
I can not seem to do the following (click the Add button > click Attach File(s):
The HTML for this looks like this:
<td class="dataValueWrite" style="width:162px;">
<nobr>
<script src="webwb/pega_yui_menu_154956905.js!pega_yui_button_13563920726.js!!.js" type="text/javascript"></script>
</nobr>
<div class="SplitButton">
<nobr><span id="attachButtonContainer" style="display: inline; visibility: visible;"></span></nobr>
<table border="0" cellpadding="0" cellspacing="0" class="buttonMainTable">
<tbody>
<tr>
<td class="buttonTdLeft" onclick="if(typeof(pega) !='undefined' && pega.u.d) pega.u.d.fireButtonClick(this.parentNode);">
<div class="buttonLeftContent">
<div class="buttonLeftContentInner">
</div>
</div>
</td>
<td class="buttonTdMiddle" nowrap><span class="yui-button yui-menu-button" id="mb1"><span class="first-child"><button tabindex="0" type="button"><span class="yui-button yui-menu-button" id="mb1">Add</span></button></span></span></td>
<td class="buttonTdRight" onclick="if(typeof(pega) !='undefined' && pega.u.d) pega.u.d.fireButtonClick(this.parentNode);">
<div class="buttonRightContent">
<div class="buttonRightContentInner">
</div>
</div>
</td>
</tr>
</tbody>
</table>
<input id="atchTyp" name="$PpyWorkPage$ppyAttachmentType" type="hidden" value="">
</div>
</td>
and the associated JS for this seems to be this:
pega.u.d.fieldValuesList.put("MENUBUTTON_DEFAULT_TITLE","Menu collapsed. Click to expand.");
pega.u.d.fieldValuesList.put("MENUBUTTON_MENU_VISIBLE_TITLE","Menu expanded. Click or press Esc to collapse.");
var oSel = pega.util.Dom.getElementsById('mb1Sel');
var parentTD = "";
if(oSel != null && oSel[0] != null) {
var aOptns = oSel[0].options;
var iLen = aOptns.length;
var txtValMap = new Object();
for(var i=0; i<iLen; i++)
txtValMap[aOptns[i].text]=aOptns[i].value;
var oMB1 = new pega.widget.Button("mb1", { type: "menu",
menu: "mb1Sel"});
var oMenu = oMB1.getMenu();
oMenu.clickEvent.subscribe(onMOptnClk, txtValMap, true);
pega.util.Event.addListener(document.getElementById("HARNESS_CONTENT"), "scroll", function(){ oMenu.hide();}, oMenu, true);
}
var oSel2 = pega.util.Dom.getElementsById('mb1Sel');
if(oSel2 != null && oSel2[0] != null) {
oSel2[0].style.display = 'block';
oSel2[0].style.visibility = 'visible';
}
var sBC = pega.util.Dom.getElementsById('attachButtonContainer');
if (sBC != null && sBC[0] != null) {
sBC[0].style.display = 'inline';
sBC[0].style.visibility = 'visible';
}
function onMOptnClk(ev, args, txtValMap) {
ev = args[0];
var o = pega.util.Dom.getElementsById('atchTyp');
var txt = "";
txt = pega.util.Dom.getInnerText(pega.util.Event.getTarget(ev));
var val = txtValMap[txt];
if(val != null) {
o[0].value = val;
if(val == 'ECM'){
pega.u.d.processAction('AttachmentForECM', '', '','','',true,ev);
}else if (val == 'File'){
pega.u.d.processAction('pyAttachContent', '', '','','',true,ev);
}else {
pega.u.d.processAction('Attachment', '', '','','',true,ev);
}
}
}
</script></nobr></td>
When trying the following, nothing seems to happen (open the Add button):
$('#mb1').click();
$('#mb1').focus().click();
$('#mb1').trigger('click');
Even just trying to bypass opening the Add box and just simply click on the Attach File(s) doesnt seem to work either:
$('#yui-gen2').click();
$('#yui-gen2').focus().click();
$('#yui-gen2').trigger('click');
Is there a Pega API to do this? Or am i trying to get the incorrect ID for these things?
***Edited by Moderator Marissa to update platform capability tags****
Pegasystems Inc.
IN
Hi David,
What version of Pega is this? From the markup, I see that the menus here are the old generation menus. Depending upon which release you are in, you might have an option of upgrading menus from the HTML5 readiness landing page.
I am wondering why you would want to trigger click on the menu items programatically, can you not just call the action configured on the menu item directly instead.
However, if you still need to trigger click, try this:
// Jquery
$('#mb1 button').click();
// Vanilla JS
document.querySelector("#mb1 button").click();