ansaurus

Question

Answer 1

+1 A:

I've done the opposite thing in my project - I loaded full select, and then saved it's content with JavaScript and only inserted what I wanted. That way users without JavaScript (or users waiting for JavaScript to load) can use my form.

MBO 2009-12-01 14:27:13

Answer 2

+1 A:

I wouldn't recommend doing it this way, but if you have no other options: you could have the following HTML:

<!-- header above this line -->
<div id="data" style="display:none">
  1; Europe
  2; Latin America

  ------------------

  2, 1, Argentina
  2, 2; Brazil
  2, 3, Chile
  1, 4, France
  1, 5, Spain
  1, 6; Italy
</div>
<!-- footer below this line -->

Then use script like the following to retrieve the information within the data div:

var dataDiv = document.getElementById('data');
var dataText = dataDiv.innerHTML;
// do something to parse dataText....

I think a better way to solve the problem would be to use your server-side language/framework (if you're using one) to inject a JavaScript object into a script element in the <head> of the page as it's being rendered before delivery. This way you don't have to do any funky parsing like with my example above.

JasonWyatt 2009-12-01 14:36:12

Answer 3

A:

I'm curious about the prohibition against just declaring a JS variable, but an alternative would be to build a JSON string on the server side and stick it into, say, the value attribute of a hidden form field:

<input type="hidden" id="some-id" value="{ abc: 123, ... }" />

and then...

<script type="text/javascript">
  // assuming you have some kind of JSON parser available
  var values = JSON.eval(document.getElementByID('some-id').value);

  // do something with values
</script>

MBO's solution is viable as well.

Jordan 2009-12-01 14:39:26

Answer 4

A:

I agree with Jordan that JSON is the way to go, but there's a much easier way to use it than an input element with a massive JSON object as it's value: declare the JSON object in script tags:

var continents = {
1 : "Europe",
2 : "Latin America"
};
var countries = {
1 : {
1 : "France",
2 : "Spain"
},
2 : {
1 : "Brazil",
2 : "Argentina"
}
};

I'm not sure that I have the format right, but I think I'm close. To fetch the data, you could simply access the objects:

alert(continents[1]); // Europe
alert(countries[2][1]); // Brazil

Just make sure that the page has loaded before you try to access the data.

Evan Kroske 2009-12-01 14:56:16

I agree entirely, but the OP said, "I do not want to use variables in javascript." I took that to mean that he doesn't want to declare a JS variable by generating it on the server side, as you do in your answer, but it's unclear why he wouldn't want that since, as you point out, it's the most straightforward solution.

Jordan 2009-12-01 15:24:11

ansaurus

tags:

views:

answers:

preloaded data in html

related questions