Shared Columns in XPages? - xpages

One of the better recent enhancements to Notes was the shared columns for views. I could set width. fonts, all kinds of settings and place a shared column in a view. If I needed to say, change a column width, I changed it in one place and it changed across all of my views.
Is there anyway to do this in an xPage view? There does not seem to be a view column so there does not seem to be a way to create a custom control.
Any other ways to do this?

You could create a custom control for every shared column like I did in customer app.
<xp:viewColumn columnName="lastmodified" id="viewColumn4">
<xp:this.converter>
<xp:convertDateTime>
<xp:this.pattern><![CDATA[${javascript:app.getResourceString("language","DATE_FORMAT")}]]></xp:this.pattern>
</xp:convertDateTime>
</xp:this.converter>
<xp:viewColumnHeader id="viewColumnHeader4">
<xp:this.value><![CDATA[#{javascript:app.getResourceString("language","COLUMNHEADER_LASTMODIFIED")}]]></xp:this.value>
</xp:viewColumnHeader>
</xp:viewColumn>

Related

Combo box return relevant information depends on the edit box's value

Here is what I intend to do in xpages.
When I type something in the edit box, then I click the button, the combo box will display relevant information.
Here is the design in xpage, there is a edit box, a button and a combo box. The edit box uses session scope variable, the button is used to partial refresh the combo box. The combo box displays relevant values depends on the edit box value.
<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
<xp:inputText id="inputText1" value="#{sessionScope.itemname}"></xp:inputText>
<xp:button value="Label" id="button1">
<xp:eventHandler event="onclick" submit="true"
refreshMode="partial" refreshId="comboBox1">
</xp:eventHandler></xp:button>
<xp:br></xp:br>
<xp:br></xp:br>
<xp:br></xp:br>
<xp:comboBox id="comboBox1">
<xp:selectItems>
<xp:this.value><![CDATA[#{javascript:var SetFirstValueBlank = #Text("");
return SetFirstValueBlank;
}]]></xp:this.value>
</xp:selectItems>
<xp:selectItems>
<xp:this.value><![CDATA[#{javascript:var searchitem= getComponent("inputText1").getValue();
var result = #DbLookup(#DbName(),"itemListView", searchitem,1 );
return result;}]]></xp:this.value>
</xp:selectItems>
</xp:comboBox>
</xp:view>
Suppose in the view, it has many items such as apple, apple chips, apple juice, apple pie, fish, orange, etc.
When I run the program, I type apple pie exactly, the combo box can show the exact value (apple pie) for me to choose, but if I just type appl (not the exact value), the combo box will not show anything. In fact, I think the combo box will show apple, apple chips, apple juice and apple pie for me to choose, but the result let me know that I am wrong.
I revised the code, I guess the combo box does not return anything for selection because I use #DbLookup, so and #DbLookup requires the exact value, so the combo box will not show anything.
The reason I choose to use combo box is it allows the user to select one value only.
I think about #DbColumn but it will return all values from the view column, so I use #DbLookup, but it needs the exact value to lookup.
How can I make the combo box return relevant information depends on the edit box's value.
Grateful for your advice please. Thank you.
Use view's getAllEntriesByKey() with parameter exact set to false to get all entries which start with the given key (in your example "apple").
instead of using a inputText + combo, have you considered using a control that provides this sort of behavior in the one control?
if you are able to use the extension library, you could use the dojo filteringselect control or dojo combobox control.
both are similar to each other but for dojo filtering select, you must choose a value from the given select list. for dojo combobox you are allowed to also type any word even if it is not in the list
here is an example from Brad Balassaitis's blog
https://www.google.com.au/amp/s/xcellerant.net/2013/09/18/xpages-dojo-filtering-select/amp/?client=safari
by default, the entries are matched with a 'starts with' style, so 'pie' would not match 'apple pie' but 'app' would.
if you want filtering select to match any part of the word then you set the queryExpr as follows
<xe:djFilteringSelect id="djFilteringSelect1" value="#{viewScope.myvalue}" autoComplete="false">
<xe:this.queryExpr><![CDATA[${javascript:"*$\{0}*"}]]></xe:this.queryExpr>
<xp:selectItems id="selectItems1" value="#{myBean.mySelectItems}"/>
</xe:djFilteringSelect>

Display multi-value fields with new line in Xpages view Column

Sometimes Xpages drives me insane. So many easy things (things that should be easy anyway) are hard.
Simple questions, how do I display multi-value fields with new line in Xpages view Column?
There's ways to do it with computed controls, where you explode the array and add a and stuff like that.
Personally I like to just use a repeat control. Set the field as the repeat value. Add a computed control for the "rowData" and add a if you want a new line between each of them. I'm sure I did this on an early NotesIn9 though I forget which one at the moment.
the key is this. a Repeat control can repeat or "iterate" over any type of array or "multi-value" object.
It's always better and easy to use view control for categorized views rather than repeat controls. To display multi-value field in view column you have to set content type as HTML then just replace commas with <br> tag. And it works exactly as you want.
<xp:viewColumn columnName="$3" id="viewColumn3" contentType="html">
<xp:this.converter>
<xp:customConverter getAsObject="#{javascript:value}">
<xp:this.getAsString><![CDATA[#{javascript:#Implode(value, '<br>')}]]></xp:this.getAsString>
</xp:customConverter>
</xp:this.converter>
<xp:viewColumnHeader value="ColumnHeader" id="viewColumnHeader3">
</xp:viewColumnHeader>
</xp:viewColumn>

Dynamic Fields in xPages

I have a repeat control that is gathering its data from a view. Displaying in a table is one column from the view. These entries can be variable. For each entry in the repeat control I would like to have a couple of user editable fields (comments and checkboxes). Since the amount and names of entries are dynamic I think dynamic field binding is the way to go. The problem is I have been struggling with it for a few days and have gotten no where.
So in the repeat I have a computedfield displying the value of the column. I was thinking of making the field name for the comments field the value of the computedfield. The datasource would be the same, just the fieldnames would change and be based on the entries in the row.
The previous entries stackoverflow entries about dynamic field binding all list passing custom properties, I still haven't gotten my head around those.
If the value of the computedfield1 = "One" then the datasource/field name for the inputText1 = "document1.One", and if the computedField1 = "Two" then the datasource inputText1 = "document1.Two"
Is this even possible?
I'm a little confused by if you want these to be things you're setting to render at page load or if you want them to dynamically change based on user entered data, but I'll assume it's the former and give you an example.
If I'm iterating through a view in a repeat control, I probably have something like:
<xp:repeat rows="50" var="currRow" value="#{ViewName}" IndexVar="rowNum">
</xp:repeat>
Inside my repeat, I will put a reference to a custom class
<xp:repeat rows="50" var="currRow" value="#{ViewName}" IndexVar="rowNum">
<xc:dynamicRowBinding dataSource="#{currentDocument}">
<xc:this.binding1>
<![CDATA[#{javascript: currRow.getColumnValue("binding1");}]]>
</xc:this.binding1>
</xc:dynamicRowBinding>
</xp:repeat>
What this is assuming is that the document you're binding things to on the XPage is declared as currentDocument, and that there is a column in your underlying view that is calculating the desired field binding for the current row based on the properties and values of that document.
In the custom control, the following exists:
By defining dataSource and binding1 as properties within the custom control, they will be available as compositeData.
Thus, to bind a field using these components, we simply put the following definition in our custom control:
<xp:inputText value="#{compositeData.dataSource[compositeData.binding1]}">
</xp:inputText>
I hope this helps!

How can I allow selection of a date using the calendar button but disable typing of date in Dojo Date Textbox?

How can I allow selection of a date using the calandar button but disable typing of date in Dojo Date Textbox?
Is there a way to do this? If so how?
Basically I want the users to be able to select a date using the calendar button but don't allow them to manually enter a date.
Create a client-side onfocus event:
thisEvent.target.blur();
That doesn't prevent the field's value from being programmatically populated via the date helper, but if they try to manually focus (i.e. click or tab into) the field, it will kick them back out again.
There is a new property of showReadonlyAsDisabled which I tried on date time field. But it ended up creating a disabled field, but surprisingly it creates a readonly field in case of edit box. So I had to create a workaround by setting the readonly property via javascript while loading the page. Below is the code snippet:
<xp:inputText id="dateTimeField">
<xp:dateTimeHelper id="dateTimeHelper1"></xp:dateTimeHelper>
<xp:this.converter>
<xp:convertDateTime type="date"></xp:convertDateTime>
</xp:this.converter>
</xp:inputText>
<xp:br></xp:br>
<xp:scriptBlock>
<xp:this.value><![CDATA[XSP.addOnLoad(
function() {
document.getElementById("#{id:dateTimeField}").readOnly = true;
}
);]]></xp:this.value>
</xp:scriptBlock>
I don't know if this is optimal solution, but it works!

Expand only some of the categorized columns in a viewPanel upon opening

I am using a ViewPanel to show a categorized view. This view has 4 columns of categories. There are 3 additional columns that are totaled.
I want to open this view so that the first 3 categorized columns are expended and the 4th one is collapsed.
Is there some type of SSJS / CSJS that I can add to the view that can do this?
I didn't see an option to expand/collapse a column upon opening the view in the Properties of the viewPanel.
I tried using the collapse option on the back-end view but that has no effect on the Xpage side. I tried hide detail rows, but they show up anyway.
To do this, just change the expand level of your datasource:
<xp:this.data>
<xp:dominoView var="view1" viewName="NameOfYourView" expandLevel="4" />
</xp:this.data>
EDIT:
You can even control this by adding a simple URL parameter: nameOfXPage.xsp?expandLevel=3
Have a nice day
Sven

Resources