Randomize HTML Table Rows from JavaScript

Discussion in 'Javascript' started by sanju, Jul 1, 2008.

  1. sanju

    sanju Guest

    Dear All,
    I have html table and this table contains 10 Rows and 2 column, I want
    every time this HTML page is called by the user to view the rows
    Randomly.
    How can I do this from JavaScript?

    waiting for reply
    Thank you
     
    sanju, Jul 1, 2008
    #1
    1. Advertisements

  2. sanju

    Evertjan. Guest

    sanju wrote on 01 jul 2008 in comp.lang.javascript:
    you can use the dom when loaded to change the lines

    or document.write when loading the page to write the seperate lines.

    use Math.random().

    No, I am not going to write your code, have a go at it yourself.
     
    Evertjan., Jul 1, 2008
    #2
    1. Advertisements

  3. sanju

    SAM Guest

    sanju a écrit :

    you can make :
    - array of table's rows
    <http://www.howtocreate.co.uk/tutorials/javascript/domtables>
    <http://developer.mozilla.org/en/docs/DOM:table>
    <http://developer.mozilla.org/en/docs/DOM:element.cloneNode>
    - random the array
    <http://javascript.about.com/library/blsort2.htm>
    - exchange each table's row with the array's item of same index
    <http://developer.mozilla.org/en/docs/DOM:element.replaceChild>


    <script type="text/javascript">
    function tableRowsRandom(myTable) {
    var T = document.getElementById(myTable);
    T = T.tBodies[0];
    T = T.rows;
    var n = T.length, R = new Array(n);
    for(var i=0; i<n; i++) R = T.cloneNode(true);
    R.sort(randOrd);
    for(var i=0; i<n; i++) {
    T.parentNode.replaceChild(R,T);
    }
    }
    function randOrd(){ return (Math.round(Math.random())-0.5); }
    </script>

    demo : <http://cjoint.com/?hbkQ1POY0W>
     
    SAM, Jul 1, 2008
    #3
  4. Quick hack:

    /**
    * @return A pseudo-random IEEE-754 double in the interval
    * <tt>[0, 1)</tt>.
    * @type number
    */
    function prng()
    {
    var r = Math.random();

    // Opera bug workaround
    if (r == 1) r = 0;

    return r;
    }

    /**
    * Returns a pseudo-random integer value in the interval
    * <tt>[0, top)</tt>, or in the interval <tt>[bottom, top)</tt>
    * if <code>bottom</code> was provided.
    *
    * @param top : number
    * @param bottom : optional number
    * @return pseudo-random integer value in the specified interval
    * @type number
    */
    function prng_int(top, bottom)
    {
    if (!bottom) bottom = 0;
    return Math.floor(prng() * (top - bottom)) + bottom;
    }

    /**
    * Sorts the rows of the first table body of the document randomly.
    */
    function bodyLoad()
    {
    // get table object reference
    var t = ...
    if (t)
    {
    // get table body object reference
    var tbody = (t.tBodies || [])[0];
    if (tbody)
    {
    for (var rows = tbody.rows, len = rows.length, i = len; i--;)
    {
    tbody.insertBefore(rows, rows[prng_int(len)]);
    }
    }
    }
    }

    Usenet is not a right. We[tm] deal with your problem because it looks
    interesting enough to spend our[tm] time with, not because the solution
    is urgent for you. The more demanding you are, the less interesting it
    becomes for us[tm].

    <http://catb.org/~esr/faqs/smart-questions.html>


    PointedEars
     
    Thomas 'PointedEars' Lahn, Jul 1, 2008
    #4
  5. sanju

    sanju Guest




    Thanks Thomas,
    u r awesome man...
    God bless you
     
    sanju, Jul 1, 2008
    #5
  6. sanju

    sanju Guest



    Thanks Thomas,
    u r awesome man...
    God bless you
     
    sanju, Jul 1, 2008
    #6
  7. sanju

    Jorge Guest



    Hmmm, this code shuffles the rows in just 4 lines :

    var tbody= (document.getElementById('myTable')).tBodies[0],
    rows= tbody.rows, i;
    for (i= rows.length; i; i--) {
    tbody.appendChild(rows[Math.floor((i)*Math.random())]);
    }

    And runs ~10% faster : http://tinyurl.com/56g37t

    20.49/100 ms (SAM)
    9.97/100 ms (Thomas)
    9.09/100 ms (Jorge)

    --Jorge.
     
    Jorge, Jul 1, 2008
    #7
  8. In comp.lang.javascript message <4869ee29$0$876$>
    , Tue, 1 Jul 2008 10:43:20, SAM <
    lid> posted:
    Your randOrd does not fulfil the expectations for a Sort function.
    There is therefore no guarantee of what your code will do, or how long
    it will take. A good random-dealing function is not significantly
    longer, and can be found via FAQ 4.22.
     
    Dr J R Stockton, Jul 1, 2008
    #8
  9. In comp.lang.javascript message <>, Tue,
    LRN has reported, near five years ago, the bug to be extinct by Opera
    6.05; and ISTM that users of non-MS browsers are very likely to upgrade
    from time to time. And the bug only appeared rarely.

    You could just as well use if (r >= 1) r = 0; just in case a number
    exceeding 1.0 ever appears, in any system. Or you could, more briefly,
    use Math.random()%1 . Evidently, although you expect others to make
    full use of the FAQ, you do not do so yourself. KETFOB.
     
    Dr J R Stockton, Jul 1, 2008
    #9
  10. sanju

    SAM Guest

    Jorge a écrit :
    Ha Yes ... not so good :-(
    this one when I tried it re-display the original ordered table with a
    step of 4
    Bon sang ! Mais bien sûr !
    the famous appendChild that doesn't only add an element but can also move it

    Does this also return to the initial position every 4 times?
     
    SAM, Jul 2, 2008
    #10
  11. sanju

    Jorge Guest

    __Hopefully__ no : http://tinyurl.com/68hscr

    --Jorge.
     
    Jorge, Jul 2, 2008
    #11


  12. Obviously your different solution is not equivalent to mine, so these
    benchmark results are void for comparing appendChild() and insertBefore().
    What happens if you do the same feature-testing, lose extra parentheses,
    and implement the same Opera PRNG fix?


    PointedEars
     
    Thomas 'PointedEars' Lahn, Jul 2, 2008
    #12
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.