Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>NEVER, EVER EVER EVER EVER EVER EVER mix data and display. I also think you can easily get around the iterating over n elements to get the data you require. Here is how you do it.</p> <p>Create a model (your data storage) in the javascript.</p> <pre><code>var data = [ { title: "item 1", foo: "bar", baz: 10 }, { title: "item 2", foo: "bazbar", baz: 20 } ]; </code></pre> <p>Then, using Javascript, you could use the above data to create the following table on the left</p> <pre><code>&lt;table&gt; &lt;tr&gt;&lt;td&gt;&lt;a href="#" onclick="showDetails(0);return false;"&gt;item 1&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;&lt;a href="#" onclick="showDetails(1);return false;"&gt;item 2&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt; </code></pre> <p>So then you would have your show details function</p> <pre><code>function showDetails(index){ var currentData = data[index]; /* Do something with data */ } </code></pre> <p>I have created a working example <a href="http://jsfiddle.net/w2EQy/2/" rel="nofollow">here</a>. There is an error in that code that says showDetails is not defined, but that is due to a jsfiddle issue, the code will work if put into a HTML page. ALSO, be sure to use the strict doctype at the top (to avoid cross browser quirsk).</p> <p>Might I also suggest, that you look at <a href="http://developer.yahoo.com/yui/layout/" rel="nofollow">YUI 2's layout manager</a> instead of using a frameset. Framesets require multiple pages with javascript snaked throughout and can be a maintenance nightmare down the road.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload