Javascript code to kick off Spring WebFlow2 transition - java

Does anyone know of any javascript code that I can put on a radio button that will kick off a Spring WebFlow2 Transition event?
I am looking to kick off a transition to load values into a dropdown if the user clicks on a radio button... can someone please tell me if you seen this done.

In your situation I think you want to use Ajax to refresh only part of your page. What I use is a function in my global js file:
function ajaxWebFlowSubmitGet(divID,pars,view) {
new Ajax.Updater({success:divID},
view+"&date="+new Date().getTime(),
{ method:'get',
parameters:pars,
evalScripts:true,
onFailure:reportError,
requestHeaders: ['Accept','text/html;type=ajax']
});
}
which you can use then in your code with
ajaxWebFlowSubmitGet('dropdownListDiv','_eventId=eventID&fragments=dropDownFragment',${flowExecutionUrl});
just put that 'ajaxWebFlowSubmitGet' function in your page and call it from your radiobutton.
'dropdownListDiv' is the div you want to get updated
eventID is the name of the transition from your webflow you want to execute
dropDownFragment is the name of the fragment you want to receive as a response (and to be put in your 'dropdownListDiv')

Related

How to automatically reload a jsp based on other page action

I have a situation that i can't handle and thats why need your help.
I have a jsp page (mention as A in below pic) where there are many rows and each of them can be edited.
At the end of the A jsp page, there is an option to print the page data.
Now, if some body clicks on the edit link/button, another page will open contain the data for that particular row and user can modify the data in the second page(i,e B).
Now, i want, as soon as the user save the B page, A page should be refreshed automatically to provid the updated data for printing.
Please guide me on how to acheive that . I'm using Spring MVC framework for the java application.
The Spring MVC way to meet your requirement is:
the Edit buttons in page A should be links calling page B with the id of the line to edit, something like Edit
the SaveAndClose button in page B should be a submit button that posts the edited values to a controller method. After server side processing, the controller method should redirect to page A. As a side effect, you use the PostRedirectGet pattern which avoids the ugly do you want to send again ... ?"
#RequestMapping(path = "...", method = RequestMethod.POST)
public String saveAndClose(...) {
...
return "redirect:/path/to/pageA";
}
Of course this will display all pages in same window.
If you want to redisplay the window containing pageA on the Save & Close from page B, still allowing the save to be known to the server, you should redirect to a special page (say pageC) that just contains javascript code asking the browser to redisplay pageA. You can either pass the name of the window containing pageA in a hidden field, or you can decide that as the programmer of the web application you know where it should be.
It can be achieved like this. Follow the steps mentioned
1] When you click on edit button in Page A, pass the id of the row to Page B as request parameter.
2]In Page B JSP receive the id of the row and store it in a hidden element.
3]Create a JavaScript function in Page A which should receive row Id and Modified data as parameter. Lets name it this function as updateRows(rowId,modifiedData). In this function write code to update the with id 'rowId' with modified data using javascript
4]Now When you click on 'Save & Close' Button in Page B. Save the data using call to server. If save succeeds then invoke the function updateRows passing it rowId stored in hidden element and modified data as parameters. This function will update the DOM with latest data.
This way you will avoid making server call to refresh the data
There is one more way if you don't want to use ajax.
In Page A define a javascript function refreshPageA(). In this function add page refreshing logic.
When you click on 'Save & Close' button in Page B save the data in server and forward to a plain jsp. In this JSP declare a onload handler. Inside onload handler add following code
opener.refreshPageA();
window.close()
This will refresh pageA and close page B window

How to finish the activity when user clicks on the submit button on webView

I have a webview in my activity and i am displaying a form in this webview. I want to finish the activity when user clicks on the Submit button of the form. How can i do this.
Or in Another way you can say that i want to get the id of the button when users click on that in java and perform the finish Activity method.
I have gone through this link
Detect click on HTML button through javascript in Android WebView
Thank for considering..
You can pass the parameter into java script handler method to solve ur second option.
<button type="button" onclick="jshandler.onClick('HEllo');">OK</button>
And retrieve from the method.
#JavascriptInterface
public void onClick(String id) {
Log.i("JsHandler onClick", id);
}
u can find the complete tutorial here
Take a look at WebViewClient's methods. Some of them might be appropriate for you. For example if the submit button loads another page and you know it's url, you can listen for it's loading in onPageStarted or onPageFinished. I am not sure whether these methods will work for you but at least you can search for WebViewClient solutions of a similar problem.

Refresh only update panel on parent from pop-up window

I have a button which opens a pop-up window and an Ajax update panel. Inside that window I have another button.
What code do I have to run if I want that update panel to be refreshed, when I press the button from the parent page, without refreshing the whole page?
I sow this code on a web which refreshes the page:
<div id="Container" onclick="__doPostBack('UpdatePanel1', '');">
I am such a good friend with Java.
You need to utilize window.opener object.
window.opener.document.getElementById('Container').onclick();
I'd suggest using jQuery to ensure cross-browser compatibility. And also adding some null-checks of course.
Use Jquery :
If the DIV ID remains static :
$("#Container").click(function() {
// REFRESH CONTAINER HERE
});
If the Div ID is dynamic then make use of class instead of ID:
$(".Container").click(function() {
// REFRESH CONTAINER HERE
});

Submit button to submit form and go to next screen using jquery form-wizard

I am using jquery FormWizard and would like to use submit button on last screen as a way to submit the form and go to next screen.
Issue is I am embedding this jquery script in my Java code. Right now I have a "submit" button from jquery form wizard and I have a "continue" button from my Java code. So user submits the form by pressing "submit" and then press "continue" to go to next screen. Not an ideal situation for user.
If I just use "continue" without pressing submit, it doesn't store any information of the form. Once I press "submit" and then "continue", all information on the form will be saved in the database. How can I use continue button as submit and also to proceed to next screen so that I don't need that submit button on last screen.
Script sc = new Script();
sc.add("$(function(){$('#formScreenQuestions').formwizard({formPluginEnabled: true,validationEnabled: true,focusFirstInput : true,disableUIStyles : true});});");
HEADER.add(sc);
Form form = new Form("criteria");
form.set(ID, "formScreenQuestions");
Div dh = new Div();
dh.set(ID, "lastStep");
dh.set(CLASS,"step");
Table vt = new Table();
vt.row();
vt.cell(text("Please press SUBMIT before pressing CONTINUE"));
==== showing some questions with checkboxes to select =====
dh.add(vt);
Div db = new Div();
db.set(ID,"navigation");
Table bt = new Table();
bt.row();
bt.cell("<input type='reset',id='back',value='Back' />");
bt.cell("<input type='submit',id='next',value='Next' />");
db.add(bt);
form.add(dv);
form.add(db);
You could add an "on submit" event to your form.
http://api.jquery.com/submit/
Make a server-side redirection if submit is ok, to the next page.
OR
On the submit callback make a
$("#continueButton").click();
If I understand correctly, formWizard just helps you divide your form in multiple steps using a wizard.
You cannot just bind click the button because it would trigger when ever one clicks next.
What you should do is use this event from formWizard, then you wouldn't be adding complexity since you wouldn't be overriding any of the functionalities of the plugin you're using :
$("#demoForm").bind("after_remote_ajax", function(event, data){
if(event.success && event.currentStep === finalStep) {
windows.location.href="URL to be forwared to";
}
});
Propably the best way is to use jQuery's submit event and using AJAX submit it to server:
$("#form-name").submit(function(){
$.post("submit-path", function(result){
// do something with result
});
return false;
});
If you are using JQuery -- why not used the Power of AJAX and make it more better user experience -
Define a jQuery event on Continue button :
$("#continue-button").click(function(){
windows.location.href="URL to be forwared to";
}):
Submit an AJAX Request on click of Submit Button(Look at the documentation of AJAX method of jquery has how to show processing icon"
AJAX Request :
$.ajax({
url : actionURL,
dataType : <your dataType>,
contentType : <your Content Type>,
type : 'post',
data : <bla bla>,
success : function(data) {
//Show Continue button
}
});
};
wouldnt it be better if you use the continue button in the jquery form, and remove the submit button from Java?
$(function(){
// bind a callback to the before_step_shown event
$("#demoForm").bind("before_step_shown", function(event, data){
if(!data.isBackNavigation){
doSubmit();
}
});
});
I think this is a design issue. If you are trying to create a multistep form where data are saved between each step, you should have a submit button on every step of the form, submit the data to the server, keep the track of the step using an input hidden value then send the next part of the form to the client. It is safer because your form will work even if javascript is not enabled client side. In such design, the process could be improved later to add an AJAX functionality.
If you do not need the data to be send between each steps, then you can do a single form with some kind of panel for each subforms that would be shown or hidden depending where the client is.

Simple way to reload page with form data filled with previous data

I have a simple register page with a captcha image and I offer the user an option to get a different captcha image. At first I just tried reloading the page which gives me a new captcha image, but unfortunately the form is then cleared which would be unacceptable and annoying for a user.
How would you solve this issue? If I submit the form from the "new image" link the wicket posting process will return with all sorts of validation errors before it reaches my onSubmit function which is also not good behaviour.
I guess I could also add ajax partial reloading of the captcha image although that is a more complex solution. Any pointers to a good and clean solution would be nice.
You can submit the form in your "new image" link by making it either a Button or a [Ajax]SubmitLink. Then you can skip everything but the link's onSubmit method by calling setDefaultFormProcessing(false) on that link:
checkForm.add(new SubmitLink("submit") {
#Override
public void onSubmit() {
super.onSubmit();
// ...new captcha here...
}
}.setDefaultFormProcessing(false));
This will cause everything to be submitted (and retained for the next render) but it will skip conversion of values, validation, and model updating.

Categories

Resources