Execute multiple framework7 router functions back to back - javascript

I am building an app where a user can submit a form using ajax and the form will submit and upon success will go back to the previous page and then load two more pages. Here is a little bit more info before I get to my code snippet
I have a list of items and want to add another item. I have a button that will open up an add item form. When I submit the form with AJAX and upon success I want to :
Go back to the list of items in history mainView.router.back() to refresh with newest item and then
Go to the item page mainView.router.loadPage() and then
Go to a task for that item automatically which is another page mainView.router.loadPage()
I want all these three actions done at once one after the other. Going back will prevent the user from using the back button and getting back at the form that has already been submitted, going to the item page will be there in case the user does not want to perform the default action of starting a task for the item. I have successfully tested and can perform any ONE of these actions, but cannot figure out how to call the router functions one after the other simultaneously.
...
var item_id = data.newItem.id;
mainView.router.back({
url: page.view.history[page.view.history.length - 2],
force: true,
ignoreCache: true
});
mainView.router.loadPage('http://app.myapp. com/item.php?id='+item_id);
mainView.router.loadPage('http://app.myapp.com/start-item-task.php?id='+item_id);
...

Related

JSP/Servlet keeps old session values on back button (browser)

So the problem is that i have a InitialPage.jsp page, that does the next thing when load:
if (<%=(Boolean) session.getAttribute("error")%>) {
showPopupWithError();
}
Login.jsp submits a form that calls ValidationServlet.java, that manages the validations for InitialPage.jsp, so, at the beginning of doPost(...) i set session.setAttribute("error", false), and start doing the validations.
If any input is wrong, the servlet will do session.setAttribute("error", true), and redirect to InitialPage.jsp, continuing with the cycle. As the scriptlets load, the .jsp will get the following code:
if (true) {
showPopupWithError();
}
And show the message.
So i continue loading data to inputs, and when everything is ok, i submit the form again.
The servlet validates correctly (so, the attribute "error" keeps set to false, as i had done at the beginning of the doPost(...)).
The problem comes as, when the next page shows (MainPage.jsp), the user should be able to press the back button of the browser and go back to InitialPage.jsp.
When it goes back to InitialPage.jsp, the attribute "error" is set to true, ignoring the last call to the servlet (when it validated correctly, set it to false, and redirected to the next page), and it automatically shows up the error message popup.
So basically the idea is to find a way to conserve session values after pressing the back button of the browser, and i couldn't manage to do that.
Thanks!

Go back to the actual previous page regardless of a form post error

I have a page with a form. On this page there is also "go back to previous page" link, which uses the following JavaScript:
window.history.go(-1)
When the form is posted and there is a validation error, the website returns the user to the same form page. However, clicking on this link in case of a form validation error gets the user to the form page before its submission, not the actual, different previous page.
How can I get the user back to the actual previous page by ONLY using JavaScript? Please note that there could be multiple times of form submission with errors.
You could probably use location.replace() in your redirect after validation error.
This will erase the current page location from the history and replace it with the new one, so it has no effect on page history.
Another option is to use sessionStorage to check if the URL has actually changed after going back one page in the history.
window.onload = function() {
document.getElementById("back").onclick = function() {
sessionStorage.setItem("href",location.href); //store current page into sessionStorage
history.go(-1); //go back one page
};
if (location.href == sessionStorage.getItem("href")) {document.getElementById("back").click();} //if current page is the same as last one, go back one page
else {sessionStorage.removeItem("href");} //clear sessionStorage
};
In the demos below (SO doesn't allow sessionStorage) I had to simulate both "going through the history", and "page load for every history item", so the code looks a little different, using an array and other vars and functions, but the principle should be the same:
codepen: https://codepen.io/anon/pen/OgBgGg?editors=1011
jsfiddle: https://jsfiddle.net/j0ddnboq/2/
You could store the "actual" previous page in a hidden form field on initial load and send this along with the form, then in your "go back to previous page" link js you could access that data.

call spring action from jquery without ajax for multiple buttons like view edit etc

I am working on Spring MVC. I have a page having list of items in table. I need jquery to pick up the radio selected and then user can click on view or edit or delete. According to the button clicked, ajax block invokes proper action with the form object serialized and the id goes to the action for processing.
Everything went fine till here.
Then, when the action returns back to ajax success: block
$.ajax({
type : "post",
data : str,
url : newUrl ,
async : false,
success : function(data) { <----- here
I need to redirect to page action has in its view object. Instead, as we know, its ajax, so I need to show the result in some div on that page itself. But I need to go to the page directed by spring action. Please help me do this.
In short, I don't want to show the details on a pop up but another page.
Thanks.
get url of page directed by page action and use following statement to redirect page
window.location = pathReturned;
above statement will simply redirect users' browser window. So if you may require to persist state of the page.

APEX 3.2 Javascript Function Confirmation for 'Cancel' button

I am looking to create a JavaScript function that will display a confirmation popup box when a user clicks on the ‘Cancel’ button in an APEX 3.2 application.
I want to ask ‘Are you sure you want to cancel this issue?’. Show a ‘Yes’ and ‘No’ button. If the user clicks ‘Yes’, send them to page 1. If the user clicks ‘No’, keep them on this page (2).
I just need to know how to send the user to page 1 or keep them on page 2. Many thanks!!!
function confirmCancel()
{
var r=confirm("Are you sure you want to cancel this issue"?);
if (r==true)
{
Go to page 1
}
else
{
Stay on page 2
}
}
There are maybe some functions in the APEX 3.2 JavaScript API that could be useful for you (confirmDelete() for example).
Else you can use apex.submit, passing an item with a specific value, then depending on that item value you can have a page branch.

MVC 3: Communicating between partial view and view via JavaScript

I have a page that lists users (List.vbhtml), and each user has an 'Edit' link. The edit link makes an Ajax request:
#Ajax.ActionLink("Edit", "Edit", "Player", New With {.id = currentItem.PlayerId}, New AjaxOptions() with { .UpdateTargetId="edit"})
The Edit method in my controller returns a partial view (_Edit) which contains a form. After the form has been submitted, I want to hide the edit form (not a problem), and then reload the list of users. This is what I am struggling with.
How do I let the parent view (List.vbhtml) know I should reload the list (which would be done using a Ajax Get request)?
I can't do this from the Edit partial view, because the Edit partial view shouldn't know about the List view, only the other way around (List view knows about the partial view).
My current solution is to raise a custom event when the edit is complete in _Edit.vbhtml, and capture it in List.vbhtml:
_Edit.vbhtml:
//let anyone listening know the edit is complete
$(document).trigger('PersonEditComplete');
List.vbhtml
//when player edit is complete, reload the player list
$(document).bind('PersonEditComplete', function () {
Player.List.Reload();
});
Thanks
You can use jQuery .ajaxComplete() event handler. You have to check if the XHR method is GET or POST. Get will be after loading user edit form, POST would be after subbmiting it.
So if ajaxComplete fires after POST call then you should refresh users list via Ajax.

Categories

Resources