How to pass var variable to custom control - xpages

I want to create a generic action bar custom control with Save, Edit, Delete, ... buttons.
How can I pass var variable from xpage to a custom control?
Update
I successfully transferred document object to custom control and I can Save the changes made in document, but I can't delete it with same object.
Update:
<xp:this.action>
<xp:executeScript
   script="#{javascript:compositeData.datasrc.save()}">
</xp:executeScript>
</xp:this.action>
Delete is not working:
<xp:deleteDocument
message="Do you want to delete?"
var="#{javascript:compositeData.datasrc}">
<xp:this.name><![CDATA[#{javascript:var page = sessionScope.get("prevview");
return (page=='')?'home.xsp':page}]]> </xp:this.name>
</xp:deleteDocument>
I tried also with:
var="#{javascript:compositeData.datasrc.getDocument()}">
but also didn't work.

When you define a custom control, you can specify control properties. These properties then show up in the property editor when you insert the custom control into an XPage or another control. You can specify the data type and allow them to repeat.
This is saver than to rely on scoped variables. Check Chris' introduction and the XPages 101 session or and many more for inspiration

You can do it for example with a Scoped Variable. If the variable value is specific to that XPage (and user) viewScope is probably the best.

The above options are the best way to do that, but keep in mind that if you define a variable in a scriptblock or somewhere else in the Xpage, you will be able to access this variable from your code in the CustomControl, too. I think that's because the XPage und the custom Controls are kind of merged when compiled. Keep that in mind, this can lead to very nasty problems, especially with recycling issues.

What is the purpose of this variable ? If its a variable to control which buttons are being shown it would be best to create properties for each button / section. These properties can be computed to either return true or false.
If you want to pass the code that a button should execute I would advice you to generate button bars for the most common locations ( aka actions ) and add custom buttons on the button bar by using a facet (Editable area its called in the designer) .On this facet you'll drag a panel on which the buttons are being placed.

Related

Xpages dojo dialog box selected values

I have dialog box using dojo, that is placed on top of the xpages view action to present user value from one of the view first column and then do the excel to export process. I also added XSP.addClientLoad fuctionality as well to get values user selected.
on OK button of dialog box, I have below code on client side javascript.
var d=dijit.byId('#{javascript:compositeData.dialogID}');
var SelectedValues = document.getElementById("#{id:SelectedValues}");
SelectedValues.value =d.getSelectedValues();
alert(d.getSelectedValues());
context.redirectToPage("excelExporter2.xsp",false)
Which saves the value of the existing selection of dialog box to session scope variable in hidden editable field of Custom control.
Is this correct approach to set scope varaibles ?, also I want to loop through categorized view based session scope variable and export them on xpages so aftr this I want to trigger SSJS which will take care of excel to import part.
So my final aim is that based on user selection of dialog box, I want to run excel to export functionality (which is ssjs ) so please help me how to get started from here to jump into SSJS and also my approach of setting session scope variable is appropriate ?
Do You have a part of code that has to be ran on client side? If not, try to write it on server side straight away. For example to do Export to Excel You could probably use "window.open('some_url')" rather than that.
Otherwise, You can use this trick to fire a SSJS event on XPage/Custom control:
Create an event somewhere on XPage. Make sure it has and ID property, and that the event name is something else than standard events (onChange, onClick). Put the server code in that event that You want to run.
<xp:eventHandler id="eventHandlerId" event="myEvent" submit="true"
refreshMode="partial" refreshId="refreshId">
<xp:this.action><![CDATA[#{javascript:peformSSJSAction();}]]></xp:this.action>
</xp:eventHandler>
Fire the event from client side Javascript.
XSP.allowSubmit();
XSP.firePartial(null, "eventHandlerId", "refreshId");
Parameter "refreshId" is the refresh ID of refreshed area during partial refresh after the code is done.

Changes to DOM objects are lost after partial update

On a page I have some fields that I want to be "readonly" (in my meaning they can't be accessed but they will store values, read earlier question in this matter if issues...).
I use a client JS setting these attributes on page load:
$(".readonly").attr('readonly', true);
If I have a partial update on any of these fields the attribute is lost and the field is accessible.
What is the best practice to overcome this and make it work?
Every partial refresh has a oncomplete method bound to it. What you could do is add code to the oncomplete method so the item is being set readonly again. Another, better, approach would be not to change the attribute clientside but to have hidden fields which are used to store the data.
When you have an event bound to for instance an Link control you can change the oncomplete code by clicking in your source pane on the event tag. When you browse the events section in the properties pane you will see the onComplete, onError, onStart properties. You can add your own clientside script in these properties.
Before trying to overcome the "problem" You shoud try to understand what exactly partial refresh do and where the state of application is kept.
Unfortunately partial refresh is replacing current html content (or rather part of it) with a newly created one and only form fields that has backing controls will keep state.
I suggest You should try setting readonly property on controls which You would like to make readonly (if there is some logic here You can always use ssjs).
Optionally You can try to preserve the state on the client side by using csjs global variables but this is rather hard to manage.
And one more thing - try to use the technology to solve the problem(xpages) and try not to hack Your way through with use of stuff that You accidentally know (jquery).
I would agree with jjtbsomhorst on using onComplete event. But another alternative could be setting the readonly property via code like this:
var textField:com.ibm.xsp.component.xp.XspInputText = getComponent("inputText1");
var readOnlyAttr:com.ibm.xsp.complex.Attr = new com.ibm.xsp.complex.Attr("readonly", "readonly");
var list:java.util.ArrayList = new java.util.ArrayList();
list.add(readOnlyAttr);
textField.setAttrs(list);
You could call this on the afterPageLoad event of the XPage. But I really don't know whether this would be the best way to about!

compute dynamically the allowDelete property of file download xpages

I am using a file download control and I would like to set the value of the "allowDelete" property dynamically depending on whether the document is in edit or read mode. However, this
property is computed onload of the page. I tried calling the function "setAllowDelete(boolean)" on the onclick event of a button or the "beforeRenderResponse" event of a custom control and a partial or full update to change the value of the property, but it didn't change.
Do you know if there is a way to do this?
Thanks a lot in advance!
I have encountered the same problem. There are two options to workaround it.
1) To use two controls, one with deletion enabled, the other with deletion disabled, and use rendered properties according to edit state (or user role).
2) Render download controls by your own, as data table or repeat. However, this solution has its own problems, too.
Have you tried just calculating the property like this?
<xp:fileDownload .... >
<xp:this.allowDelete><![CDATA[${javascript:
return document.isEditable()}]]>
</xp:this.allowDelete>
</xp:fileDownload>

XPages remove documents on server and trigger partial refresh

I am struggling with the following.
On my XPage I have a viewpanel component, but it is not bound to a notesview datasource, but to a hashmap stored in viewScope. Reasons for this is beyond scope of my question.
Since the lines in my view are not actually linked to the documents I cannot use the standard checkboxes and the related getSelectedDocIds. I do however want a way to remove the selected documents. I have a column with checkboxes containing the unid of the corresponding row.
So long story short. I have an array of unids and want to perform an action that does the following:
Display a dijit.Dialog asking for confirmation
If OK clicked call a function that does the following:
Remove the documents based on the unids
Refresh the viewpanel
I am thinking of the following 2 solutions, but in doubt what would be best (maybe a third, even simpler solution?)
Have the OK button of the dojo dialog call a function that does an XmlHttpRequest to an XAgent or plain old LS agent
Have the OK button trigger an eventhandler that runs on the server as described by JeremyHodge here. But how would I pass the unids as parameter and refresh the view afterwards?
Thanks!
Cant you just make use of the extension library dialog with the dialog button control. In this button control you can then
A third option would be to add a column to your datatable/view which contains checkboxes. On the onchange event of these boxes you add an eventhander which adds the value to a viewScope variable.
A button on the bottom (or top.) of the page you add the code you need to remove the selected items from the hashmap, delete the documents associate with the selected id's. this button can be a ordinary button with a partial refresh on the viewpanel. When you run into the bug that you cant use buttons in a dialog please use the extension library dialog control because this fixes that issue for you.
If the current user does not have the correct access level to delete documents you could use the sessionAsSigner global (assuming the signer of the design element has the correct access levels).
This way you dont need to go call an xAgent by xmlthttprequest and can stay with the default xpage methodology.
I hope this helps in some way
I would second #jjbsomhorst in the use of the extension library for the dialog box - if you use one at all. Usually users don't read dialog boxes. So the approach would be add the column with the checkboxes, but don't bother with an event handler, but bind them ALL with their value to ONE scopeVariable. On submission that variable will then hold an array with the selected UNID.
Then render a page that lists these documents and have a confirm button. While the new page affords a server round-trip the likelihood, that users actually pay attention is way higher. What you can do:
Have the normal page that renders the dialog with editable checkboxes and when the user clicks "Delete" you set something like viewScope.confirmDeleteMode=true; and use that as condition for the checkboxes and make them read-only AND set the class of the selected rows to "morituri" which in your CSS would have something like .morituri { color: white; background-color : red; font-weight: bold } and a new button "Confirm Delete" (and hide the Delete button).
This way you only have one page to deal with.
I went for option 2, which has the possibility to provide the partial refresh id. I passed the unids as a submitvalue like:
function doRemove(unids){
XSP.executeOnServer(ISP.UI.removeEventID, ISP.UI.removeRefreshID, {
params: {
'$$xspsubmitvalue': unids
},
onComplete : function() {
//alert('test')
}
});
}
The ISP.UI.removeEventID performs the following code:
var unids = context.getSubmittedValue();
removeDocuments(unids); //SSJS function performing the actual delete
viewScope.reload = 'reload' //triggers the hashmap to be rebuild based on new documentcollection

The buttons in a repeat don't hide/show after refreshing the panel the repeat is in?

I have a repeat that has buttons embedded in it. The repeat is in a panel. When the user clicks a button the button should hide/show (I partial refresh the panel). The repeat is tied to a Domino view and I see the other values that I from that view get updated in the repeat, so, it does not seem like a view index issue (I refresh the view index in my code.)
If I use context.reloadPage() in my button onclick code then the buttons will hide/show like they should, but, that seems like I am using a sledge hammer! Any suggestions on how to get the buttons to recompute the visible property when the panel that holds the repeat is rendered? Another strange thing is that the visible property gets computed three times whenever I refresh the panel that holds the repeat.
thanks, Howard
I think your looking for
getComponent("<id>").setRendered(true / false);
Hi For Repeat control's entry is used to make our head hard. Because handling the entry by SSJS, we can get the value and set the value. But rendering part, id of the repeating component are same for all. So if we try to give reder as false. It hides all of our repeating component.
Try to use the following., [Put this in button onclick, and see the value of below]
var entryValue= getComponent("repeat1").getChildren().get(0).getValue()
getComponent("inputText1").setValue(entryValue)
But in client side we can easily handle. Because the id of the DOM object is unique for all repeating component.
var id1="view:_id1:repeat2:"+'2'+":button1"
document.getElementById(id1).style.display="none"
This will hide the third entry of your repeat control component.
Please see the post, You may get better idea
Found a solution. My original solution was getting values from the repeat rows (using the collection object, which was a viewentrycollection and using getColumnValues) to compute the rendered property for the buttons.
Instead, I created a viewScope variable (a Vector) that holds the state of the buttons (which set of buttons to show). This gets populated in the beforePageLoad event of the page.
The button onclick code updates this viewScope variable after performing its processing. All works very nice now. I guess it was something in the JSF lifecycle that kept the buttons from being properly updated. Using the viewScope variable works fine.
With addition to what Ramkumar said, you can use the index variable in the repeat control to identify each and every occurrences inside the repeat control. You will get more idea, if you inspect with element from firefox[You might need firebug]. Usually the field mentioned inside a repeat control itself can be considered as an array

Resources