What's the best way to amend a url via javascript? - javascript

My wordpress site has a search form that is crap.
It produces this search string: www.mysite.com/properties/?wpp_search[sort_order]=DESC&wpp_search[sort_by]=price&wpp_search[pagination]=on&wpp_search[per_page]=10&wpp_search[strict_search]=false&wpp_search[property_type]=residential_sales%2Cresidential_lettings%2Ccommercial%2Cfine_living&wpp_search[area]=&wpp_search[price][min]=&wpp_search[price][max]=&wpp_search[branch]=-1&wpp_search[bedrooms]=-1&wpp_search[department]=-1#propertycontent
What's the best way to grab this string, and change certain aspects eg:
[sort_order]=ASC
[sort_by]=price
Then reload the page displaying the new string and thus changing the form output?

Try this.
url.replace('[sort_order]=DESC','[sort_order]=ASC').replace('[sort_by]=price','[sort_by]=newPrice');

You can get the url's query portion using location.search. Look for the parameter, modify, reconstruct your url and assign that value to location to load the page with that url.

Related

Using # tag in URL to save data from Javascript

I have a site with loads of Javascript, where users input informations, which gets saved in Javascript objects on the site. I also have a working export/import from JSON - once the user fills out the form, he can "Export to JSON", and if he refreshes the page (and the form is cleared), he can "Import from JSON" and the forms get filled.
I want to also save the data into the URL, so the users can simply share the URL, and the forms will get pre-filled based on the URL content.
Closest example I was able to find is these old game calculators - http://classicdb.ch/?talent#Lsoedm0oZVx0f0xoZTMo
The information is encoded in the #Lsoedm0oZVx0f0xoZTMo and then processed and the form is filled.
How does one go about implementing this? Can I use the JSON import which I already have?
Thank you
If you're asking how to make the hash that could be part of the URL. This article might help you: https://developer.mozilla.org/en-US/docs/Web/API/WindowBase64/Base64_encoding_and_decoding
In case you want to modify or receive the hash from URL, René's answer answered that already. :)
Appending the hash to the url should not be the question but receiving and processing, right?
For these javascript provides
location.hash
That way you will get the "Lsoedm0oZVx0f0xoZTMo" and do whatever you have to.

HTML passing string from one page to another

i am developing a mobile application and i need to send a certain string where i can be able to use it in an HTML page and i wanna send it from a previous HTML page ,, what's the simplest way to do so ?. I have two pages index.html
and home.html and i want to send a variable such as number or string from the index page to the home, as i will change the design of the home page upon this variable. is there any idea how can i do it ? Thanks in Advance.
If you a using a server side language, A common approach is to use a query string
For example your URL would look like this:
Home.html?myvariable=myvalue
In PHP the way to access the value of myvariable is to use $_GET['myvariable']

How do I Transfer values from one Javascript file to another JS file without the need of server interaction nor cookies?

I want to transfer a variable value without the need of cookies nor server interaction in JS, is ther any way possible ? for instance if i have foo.js and a variable fooVar = 10, and bar.js and barVar is there any way possible for barVar = fooVar without cookies?
Based on your comments, you could store the variable you want to access in the second page in the query string of the second page, or in the hash of the query string of the second page. Use that query string to load the second page.
e.g. in the query string:
http://example.com/bar.html?myvar=5
or e.g. in the hash of the query string:
http://example.com/bar.html#?myvar=5
Using the hash is likely to be the best option as your server will most likely ignore whatever you put in the hash (unless the server is programmed to do otherwise).
You can then use window.location.hash in the javascript loaded by bar.html to get the hash string and decode it to get your stored variable...
You can use HTML5 localStorage. The localStorage saves your data into the web browser. The difference with $_COOKIE is that data is accessible only via web browser with javascript and they are not sent in every HTTP request. Here is a link with examples.
You say that you want to carry the value of the variable from one page to the next page.
Why do you not use the url?
Add something like ?fooVar=10 to the url of the second page and then parse the url with the second script on the second page.
Here is a example how you can parse the url in the second script
how can i get query string values

Efficient way to pass arrays in url

I am building a webapp and have a few arrays that I would like to pass through the URL in order to make the results of my application easily sharable.
Is there an efficient way to do this? I know a lot of websites (like youtube) use some sort of encoding to make their URLs shorter, would that be an option here?
Thanks in advance!
What I suspect you're asking is you have some page where the user can alter information, etc, and you want a way to create a URL on the fly with that information so it can easily be accessed again. I've listed two approaches here:
Use the query string. On your page you can have a button saying "save" that produces a URL with info about what the user did. For example, if I have a webpage where all I do is put my name in and select a color, I can encode that as http://my-website.com/page?name=John_Doe&color=red. Then, if I visit that link, your page could access the query object in JavaScript and load a page with the name and color field already set.
An approach for the "YouTube-style" URLs would be to create a hash of the relevant information corresponding to the page. For example, if I were creating a service for users to store plaintext files. These files are to have the following attributes: title, date, name, and body. We can create a hash of the string hash_string = someHashFunction(title+date+name).
Of course, this is a very naive hashing scheme, but something like this may be what you are looking for. Following this, your URL would be something like http://my-website.com/hash_string. The key here is not only creating these URLs, but having a means to route requests on the server side to the page corresponding to the hash_string.

Using javascript to create a value in url and submit that value via form?

I have a site that request that they could send out different urls to clients to track what links are being used. I told them to use google analytics but they are requesting to stay away from it.
What they are asking is they want to send a url to there customers such as,
http://www.yoursite.com/?link=Nameoflink
They want to get that cookie and set it.
Then when the contact form is used they want to be able to submit that link name with the form submission to show what links are being used to go directly to there site.
I was told this is possible but i have no knowledge of that custom of javascript or cookie expertise... =/
You can get the value of the params passed in through the url with location.search. To get the value of the param, use the location.search and then find the specific url value, then set that in another hidden text field or something...
if (location.search){
var search = location.search.substr(1).split("&"),
url = search.split("=")[1];
document.getElementById('hiddenInput').value = url;
}
Note- the code above assumes that your search string only contains the URL value & that the URL is first. If not, it is likely this will fail. You can update the code to account for that by checking to make sure that search.split("=")[0]==="url" or expanding it to parse out all of the search params into an object that you can reference by key.
Yeah, google analytics would make this a lot easier, especially if you had a specific page that would serve as a drop-point, telling you how many people click this special link.
Without google analytics, you could get the GET variable values via a PHP or ASP page script and have them set that way, or you can use soley JavaScript to take care of cookie setting and retrieval.
For JavaScript, these links should point you in the right direction:
JavaScript cookies:
(I can only post one link, but check out W3C School's article on JavaScript cookie handling)
Extract GET values via JavaScript:
http://www.go4expert.com/forums/showthread.php?t=2163

Categories

Resources