I am forcing my page to change the url without refreshing the page
var pageurl = "mypage.php?myTerm"+newTerm;
if(pageurl!=window.location){
window.history.pushState({path:pageurl},'',pageurl);
}
which works great to change the url to newTerm as in mypage.php?myTerm=newTerm
but not if I run
$term = $_GET["myTerm"];
I end up with the oldTerm before the url change. The only way the _GET picks up newTerm is if I hit refresh, which puts me at square 1.
The point of using pushState is to update the URL to reflect the current state of the page as modified by JavaScript.
If you just want to go to a new URL, then assign a value (a string containing the URL) to location instead of using pushState.
If you want to use pushState then change whatever it is in the page that you use $term for with JavaScript. Use Ajax to fetch new data from the server if needed.
Related
I am trying to create a function that change to another page depending certain value, I just can't find a way to do it.
Something like this
get the current page www.mypage.com
insert a new route
url = "/reports"
so when the funcion executes the page will redirect to www.mypage.com/reports or anything depending the url
$scope.searchPage = function (url) {
/// page = www.mypage.com + url
};
You can use $location(docs) to do this and your code will look like:
$location.path('/reports');
this will navigate to yourdomain.com/reports.
Another solution would be to use $window(docs) like:
$window.location.href = 'http://www.mypage.com/reports'
I personally use $location service to navigate inside the angularjs application and if you want to redirect to an external page in new tab via javascript you can do something like:
window.open('http://www.mypage.com/reports', '_blank');
To change the URL of a page with JavaScript, you just specify it on document.location.href:
document.location.href = 'http://example.com/new-page';
It is just a string, so you can build it however you want and pass it in.
For Angular, you can use the $window.location.href instead. Just be sure to inject the $window dependency:
$window.location.href = 'http://example.com/new-page';
Using the Angular way will allow a single-page-app to remain single page if it's within your site.
I am trying to transfer a variable from one page using this code:
Edit
to the page login.html, and insert the variable(asdf in this example) to a textbox in the new page.
I have tried this code:
function NameFunction(name) {
document.getElementById("username").value = name;
}
It is not working. I think it doesn't work because thats another page.
If you want to pass parameters to another page you can put them using query string:
Edit
To get parameter on the login.html page you can use jQuery as it described here: Get escaped URL parameter
you can try using localStorage.
In you're onClick method, save the data you want to store in localStorage
localStorage.setItem(key,value);
When the new page loads, in the onLoad (ready function if using jquery) method get the data from localStorage and set it in the textbox
you can find more about localStorage in the following links
Storing Objects in HTML5 localStorage
http://www.w3schools.com/html/html5_webstorage.asp
and many more are available online
I have a mobile application that opens an in-app browser that uses the URL to pass information to my server , like the deviceID.
For example the browser will open the web-page (jquery Mobile) : www.myserver.com/doWork.html#deviceID
On the server part using JavaScript inside the doWork.html file, I get the deviceID like this:
var userId = window.location.hash.substring(1);
Is it ok that i pass information using the hash # ? In jquery mobile the hash # is used to change between pages when someone uses the Multi-Page template structure . So i am afraid that maybe i should use something else , like a question mark (?) ?
Or its perfectly fine ?
NO. Stop using # for your data transfers. Let jQM do its thing. Don't disturb it. Use Query strings( adding ? in url). My advice is to stop using query strings (? tags) and # tags to send data to the next page. Handle it using localStorage. Its more secure compared to Query strings because the user wont see the URL change, so your sensitive data is hidden, at least to a little extent. localStorage is HTML5's API which is like a temporary storage set aside per domain. This data will persist until data is cleared in cache. Assuming you have an anchor tag which goes to dowork.html,
Go to Do work
Add an attribute for device ID in the tag itself, like this :
Go to Do work
You'd be doing this dynamically you might also use it the same way. You get the gist right?
A click event for this would look like this :
$(document).on("click", "a", function(e) //use a class or ID for this instead of just "a"
//prevent default
e.preventDefault();
//get device id from tag attribute
var deviceId = $(this).data("deviceid");
//set it in localStorage
localStorage["dId"] = deviceId;
//redirect
$.mobile.changePage(this.href);
});
Then, in the other page's pageinit (or any event), get the device id from storage and send the ajax call to the server.
//assuming #dowork is the id of a div with data-role="page"
$(document).on("pageinit", "#dowork", function() {
//get from storage
var deviceId = localStorage["dId"];
//make ajax call or server call with deviceId here
});
But, if you still want to use URL for this, look at this question. I've given a decent enough answer over there.
To pass variables to the server you should avoid using the # symbol because regardless of the framework you are using this symbol is used for other purposes, to pass info to the server in a GET request you should use the ? symbol, something like this should do it: www.myserver.com/doWork.html?deviceID=1233455
I want to redirect after a successful ajax request (which I know how to do) but I want to pass along the returned data which will be used to load an iframe on the page I just redirected to.
What's the best way to pass such data along and use it to open and populate an iframe in the page I just redirected to?
EDIT:
I am passing a GET variable but am having to use the following to access it for use in my iframe src attribute:
function $_GET(q,s) {
s = (s) ? s : window.location.search;
var re = new RegExp('&'+q+'=([^&]*)','i');
return (s=s.replace(/^\?/,'&').match(re)) ? s=s[1] : s='';
}
var d = $_GET('thedata');
I assume there isn't really a more straightforward way to access the GET vars?
If it's not too much data, you could pass it as a get parameter in the redirect:
document.location = "/otherpage?somevar=" + urlescape(var)
Remember that urls are limited to 1024 chars, and that special chars must be escaped.
If it is beyond that limit your best move is to use server side sessions. You will use a database on the server to store the necessary information and pass a unique identifier in the url, or as a cookie on the users computer. When the new page loads, it can then pull the information out of the database using the identifier. Sessions are supported in virtually every web framework out of the box.
Another alternative may be to place the data as a hidden attribute in a form which uses the post method (to get around the 1024 char limit), and simulating a submission of the form in javascript to accomplish the redirect, including the data.
I'm exploring my options for modifying urls in the browser bar for bookmarking purposes.
Ideally, I'd like to add querystring parameters and cannot determine if this is even possible. I don't want the page to refresh and want to add querystring values on link clicks, ajax calls, etc.
If I can't add querystring parameters, then I'd like to add hash values (http:://someurl.com#hash-value). How should I go about doing this? Should I use plain JavaScript or a framework (jquery, prototype, etc.) and/or framework plugin.
To modify the hash, you can simply do the following in plain JavaScript:
window.location.hash = 'hash-value';
It will add #hash-value to your URL, or will replace it if it already exists, without refreshing the page.
Then to check if a hash value is present, simply do the following:
if (window.location.hash) {
// Hash is present
// Use window.location.hash as required
}
else {
// No hash was set
}
If you modify the query string, it will refresh. So you should modify window.location.hash.