Skip to main content link. Accesskey S

XPages Wiki

Submit Search

YouAtNotes XPages Wiki


Home > UI > How to create a picklist style dialog

How to create a picklist style dialog
Found in Mark Hughes Blog:

- Create a custom control with a panel, a view inside the panel and other componets as you like - this control will become the dialog. Set for example "picklistDialogPanel" as name for the panel and "picklistView" for the view.
- In the view, make the first column have a check box option
- put a button somewhere, in the onclick event use code like this as server side js:

var viewPanel=getComponent("picklistView"); //get the componet of viewPanel
sessionScope.put("pickledIds", viewPanel.getSelectedIds()); // store ids of selected documents in a sessionScope variable


- and use this client side js in the button:

dijit.byId('picklistDialog').hide();


- Go to the source of the custom control, find the "<xp:panel id="picklistDialogPanel">" string and wrap a div with the id "picklistDialog" around it like this:

<div id="picklistDialog" style="display:none">
<xp:panel id="picklistDialogPanel">
....
</xp:panel>
<div>


- Include that component on your XPage
- Put this function in some client javascript library and include that library in your XPage

function dialog_create(id) { 
  var dialogWidget = dijit.byId(id);
  if( dialogWidget ) dialogWidget.destroyRecursive(true);
  dialogWidget = new dijit.Dialog( { }, dojo.byId(id)); 
  var dialog = dojo.byId(id);
  dialog.parentNode.removeChild(dialog); 
  var form = document.forms[0]; form.appendChild(dialog); 
  dialogWidget.startup(); 
}


- In the source of your XPage, put somewhere at the bottom this kind of code:

<script language="javascript">
XPS.addOnLoad(function() {dialog_create("picklistDialog")});
</script>



- To show the dialog, place this client javascript on some button or link or something else:

dijit.byId('picklistDialog').show()



This shows the dialog and after the user dismisses the dialog the Note-IDs of the selected documents are stored in the "pickedIds" sessionScope variable.

See Mark Hughes Blog for some screenshots and code variations.
See what's possible with Xpages.
Have a look at our ServiceCommunicator website
and the YouAtNotes Support.
Use  searchlotus.com  for news in the Web related to Lotus Notes and Domino,
and to search those sites.
Check  youatnotes.com  for great Lotus Notes, Domino and XPages software.
Did this wiki help you?
Did this saved you time? Express your gratitude by making a donation:		 PayPal - The safer, easier way to pay online!