Just Simple PickList Dialog

<xp:view
	xmlns:xp="http://www.ibm.com/xsp/core"
	xmlns:xc="http://www.ibm.com/xsp/custom"
	xmlns:xe="http://www.ibm.com/xsp/coreex"
	pageTitle="BestCoder">
	<xp:this.data>
		<xp:dominoView
			var="viewAnnouncements"
			viewName="vwAnnouncements">
		</xp:dominoView>
	</xp:this.data>
	<xp:panel
		id="panelFormContainer">
		<xp:table>
			<xp:tr
				valign="top">
				<xp:td>
					<xp:div
						style="position:relative;">
						<xp:label
							value="Related Announcements"
							id="label8"
							for="RelatedAnnouncements">
						</xp:label>
						<xp:image
							url="/iconSelectDocument.gif"
							id="image1"
							style="position:absolute;top:0px;right:0px;cursor:hand;">
							<xp:eventHandler
								event="onclick"
								submit="false">
								<xp:this.script><![CDATA[XSP.openDialog("#{id:dialogPickListUnpublishDocs}");]]></xp:this.script>
							</xp:eventHandler>
						</xp:image>
					</xp:div>
				</xp:td>
				<xp:td>
					<xp:inputText
						id="RelatedAnnouncements"
						style="width:99.5%"
						multipleTrim="true"
						multipleSeparator=",">
					</xp:inputText>
				</xp:td>
			</xp:tr>
		</xp:table>
	</xp:panel>
	<xe:dialog
		id="dialogPickListUnpublishDocs"
		title="Simple PickList Sample"
		style="width:610px">
		<xp:panel
			id="panelDialogContainer"
			style="padding:10px">
			<xp:dataTable
				id="dataTable1"
				var="varAnnouncement"
				partialRefresh="true"
				value="#{viewAnnouncements}"
				style="width:100%;font-size:12px;"
				rows="5">
				<xp:this.facets>
					<xp:pager
						id="pager1"
						xp:key="footer"
						panelPosition="right"
						partialRefresh="true"
						layout="Previous Group Next"
						for="dataTable1"
						pageCount="3">
					</xp:pager>
				</xp:this.facets>
				<xp:column
					id="column4">
					<xp:this.facets>
						<xp:span
							xp:key="header"></xp:span>
					</xp:this.facets>
					<xp:image
						url="/iconAdd.gif"
						id="image2"
						style="cursor:hand">
						<xp:eventHandler
							event="onclick"
							submit="true"
							refreshMode="complete">
							<xp:this.action><![CDATA[#{javascript:var dokumanNo = varAnnouncement.getColumnValue("DokumanNo").toString();
var selectedValues = viewScope.get("PickListSelectedValues");

if (selectedValues == "") {
	selectedValues = dokumanNo;
} else {
	if (selectedValues.indexOf(dokumanNo) == -1) {
		selectedValues = selectedValues + "," + dokumanNo;
	}
}

viewScope.put("PickListSelectedValues", selectedValues);}]]></xp:this.action>
						</xp:eventHandler>
					</xp:image>
				</xp:column>
				<xp:column
					id="column5"
					style="white-space:nowrap;vertical-align:middle;">
					<xp:this.facets>
						<xp:span
							xp:key="header">Document Number</xp:span>
					</xp:this.facets>
					<xp:text
						escape="true"
						id="computedField2">
						<xp:this.value><![CDATA[#{javascript:varAnnouncement.getColumnValue("DocNumber")}]]></xp:this.value>
					</xp:text>
				</xp:column>
				<xp:column
					id="column6"
					style="width:100%;vertical-align:middle;">
					<xp:this.facets>
						<xp:span
							xp:key="header">Subject</xp:span>
					</xp:this.facets>
					<xp:text
						escape="true"
						id="computedField4">
						<xp:this.value><![CDATA[#{javascript:varAnnouncement.getColumnValue("Subject")}]]></xp:this.value>
					</xp:text>
				</xp:column>
			</xp:dataTable>
			<xp:panel
				style="margin-top:10px;padding:10px;border:1px solid #dedede"
				tagName="div">
				<xp:label
					value="Selected Values :"
					id="label13"
					style="font-weight:bold">
				</xp:label>
				<xe:djextListTextBox
					id="djListSelectedValues"
					value="#{viewScope.PickListSelectedValues}">
				</xe:djextListTextBox>
			</xp:panel>
		</xp:panel>
		<xe:dialogButtonBar>
			<xp:button
				value="OK"
				id="button1">
				<xp:eventHandler
					event="onclick"
					submit="true"
					refreshMode="complete">
					<xp:this.script><![CDATA[var objRelatedAnnouncements = dojo.byId("#{id:RelatedAnnouncements}");
var djDialogSelected = dijit.byId("#{id:djListSelectedValues}");

objRelatedAnnouncements.value = djDialogSelected.getValue();

return true;]]></xp:this.script>
					<xp:this.action><![CDATA[#{javascript:var dlg = getComponent("dialogPickList");
dlg.hide();}]]></xp:this.action>
				</xp:eventHandler>
			</xp:button>
		</xe:dialogButtonBar>
	</xe:dialog>
</xp:view>





Simple PickList Dialog

Sample Screenshot : http://www.bestcoder.net/wp-content/uploads/2012/07/PickList.png

Ferhat Bulut
www.bestcoder.net

XPages
Ferhat BULUT
July 6, 2012 4:39 AM
Rating
283

All code submitted to OpenNTF XSnippets, whether submitted as a "Snippet" or in the body of a Comment, is provided under the Apache License Version 2.0. See Terms of Use for full details.



No comments yetLogin first to comment...