How to pass array of data from one webpage to the other? - javascript

i'm trying to send three arrays of data from one .js file which is used by first webpage to the other .js file which is used by the second webpage.
the data in the first webpage is dynamically built so those three arrays are to be sent to the next webpage.
can anyone suggest some javascript code or tutorial.
please help...............
Thank you Guys. . . . ..

I'd suggest using the JSON data format. JSON is like XML except a lot easier to parse through. Some great examples can be found on Jquery's page:
http://api.jquery.com/jQuery.getJSON/
Everything you need to read the JSON feed can be found on jQuery. If you need to know how to structure a JSON feed you can read about it here:
http://www.json.org/js.html

This is really tough to do with strictly javascript and html. Here are some options:
You could store the array in a hidden form variable and post it to the destination page
If the dataset is small enough (< 4K), then you can store it in a cookie across requests.
If you are only using the most modern browsers (read: HTML5), you can use localstorage
You could encode the data and pass it in the url
In general, though, these are mostly hacks. Usually this kind of work is augmented by some type of server-side processing (perl, php, asp.net, etc) in which you have available some kind of storage across requests (i.e. Session in asp.net).

You could use the Web Storage API, and include a polyfill to port the functionality for older browsers:
http://code.google.com/p/sessionstorage/
https://gist.github.com/350433
Both of these use window.name to provide a session-like state. This may or may not be secure enough for your needs.
From there, you can use the following code for all browsers:
// Store on previous page
sessionStorage.setItem("yourArray", JSON.stringify(yourArray));
// Restore on following page
var yourArray = JSON.parse(sessionStorage.getItem("yourArray"));
EDIT: Older browsers may need the following for the above code sample. This is so the array can be serialized to a string, since sessionStorage only supports string key-value pairs:
https://github.com/douglascrockford/JSON-js

Check out jQuery.data() and friends. Cf.: http://api.jquery.com/category/data/

You may use cookie for that purpose.

Related

How to Replicate XMLHttpRequest For JSON

New to JSON, just trying to get my feet wet.
I know how to do this with XML via javascript, but am trying to learn how to handle JSON objects so I can switch over.
Basically I want to search through all "permalink" tags in the following JSON object and, when I find the right one, save its corresponding "title" and "id" tags to javascript variables:
http://api.soundcloud.com/users/goldenstatewarriors/tracks.json?client_id=02db8e29aa2fb5bf590f478b73137c67
Can this be done with only javascript (no PHP)? The main issue I'm facing is simply grabbing the text from the page and converting it to a json object.
You need to use a JSON parser in order to transform the JSON string into an object you can handle natively in JavaScript. Recent browsers have this functionality built in as JSON.parse(), but obviously this will not work in older browsers (we're talking very old browsers here).
A solution to that problem is to use the JSON parsing library available here. If native browser support is detected, it simply uses that, otherwise it has a JavaScript implementation to achieve the same result. The file you'll need is json2.js - simply include that as you would any other library and away you go!
An example of the code would be:
var dataObject = JSON.parse(jsonData);
As a side note, XMLHttpRequest is somewhat of a misnomer these days. It is simply a mechanism for making HTTP requests and retrieving the data returned, it doesn't have to be XML. It can be plain text, (non X)HTML, JSON, anything. In fact, I don't think I've seen anything in the wild return actual XML data for an XMLHttpRequest in a very long time.

store user input without mysql or php

I have a simple html application which displays words on a click of a next button. It fetches the words from a javascript object literal file. I want to mark some of the words as easy and some as difficult. How do I save this data from browser without using a mysql database?
can I edit the javascript object file directly from bowser?
If you want to take user input and store it permanently on your site, you'll have to employ some sort of server-side scripting. This doesn't have to be PHP, but it's probably the simplest way to do it. You can't use client-side javascript to write to a remote file directly.
If I understand correctly, you have JS object/array with words, you're modifying it and want to store it modified version permanently.
If so, then you can use "HTML5" localStorage.
This storage is per-browser. If you want to have single version shared between many users/browsers, then you will need some server-side support.
To save it on the client-side you could use cookies or local storage on supported browsers but this may not be the best approach if there are many words to keep track of.

Store Javascript variable client side

Not duplicate : I've read many questions like this and it always ended up "use PHP or server-side stuff, and watch out for injection/data manipulation".
I want to store simple stuff on the client side (save and load), like a Google Map location, and want it to stay between refresh of the page.
I don't want to use PHP or any server-side thing.
How can I proceed ?
Thanks
You can use cookies or localStorage.
If html5 is not a problem I would say localstorage is the way to go:
//set value
localStorage.setItem('todoData', this.innerHTML);
//read value
if ( localStorage.getItem('todoData') ) {
edit.innerHTML = localStorage.getItem('todoData');
}
ripped from
http://net.tutsplus.com/tutorials/html-css-techniques/quick-tip-learning-about-html5-local-storage/ :-)
There are multiple options to store data in client side - IndexedDB, localstorage, webSQL, SessionStorage, Cookies, etc.
IndexedDB
Data can be queried efficiently. No limitation in size( but volume or
disk drivers limits the size )
It will store in Key-Object format
It will not be supported in safari browser
Support Queries
Asynchronous
localstorage
It will store value in key-value format (value should be always
String)
Synchronous
Helpful if you need to store a small amount of data
Limited size (Depends on browser)
Session Storage
If the user closes the tab, it will clear the data
You can check YDN-DB here
The key issue you have to keep in mind is you can't trust the client. If it's okay for the client to ask for any location, then it's okay for you to store the location on the client side. But you can't confirm that the value that you get back from the client side is one you have given to that client.
That's what it meant by "data manipulation" [injection is a special type of data manipulation, in that it is manipulated to include things like end quote marks if you're using it as part of a SQL query or other script.]
I highly suggest using localStorage for a few reasons:
It's supported by modern browsers,
INCLUDING IE.
You can store up to 5MB of data (10 in IE) where as a cookie is mere 4KBs
There's lots of libraries to make this easy. One of the most popular is LawnChair: http://westcoastlogic.com/lawnchair/ This will actually write to multiple places, including cookies, so that data isn't lost easily.
Also, as a note, you can't store objects with localStorage, just like you cant with cookies, however you can convert them. For example, if you want to store a Date() don't store it as new Date() store it as: '\'+Date().getTime()+'\'. Same for other objects.
Use Cookie.
How to access via javascript.
How about storing it in a cookie?
For JavaScript I recommend using jQuery, which simplifies a lot of work.
e.g. http://plugins.jquery.com/project/Cookie
Take a look at HTML5 Local Storage

Best Server-Side Data Storage Method for Simple Data

I'm coding a website that involves storing very simple data, just a very long list of names with no additional data, on the server. As this data is so simple, I don't really want to use MySQL (it would be a bit too clunky) so I'm asking what's the best way to store very simple data on the server.
I definitely would favour speed over anything else, and easy access to the data via javascript and AJAX would be very good too as the rest of the site is coded in javascript/jQuery. I don't really care if the data can be viewed freely (as it will be available anyway), as long as it can't be changed by unauthorised users.
There are a lot of things to think about with this.
Is the information the same for all users with just a single set that applies to all users out there? Or is there a separate set of data for each user?
How is the data going to be served to the client, my guess here is that you would be having a web service or otherwise that might return a JSON.
From a security standpoint, do you want someone to be able to just "grab" the data and run?
Personally I find that a database if often a better choice, but otherwise i would use an XML file. Keep in mind though that you have to be careful with loading/reading of XML files to serve web requests to prevent any potential file locking issues.
Use an XML file that is web-accessible. Then you can query the XML file from the browser if need be, and still parse/write it in PHP. You'll want to use the flock function in PHP to make sure that two instances of a page don't try to write to the file at the same time.
Write it to a file and save the data as a serialized object. This way when you read in the data it's instantly accessible as the variable type you need (array, obj, etc). This will be faster than XML parsing.

JSON in location.hash for AJAX(J) bookmarking?

I'm building an AJAJ (AJAX with JSON) webapp with jQuery and I'd like my users to be able to bookmark a page that saves all of their setting selections for a certain part of the app. I've got quite a bit of data that needs to be saved, so I thought JSON might be the best way to save this, putting it into the location.hash.
That being said, what's the best way to get the string of data from the location.hash and convert it back to a JSON object so that it's usable inside the Javascript?
Here's what I'm thinking as far as the JSON object
http://example.com/index.html#json={'s': '2010-02-19', 'array':[1,2,3,4]}
Roland suggested that I drop the json=, successfuly cutting 5 characters out, too. So the complete location would be:
http://example.com/index.html#{'s': '2010-02-19', 'array':[1,2,3,4]}
Example assuming you have JSON support (either native or by including a JSON parse script)
var obj, text = document.location.hash;
if (text){
obj = JSON.parse(text);
}
If the browser does not have native JSON support, you can grab a script from http://www.json.org/js.html or use some framework supported variant (like YUI's http://developer.yahoo.com/yui/json/)
You say 'quite a bit'. Can you be more specific? Bear in mind that you are limited to 2083 characters on your URL.
Personally, I would be reticent to store this sort of stuff in the command line anyway. You'll have pain dealing with URL encoding/decoding, and people can get an Idea of your data structures, and possibly hack the JSON string in the URL.
Have a look at the history plugin, it might be relevant to your needs

Categories