I am displaying a warning dialog box whenever user tries to navigate from current page without saving data on current page. Its working fine now I want to call a function (Spring controller, its kind of java function which handled URL mappings ) when user clicks on Ok (in warning dialog box) and then he should get redirectd to desired page.
Let me try to make it simple (Its confusing for me also):
User is on registration page, he/she made some changes and didn't save it.
Now user clicked on any other link for example he clicked on About Us link.
Now I want to execute my spring controller.
After execution of controller user should get navigated to About Us page.
For this I need to save value of clicked hyperlink and pass it to my spring controller.
So how can I store URL of clicked link (URL of About Us page in above example) ?
PS: I will really appreciate if anybody can edit my question to make it easier to understand.
if you use jQuery, you can attach an event handler to onclick to all links in the page and once clicked the handler should save the href attribute to some variable. then create a onbeforeunload event listener on your window, where you can use the value however you want, call your controller or save the value in a cookie or something.
Are all the links on the page pointing to your spring application? If there are no external links anywhere (pointing to external resource) - then you could write a simple Filter where you can save the requested page into the session.
Otherwise, if there are links to external resources - you would need to rewrite them from www.external.com to www.my.com\MagicController?requestedPage=www.external.com. Controller will save the link and send a redirect in HTTP header to the requested page. This is a common practice - even google does that (check out the google search result links for how it will look like).
Added: Weird, but google does that only on some rare occasions, so you probably won't be able to find an example there.
Don't require to preserve the href of selected tab.Do one thing attach same javascript function with each tab and pass the "this" as parameter of function.
Function of the javascript is
function Attach(ele)
{
// 1. Find the handle of selected tag and store in the variable.
ele=$(ele);
// 2. Find the value of href
var href=ele.attr("href");
// 3. Perform server side operation you want.
// 4. redirect to another page.
window.location=href;
return false;
}
Related
I am trying to capture click events in my existing Java/J2EE intranet application.
The application has been in production and we are trying to add this feature.
In order to accomplish this; we've created a javascript function which sends the required data in the form of Ajax call to server and we've able to capture the required data.
However, in order to implement this, we had to manually add javascript calls via onclick events to places from where we wanted to capture data.
This includes radio , submit , menu clicks ,etc. Is this approach of adding onclick tags to respective controls correct or is there a smarter way to handle this?
We're a bit resistant to use a tool for this considering some compliance directives.
Sample onclick call:
onclick="footprint.trace('CLK_REGISTER_BTN');validateForm();"
<script type="text/javascript">
$(window).click(function(e) {
alert(e.target.id); // gives the element's ID
alert(e.target.className); // gives the elements class(es)
});
</script>
Above code resolved my query. I was able to get all click events on page which are super set of button clicks and hence able to action accordingly.
I am working on a website, where url parameter gets updated based on user action, according to which I update the webpage without refreshing.
Consider the scenario of E-commerce where url changes when user clicks on filters and then updated products gets displayed.
Now the problem is, when user clicks on Browsers's back button the browser goes back to previous url-parameter, but page did not gets changed. I want to change the page also based on url parameter that gets changed after back button clicked.
I have tried this solution:
$($window).on('popstate', function (e) {
// Update the page also
});
The problem with this code is, this gets fired as url changes, means it does not care about if browser back button is clicked, or url is changing using the jQuery. So if I am changing url based on user interaction, the popstate callback will be called and my custom function also. To update the page I am using https requests, so http api gets called two times.
Is there any way to check if only "Back button" is clicked?
I would recommend you to change your design a litle bit and trigger all content updates (the product list in your case) by listening to url changes, not only url changes caused by the back button. So instead of triggering any re-rendering on click events, let these buttons be regular link to the url that represent your content and trigger the functionality from the popstate event.
This is how all MVVM-frameworks like Angular.js, Backbone etc are designed and meant to be used.
By doing this it will also be so much easier for you to maintain the application in the long run.
Good luck!
You can do this with sessionStorage! Below is the relevant part of an answer I always refer to for stuff like this https://stackoverflow.com/a/45408832
sessionStorage is a storage type like localStorage but it only saves your data for the current tab.
Session storage can be used like this.
sessionStorage.setItem('key', 'value'); //saves the value
sessionStorage.getItem('key'); //gets the saved value
performance.navigation.type is the browser is the variable that hold users navigation info.
if(performance.navigation.type == 2){
//User is coming with back button
}
So to put it all together, you can set/update a sessionStorage item as part of the callback of the click event for your filter, then performance.navigation.type to check if they used the back button to load the page and apply the data!
I am creating a website for a clothing brand but am still getting started with my web dev work. I have an index page with several clothing items on it. When a user hovers over the picture of the item then a hover over effect comes into play and a small "View Item" appears over the item. When the user clicks this "View Item" text it opens a new page with that particular page's info.
The part I am struggling with is how I send the parameter to this item page as I will need some way of knowing what item was clicked. Can I write a jQuery function that will fire when the text is clicked and perform a .post() method to the item.php page passing along the item ID ?
So it would be something like
$.(document).ready( function() {
$("#itemText").click( function() {
$.post("item.php", parameters);
});
})
POST isn't the proper protocol for that. Use GET instead.
GET is vary easy to use with HTML links; it is what happens every time you click a link on a website. Say the page is "products." If the user clicked on product 1, than the URL for that page could potentially be "products/?id=1" (or products/1 if you are using mod_rewrite). The "id" variable with a value of "1" will be available to the PHP via $_GET['id']. With that variable, you can retrieve the proper information based on the id.
POST is for forms where users are submitting fields of data or images. http://html.net/tutorials/php/lesson10.php
If you are attempting to build a pure Javascript solution, then that is an entirely different matter. In that situation you would use Hash tags or HTML5 History API to change the URL. When the URL changes, Javascript is notified, and then whatever actions can occur. However, based on the fact that you specifically said "POST" I am assuming you are using a server-side language like PHP.
If you are opening a new page, you should not POST. If you must POST, you should POST then Redirect, although since you are not actually performing an action I recommend just sticking with a GET request. This way the newly opened page can easily be refreshed and shared by the viewer.
The most elegant way is to use rewrite rules or a router on your server so you can communicate which item to display, for example: http://example.com/item/1/
However you can also just use a GET parameter: http://example.com/item/?id=1
If you need to communicate to Javascript that will be executed on a page you can also use a hash: http://example.com/item/#1
There are several options using GET depending on how you display the item information, and what server-side technology you use.
I'm completely new to javascript, and I'm trying to get a script to complete a link with a user input.
I.e. I have a common base url like http://www.mystuff.com/ and I would like to create a form to let the user reach a specific page if he knows the exact url. I need a basic input field where he can write a string (like h5mlf4) that will send him clicking the submit button to http://www.mystuff.com/h5mlf4.
I've found this script on this page which is pretty close to my needs. I've tried to modify it, but I don't know how to do both the actions (add the user's input and launch the link) on the same button with an all-in-one action. I don't want to create the link on the page, I simply need it to be immediately used.
I hope to have been clear, and thanks to everybody will take care of this.
Do
window.location = "http://www.google.com?q=" + userInput;
to "click" that link (i.e. go to that link) for the user.
Doc for window.location >> https://developer.mozilla.org/en-US/docs/DOM/window.location
I have my own website. There is a link on my website which redirect me to the externel website. I want to know how to set value in textbox in that externel website when user click link on my website
Have you tried to save opened window handler?
var openedWindow = window.open(....
Instead of using direct links.
Or maybe pass parameters through url?
you can add parameters on the URL.
just modify the link accordingly, and read the URL parameter on the other site.
(this assumes you don't care the possibility that someone fills the parameters with fake info)
Unless that site has implemented something to let you set that (e.g. if they populate the text field using data from the query string), you can't.
There is no standard mechanism for pre-populating forms via a link to the page containing the form.