Array Issue 2nd Part.

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • eft0
    #1

    Array Issue 2nd Part.

    Thanks to all who answer my preview post.

    Now I'll try to describe what I'm doing and what doesn't work.

    I'm doing a code to move objects (images) in a specified user order,
    through arrow up and down symbols. When the user clicks on this symbol,
    the clicked object (in the array) change the position for the clicked
    element +1 / -1 (up, down), and the old element take the position of the
    clicked.

    I need the image name, the present position, and the image ID. I have
    this array.

    var Thumbnails = new Array();
    Thumbnails[0] = new Array('1','sexy 2.jpg','Sexy',' 3');
    Thumbnails[1] = new Array('2','blue-sun-m.jpg','New Test','4');
    Thumbnails[2] = new Array('3','list ing_34.jpg','Ho me View','1');
    Thumbnails[3] = new Array('4','fire fox_eats_ie.jpg ','Firefox','2' );

    The first element is the order position.
    The second is the image name.
    The third is a Title for the image.
    And the last one, is the image ID.

    I have a function to move this elements, when the user clicks one,
    everything works fine, excepts the following code.

    // cnt : is the ID of the image the user clicked.
    var Order1 = Thumbnails[cnt][0];
    var Order2 = Thumbnails[new_cnt][0];
    ..
    ..
    ..
    /*
    this work, but when I try to move the element again, it shows the
    original order number (first element on the array), but should say the
    old element (cnt) +1 / -1. But it doesn't work...
    */

    Thumbnails[cnt][0] = Order2;
    Thumbnails[new_cnt][0] = Order1;

    I think... I need to reload the browser, to put the new values in the
    array, but I don't want to refresh the Window. It's like the changes I
    make are stored in memory but, when I try to query them I receive the
    original values.

    I would greatly apprciate any help understanding what is happening.

    -- eft0.
    Tags: None
    • Paul R
      #2
      Re: Array Issue 2nd Part.

      I can't see anything wrong! If you can't put your real page in public,
      then try to use this test case to explain what the problem is:

      <html><head><ti tle>test page</title>
      <script>
      function go()
      {
      var cnt = 0, new_cnt = 1;
      var Thumbnails = new Array();
      Thumbnails[0] = new Array('1','sexy 2.jpg','Sexy',' 3');
      Thumbnails[1] = new Array('2','blue-sun-m.jpg','New Test','4');
      Thumbnails[2] = new Array('3','list ing_34.jpg','Ho me View','1');
      Thumbnails[3] = new Array('4','fire fox_eats_ie.jpg ','Firefox','2' );

      // original order:
      var Order1 = Thumbnails[cnt][0];
      var Order2 = Thumbnails[new_cnt][0];

      for(var i = 0; i < 4; i++)
      document.getEle mentById("div1" ).innerHTML += "<p>" +
      Thumbnails[i].toString() + "</p>";

      // swapped order:
      Thumbnails[cnt][0] = Order2;
      Thumbnails[new_cnt][0] = Order1;

      for(i = 0; i < 4; i++)
      document.getEle mentById("div2" ).innerHTML += "<p>" +
      Thumbnails[i].toString() + "</p>";

      }
      </script>
      <style>body { font-family: monospace; }</style>
      </head>
      <body onload="go()">
      <div id="div1"></div>
      <hr/>
      <div id="div2"></div>
      </body></html>

        Comment

        • eric
          #3
          Re: Array Issue 2nd Part.

          Are you trying to do something like this:
          <script>
          link1=0
          link2=1
          link3=2

          myarray= new Array();
          myarray[0]=new Array(1,"first" );
          myarray[1]=new Array(2,"second ");
          myarray[2]=new Array(3,"third" );

          tempswap1=new Array();
          tempswap2=new Array();
          tempswap3=new Array();

          function swap(direction) {

          tempswap1=myarr ay[0];
          tempswap2=myarr ay[1];
          tempswap3=myarr ay[2];
          if (direction=="do wn"){

          myarray[0]=tempswap3;
          myarray[1]=tempswap1;
          myarray[2]=tempswap2;
          }
          else if (direction=="up ")
          {

          myarray[0]=tempswap2;
          myarray[1]=tempswap3;
          myarray[2]=tempswap1;
          }


          newHtml="<a href=\"javascri pt:alert('" + myarray[0][0] + "')\">" +
          myarray[0][1] + "</a><br>"
          newHtml+="<a href=\"javascri pt:alert('" + myarray[1][0] + "')\">" +
          myarray[1][1] + "</a><br>"
          newHtml+="<a href=\"javascri pt:alert('" + myarray[2][0] + "')\">" +
          myarray[2][1] + "</a>"
          document.getEle mentById("myhtm l").innerHTML=n ewHtml
          }
          myarray= new Array();
          myarray[0]=new Array(1,"first" );
          myarray[1]=new Array(2,"second ");
          myarray[2]=new Array(3,"third" );
          </script>

          <div id="myhtml">
          <a href="javascrip t:alert('first' )" >first</a><br>
          <a href="javascrip t:alert('second ')">second</a><br>
          <a href="javascrip t:alert('third' )">third</a>
          </div>
          <br>
          <a href="javascrip t:swap('up')" >up</a> 0r <a
          href="javascrip t:swap('down')" >down</a>

            Comment

            • eft0
              #4
              Re: Array Issue 2nd Part.

              Here you can view what I'm trying to say.

              I put some JS alerts to see the order don't change. Please take a look.

              http://www.streetball.cl/JS/ChangeOrder.php?id=1


              Thanks a lot.

              -- eft0.


              Paul R wrote:[color=blue]
              > I can't see anything wrong! If you can't put your real page in public,
              > then try to use this test case to explain what the problem is:
              >
              > <html><head><ti tle>test page</title>
              > <script>
              > function go()
              > {
              > var cnt = 0, new_cnt = 1;
              > var Thumbnails = new Array();
              > Thumbnails[0] = new Array('1','sexy 2.jpg','Sexy',' 3');
              > Thumbnails[1] = new Array('2','blue-sun-m.jpg','New Test','4');
              > Thumbnails[2] = new Array('3','list ing_34.jpg','Ho me View','1');
              > Thumbnails[3] = new Array('4','fire fox_eats_ie.jpg ','Firefox','2' );
              >
              > // original order:
              > var Order1 = Thumbnails[cnt][0];
              > var Order2 = Thumbnails[new_cnt][0];
              >
              > for(var i = 0; i < 4; i++)
              > document.getEle mentById("div1" ).innerHTML += "<p>" +
              > Thumbnails[i].toString() + "</p>";
              >
              > // swapped order:
              > Thumbnails[cnt][0] = Order2;
              > Thumbnails[new_cnt][0] = Order1;
              >
              > for(i = 0; i < 4; i++)
              > document.getEle mentById("div2" ).innerHTML += "<p>" +
              > Thumbnails[i].toString() + "</p>";
              >
              > }
              > </script>
              > <style>body { font-family: monospace; }</style>
              > </head>
              > <body onload="go()">
              > <div id="div1"></div>
              > <hr/>
              > <div id="div2"></div>
              > </body></html>[/color]

                Comment

                • eric
                  #5
                  Re: Array Issue 2nd Part.

                  Hi,

                  I think your problem may be in the form with which you are submitting
                  data to your server. You have only one value being sent and it is a
                  number. It seems to me you may need a value for each item --that is
                  you have three items so you need three values. The items on the page
                  move correctly.

                    Comment

                    • eric
                      #6
                      Re: Array Issue 2nd Part.

                      Hi,

                      I think your problem may be in the form with which you are submitting
                      data to your server. You have only one value being sent and it is a
                      number. It seems to me you may need a value for each item --that is
                      you have three items so you need three values. The items on the page
                      move correctly.

                        Comment

                        • Paul R
                          #7
                          Re: Array Issue 2nd Part.

                          I could look at that for a long time without ever fully understanding
                          what's happening - arrays were never supposed to be THAT complicated!
                          You've also got a bunch of images that have names as well as ids, which
                          can't help!

                          You need to simplify, along the lines suggested by an earlier reply,
                          using an array of objects.

                          The following version of move() takes two parameters:
                          - which: the "slot" that has to move (0, 1 or 2), and
                          - where: whether it must go up (-1) or down (1)
                          It just updates the index property of two objects, without swapping any
                          array elements.

                          Clear up the image name/id problem and insert the following code,
                          calling it using, for example:
                          <img src="images/UPPos.gif" onclick="move(2 , -1);" ...>


                          var Thumbnails = new Array();

                          function imageAndText(po sition, imgURL, titleText)
                          {
                          this.index = position;
                          this.img = imgURL;
                          this.title = titleText;
                          }

                          Thumbnails[0] = new imageAndText(0, 'Thumbnail/BackYard.jpg', 'one');
                          Thumbnails[1] = new imageAndText(1,
                          'Thumbnail/viva_firefox_ea ts_ie.jpg', 'FF');
                          Thumbnails[2] = new imageAndText(2, 'Thumbnail/sexy2.jpg', 'Sexy');

                          function move(which, where)
                          {
                          var goingto = which + where;
                          var sourceObj, destObj;

                          if(goingto < 0 || goingto > Thumbnails.leng th)
                          return;

                          for(i = 0; i < Thumbnails.leng th; i++)
                          {
                          if(Thumbnails[i].index == which)
                          sourceObj = Thumbnails[i];
                          else if(Thumbnails[i].index == goingto)
                          destObj = Thumbnails[i];
                          }

                          sourceObj.index += where;
                          destObj.index -= where;

                          document.getEle mentById("img_" + which).setAttri bute("src", destObj.img);
                          document.getEle mentById("title _" + which).innerHTM L = destObj.title;

                          document.getEle mentById("img_" + goingto).setAtt ribute("src",
                          sourceObj.img);
                          document.getEle mentById("title _" + goingto).innerH TML = sourceObj.title ;
                          }

                            Comment

                            Previous template Next
                            Working...