I added a required validator for a radio button group but it does not seem to work. I understand this might be an issue with radio button groups?
I found this solution here
http://www.bleedyellow.com/blogs/patpicos/entry/xpages_xp_validaterequired_not_working_on_radio_buttons_not_radio_button_groups1?lang=en_us
but it uses server side validation and the rest of my form is using client side and both look different. I would much rather them look the same. Is there anyway to validate a radio button group client side?
Validate required will work for radioGroup control.It doesn't work with radio controls grouped by a groupName.
The below CSJS code may help you to see any one of the radio controls in a group are checked or not (put it in onclick event of a button).
var isChecked = false;
dojo.query('input[name$=groupName]').forEach(function(node){if(!isChecked){isChecked = node.checked;}});
if (!isChecked)alert('no value checked.')
Related
Right now I am working on a Xpage which displays data from a domino document. Based on the form of the document different fields will be displayed.
Now I want to create a "New" function. My idea here is to set the view I am previously using in edit mode.
Additionally, I want to add a radio button which enables a user to choose the form of the document he wants to create.
Based on this radio button the document form should change which should result in the elements displayed on the page changing too.
Overall if I switch between the radio button options and hit save, a new document will be created with the right form.
Yet my problem is that my elements in my view won't change dynamically. So if I switch my form there will still be elements/controls displayed for the default option but not the selected form.
My idea was to create an onChange-event for my Radio Button Group.
My questions here would be: How can I change my formValue for the Xpage (new document) and then reload it with the new set value?
Thanks for your explanation.
I understand you have one XPage suitable for multiple forms, I assume using a Switch control and custom controls per form. About the New button, you could try first to have 3 New buttons, each for a separate form, and you create a URL like yoursite.com/xpage.xsp?action=newdocument&form=someform
When the user clicks the button, your page can read the parameters (param.action and param.form) and act accordingly. Or do you intend to update the current page using partial refresh, as a single page approach?
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.
I am new to WinJS, and I want to make a ContentDialog that will contain a textbox, for entering an API key and Submit and Cancel buttons. When the ok button is clicked, a method should be triggered that will do a bit of validation and then persist the data. I have been trying to find out how I can add an event listener to one of the ContentDialog buttons but cannot find out how. I have been googling, and found:
http://try.buildwinjs.com/#contentdialog
https://msdn.microsoft.com/en-us/library/windows/apps/dn904229.aspx
https://mindfiremobile.wordpress.com/2013/08/27/displaying-dialogs-in-winjs/
None of these hint on how to accomplish this. Can this be done? If so how?
in your JS code add:
var button1 = document.getElementById("button1");
button1.addEventListener("click", button1Click, false)
'button1' is the id of the HTML element.
'button1Click' is your js function to perform the action.
In our JSF web application, we have an input field where the user can enter a numeric ID, which is then looked up by the app. To help the user, the lookup is bound to "onchange", thus it will be triggered as soon as the user tabs out of the field or clicks elsewhere.
So, user enters "123", presses tab (or clicks), lookup runs. This works fine; however, for usability reasons, we also want to provide a button that users can click on, for users who will otherwise wonder "where should I click to trigger a lookup?". To do this, we'd like to provide something that looks and feels like a HTML / JSF button, but does nothing (as the click will trigger the "onchange" event anyway).
Is there a way to make a JSF button that does nothing? I tried using h:commandButton without the "action" attribute, but it still fires a request.
p:commandButton type="button" will just provide a push button.
Since you tagged this question also as a usability issue, I would advise against a button in the first place if the onchange already triggers the lookup.
From a user's perspective it is confusing whether or not clicking the button is mandatory. After they have entered the field and skipped to the next, they see the lookup occur without clicking the button. If there is a button they will assume it's there for a reason.
The option that I favour in these cases is a onkeypress handler with a timeout of half a second, after which the value is looked up.
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