XPage: Multi-value Names field ... display in Read & Edit Mode

HCL Domino Domino Forum
1

I’ve been struggling with a multi-value Names field in XPages now for a few days. The result is the same in both IE8 & Firefox3.6. I hope someone out there can offer some help.

  1. In edit mode, the names display in Abbreviated format (good) but I cannot get the display to show each name on a separate line:

I’m using a multi-line Edit Box control with “,” as the multiple separator.

Question #1: How can I get each name to display on its own line?

I don’t know if the custom converter has any bearing on the actual display but this is the one I’m using (from the ddwiki example on Converters):

<xp:this.converter>

	<xp:customConverter>

		<xp:this.getAsObject><![CDATA[#{javascript:@Name("[Canonicalize]", @Explode(value, ","))}]]></xp:this.getAsObject>

		<xp:this.getAsString><![CDATA[#{javascript:@Implode(@Name("[Abbreviate]", value), ",")}]]></xp:this.getAsString>

	</xp:customConverter>

</xp:this.converter>

It’s not clear to me if the converter is what causes the multi-value names to be stored properly in the Notes Names field in Canonical format, but this is what I get (good).

  1. In READ mode, the field just displays in a long string with the names in Canonical format:

Question #2 & #3: How can I get the names to display in Abbreviated format? And, how can I display each name on a separate line?

I even added this as the Default Value formula & various incantations of it to no effect:

xp:this.defaultValue</xp:this.defaultValue>

CAVEAT: If anyone suggests using a Repeat Control, PLEASE provide code to show how to split up a field. I’ve seen examples/tutorials on how to use them on document collections, but nothing on using them for multi-value fields.

Thank-you in advance for any practical tips/advice offered.

2

Subject: Yes, thanks – I’ve seen Steve’s multi-select dialog & am using it

I downloaded that last week and modified it to use either @DbLookup or @DbColumn (I added this as a Request against the Project), but I’m having trouble with it in IE8 (like almost everything else it seems) & logged that as a bug.

Steve’s custom control emulates the multi-value dialog list beautifully, so I hope I can figure out what’s causing me grief in IE8 – doubt that it’s compatibility mode 'cause it makes no difference either with or without. I don’t have a local server and am only using local preview so that may be a contributing factor. Next task will be to test on the network server.

I’ve been poking around in the XPages Wiki template & Declan’s xTalk template and there are some eye-opening things in there that I’ll study & learn from. I still maintain it would’ve been helpful to have some stock custom controls either delivered with 8.5.1 or in a sample Db in the wiki so we didn’t have to spend so much time finagling with things like multi-value field display or hunting for samples/code to steal.

Believe me, I’m grateful for what’s out there and the ever-generous Notes community.

The clouds are getting a lighter shade of grey – XPages is just overwhelming.

Cheers!

Judy.

3

Subject: Compatibility Mode?

I haven’tlooked at it, bus this one of the areas where IEneeds to be in compatibility mode? If so, this piece of code forces compatibility mode and just needs adding to the beforePageLoad event of the relevant XPage:

try {

if (context.getUserAgent().isIE(8, 8)) {

	var exCon = facesContext.getExternalContext();

	var response = exCon.getResponse();

	response.setHeader("X-UA-Compatible", "IE=EmulateIE7");

	}

} catch (e) {

}

4

Subject: Compatibility mode, Checkbox Group, Names display in EDIT mode …

Thanks Paul, I’ve got that code in my XPage mostly for use with the datetime-picker issue with IE8, and the problems I’m having don’t seem to have anything to do with compatibility mode. Or local preview.

Actually, I figured out late last week that there appears to be a bug in the multiselect-dialog custom control I got from OpenNTF that was causing the NAB picker (YouAtNotes also from OpenNTF) to not work either in IE8. I’m not savvy enough with the IE debugger to figure out precisely where the bug is yet, but I’ll get there.

If I remove the multi-select dialog custom control from the XPage, the NAB picker works fine. My next step is to either debug the multi-select dialog CC or to try to use a checbox group instead. I saw your post earlier about the checkbox group and I seem to be having a similar issue – can’t figure out how to populate the group’s values, so more work on that front.

BTW, still haven’t been able to get the EDIT mode display of my names field to do a line break on each name; and I tried the partial refresh on the computed field but that didn’t work (for me). I haven’t tried your suggestion yet about modifying the custom converter but hope to get to that one today. If I use a sessionScope variable instead of a Notes document field, I don’t need to worry about the partial refresh and the new values display immediately. Guess I can then push the values to the Notes document in the WebQuerySave agent. It just strikes me that doing something this simple shouldn’t be this hard.

5

Subject: Half-way there …

Thank-you both David & Paul for the help and explanations.

For the READ mode multi-value/new-line issue, I used a hybrid of Paul’s suggestion & one from John Mackey. On the computedfield for READ mode, with escape=false, I used this & it works swimmingly:

doc = dominoDocument1.getDocument();

@Implode(@Name(“[Abbreviate]”,doc.getItemValue(“”)),“
”);

For the EDIT mode, I haven’t got it to work yet. I’ll review Paul’s suggestions & may end up just using the computedfield again to display the values but have a suspicion I’ll need to do some “magic” to grab the values from the name-picker button to get them onto my Notes document.

On the topic of Name-pickers/Address dialog lookups:

It’s definitely a downer that IBM doesn’t supply an example Db in the wiki that provides custom controls to do proper address book lookups, or emulate other standard Notes client functionality like multi-value dialog lists.

For the name-picker functionality, I’m using the youAtNotes NamePicker (OpenNTF.org - The Open Source Community for Collaboration Solutions) to do the names lookup. I can’t get the name-picker to work in my app in IE8 even though the example Db works for me in IE8 so I obviously have some work to do on that front, but that’s a different matter.

I tried using the Matt White/Scott Good/Mike Brown AJAX NAB picker (http://www.browniesblog.com/A55CBC/blog.nsf/dx/07122009183645MBRAXK.htm) which is more Notes-client-like but had no joy at all in either IE or Firefox with that. So I abandoned that.

Ah well, maybe there’s an “aha!” moment in my near future where everything will fall into place …

6

Subject: Thank you !

Thanks Judy …I used your @implode and it works wonders…thanks

7

Subject: Have you seen this?

Judy,I’ve NOT looked at this yet… but have you seen Steve Castledine’s latest blog post and project?

The project is here:

http://www.openntf.org/Projects/pmt.nsf/ProjectLookup/XPages%20Multi%20Select%20Dialog%20Control

Not really billed as a name picker but maybe that’s interesting to you…

8

Subject: Nice. Thanks!..

  • I’m doing some razzle-dazzle with repeats to build proper combo boxes (ones that have be populated using the client with “allow values not in list” set), but have since done some dijit dialogs and was wondering if that might work for this, or to replace my solution. Looks like it does work for this and it could replace mine.

Thanks again…

9

Subject: Sadly this appears to be horribly broken…

  • I put ccMultiSelectDialog in my dev app and added it to the bottom of my page, where I have a whole pile of other less complex dojo dialog controls. I updated one, and only one, element to use the new control.

  1. In Firefox 3.5 it will not allow me to select any check box.

  2. In Firefox 3.5 it will not dismiss. OK, Cancel, X out … these cause it to dismiss and then it immediately repaints itself. It does this until all browser windows are closed.

  3. In Firefox 3.5 it pops this multi-select dialog for ANY selection dialog on the page, even ones that this control is not associated with. Once loaded the browser must be closed to get rid of it.

  4. In exploiter 8 the button to load it does not one single thing. It’s as if there is no dialog.

  • I’ve been fiddling with this for about three hours now. At this point I’m thinking it will be simpler to fix my broken control than fix this broken control.

Still and it looks very nice. If it would work I think it would be quite the deal…

10

Subject: Two fields?

You shouldn’t need to use a repeat control for this (you certainly could, but it would probably get more complicated).

For the read only version, the way I would probably approach it is to make the current field rendered only in edit mode (document1.isEditable() - if document1 is the name of your datasource). I would then add a Computed Field control rendered based on !document1.isEditable() - so only visible in read mode. Set Content Type to HTML (escape=“false”), and compute the value in Server-Side javascript. In the value I would use:

@Name(“[Abbreviate]”,@Explode(document1.getItemValueString(“myField”), “
”))

So you’re using HTML to create the line break, and using @Name to get the Abbreviate version. That should create the read-only version you need.

For the editable field, I’ve not really used converters, but it looks like the converter is changing the editable version of the field. The getAsString attribute is getting the field value and turning it into the comma-separated string you see, the getAsObject may be converting the ue for storing.

So does it work if you change the converter to use \n or
in both getAsString and getAsObject? I know there is an issue with multi-value separators, if you use anything other than a comma http://www-10.lotus.com/ldd/nd85forum.nsf/5f27803bba85d8e285256bf10054620d/6596c9408961c477852576880028115e?OpenDocument. You need to use querySaveDocument to ensure the values are correctly stored as multiple values and not as a single-string javascript array. But there are difficulties with new lines, Checking for @NewLine also picks up the letter “t” in Internet Explorer, and possibly other browsers.

The other option would be to hide the editable field, just show the read only version, and use a partial refresh to update it when the using has clicked the button. I suspect the button is using client-side javascript, in which case you’ll need to hide it using style=“display:none”, so it’s hidden but still visible to the CSJS. You can call a partial refresh using XSP.partialRefreshPost(elementId). It looks like you’ll need something to allow users to remove names from the field though, which may be as basic as allowing them to clear the value or could get more elaborate.

11

Subject: Repeats

I defer to Paul in everything as he’s the man… :slight_smile: I do like the example of using @Explode and the

But the repeats might be worth it as you can probably put a button on the repeat next to a value to remove a particular value for instance…

As for the repeat example I gave you - I’ll be doing this on episode 14 of NotesIn9 (notesin9.com). It will be out next week and I’ll show the view example and also an example of using a repeat on a document.

12

Subject: Repeating Multi-Value Fields

In case anyone is interested in using a multi-value inside a repeat I do a video demo of this here:

http://notesin9.com/index.php/2010/03/30/notes-in-9-show-14-repeats-repeated/

13

Subject: My Sol’n: XPages multi-value names display

What I ended up doing that I think will be acceptable for both READ & EDIT mode is this:

Use just an EditBox control, with NO multiple separator, maxLength set to 0 to prevent direct input, and the following custom converter:

<xp:inputText id=“projectTeam1”

style="width:80%;height:40px"

value="#{document1.ProjectTeam}" maxlength="0">

<xp:this.converter>

	<xp:customConverter>

		<xp:this.getAsString><![CDATA[#{javascript:@Implode(@Name("[Abbreviate]", value), ", ")}]]></xp:this.getAsString>

		<xp:this.getAsObject><![CDATA[#{javascript:@Name("[Canonicalize]", @Explode(@Trim(value),","))}]]></xp:this.getAsObject>

	</xp:customConverter>

</xp:this.converter>

</xp:inputText>

getAsString : This takes the values from the Notes document Names-field, converts them into Abbreviated format, and displays them as a string with a comma-and-space as delimiter.

getAsObject : Then when the XPage values are stored back on the Notes document, the name string is exploded at the comma-delimiters, trimming the leading/trailing spaces, and storing the name back in Canonical format into the Notes Name field.

Using this converter means there’s no need to massage the data to get into proper Names format in the WebQuerySave event

In READ mode, the field will display like this:

In EDIT mode, the field looks like this:

AND, if you click the NAB picker button, the names are displayed in Common-Name format correctly by the youatnotesNamepicker custom control:

Rudimentary to some, however it took me a long time to get it to this point, so maybe it’ll help others avoid the pain.

14

Subject: Repeat Control

Judy -

Let me just take a stab at one of your questions… the Repeat control. I think if you use that you’ll be able figure out the formatting.

You’re right, the repeat control is often demoed by getting data from a view or document collection. But it really can repeat over any type of list, like an array - JavaScript Vector I guess, and yes, a multi-value field.

I suspect, but truly don’t know that using a repeat is the way to go. Since you asked for an example I whipped SOMETHING up that appears to work.

I made a form and put a signal multi-value field on it. I created a view to look up the document. I think I’ll turn this into an episode of my NotesIn9 screencast (notesin9.com). Assuming so I’ll post the database there. But in the meantime here’s the code. I put a screenshot of the browser below the code.

What I’m doing is using a repeat control INSIDE another repeat control. That’s because I didn’t take the time to make an xpage for the document. You’re interested in the SECOND repeat control.

Note the data for the second repeat control is basically the getItemValue(“fieldname”) method. This returns a Javascript Vector that you can repeat on. The collection name (var) for the second repeat is item. I then dropped a computed field in the repeat and set the view to be javascript and simply put item in the code.

Assuming that you want this in a “document” xpage - you won’t need the first repeat of course. Just use this technique to repeat through any multi-value field. I’m guessing all you will need for the repeat data source is the javascript:

document1.getItemValue(“fieldname”)

Then add the computed field and set the value to the repeat var name

Give it a shot!

Dave Leedy

notesin9.com

lotusnotebook.com

<?xml version="1.0" encoding="UTF-8"?>

<xp:view xmlns:xp=“http://www.ibm.com/xsp/core”>

<xp:br></xp:br>

<xp:br></xp:br>

<xp:br></xp:br>

<xp:panel>

	<xp:this.data>

		<xp:dominoView var="view1" viewName="Main"></xp:dominoView>

	</xp:this.data>

	<xp:repeat id="repeat1" rows="30" var="rowData" value="#{view1}">

		<xp:br></xp:br>

		<xp:label value="Record" id="label1"></xp:label>

		<xp:br></xp:br>

		<xp:br></xp:br>

		<xp:panel>



			<xp:repeat id="repeat2" rows="30" var="item">

				<xp:text escape="true" id="computedField1" value="#{javascript:item}"></xp:text>

				<xp:this.value><![CDATA[#{javascript:rowData.getDocument().getItemValue("mynames")}]]></xp:this.value>

			<xp:br></xp:br>

			</xp:repeat>

		

		</xp:panel>

	</xp:repeat>







	<xp:br></xp:br>



</xp:panel>









<xp:br></xp:br>

</xp:view>