Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 15 of 15
  1. #1
    DDH
    DDH is offline
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    9
    Thanks
    10
    Thanked 0 Times in 0 Posts

    Need help with JS stack

    Need a bit f help wit JS
    Last edited by DDH; 01-21-2013 at 06:47 PM.

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,211
    Thanks
    80
    Thanked 4,571 Times in 4,535 Posts
    Array.push() is *NOT* a push-down stack.

    It does exactly what you are seeing.

    Basically if you do this:
    Code:
    var ary = [ ];
    ary.push("apple");
    ary.push("banana");
    ary.push("coleslaw");
    you get exactly the same result as if you had done
    Code:
    var ary = [ ];
    ary[0] = "apple";
    ary[1] = "banana";
    ary[2] = "coleslaw";
    which is the same you would get if you did
    Code:
    var ary = ["apple","banana","coleslaw"];
    You can argue that the push( ) method of Array is misnamed. But it's way too late to change it now. It is what it is.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    DDH (01-21-2013)

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,211
    Thanks
    80
    Thanked 4,571 Times in 4,535 Posts
    I should point out that if you use Array.push() and Array.pop() then indeed the array *acts* like a stack. It just isn't in the order you would expect it if you are used to conventional CPU stacks.

    One "trick" you could pull:
    Code:
    function userInput(e)
    {
        var inp = document.getElementById("input");
        if(e.which == 13 && inp.value != "" )
        { 
            backStack.push( inp.value );
            var temp = [];
            temp.concat(backStack).reverse();
            document.getElementById("TextBox1").innerHTML = temp.join("<br/>");
        }
    }
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    DDH (01-21-2013)

  • #4
    DDH
    DDH is offline
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    9
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Thanks! I've tried the "trick" you suggested, but it doesn't seems to work. I will continue to try. Thank you

  • #5
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,133
    Thanks
    38
    Thanked 504 Times in 498 Posts

    Lightbulb

    Quote Originally Posted by DDH View Post
    Thanks! I've tried the "trick" you suggested, but it doesn't seems to work. I will continue to try. Thank you
    I'm not sure what kink of problem you are having without seeing your code,
    but this works and can be modified to show both reversed and non-reverse display.
    Plus I added two new stack commands to demonstrate.

    Code:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8" />
    <title> Untitled </title>
    <script type="text/javascript">
    var backStack = [];
    </script>
    
    <style type="text/css">
     #TextBox1 { height:400px; width:200px;border:1px solid red; }
    </style>
    
    </head>
    <body>
    <input type="text" value="" id="input" onkeyup="userInput(event)">
    <br>Stack Display:<br>
    <div id="TextBox1"></div>
    <button onclick="dropEntry()">Drop</button>
    <button onclick="swapEntry()">Swap</button>
    
    <script type="text/javascript">
    function showStack() {                             // display in LIFO order
      var x = document.getElementById("TextBox1");
      var s = [].concat(backStack);
      x.innerHTML = s.reverse().join('<br/>'); // .reverse() demo
    //  x.innerHTML = s.join('<br/>');         // no .reverse() demo
      document.getElementById('input').focus();
    }
    function userInput(e){
      if (e.which == 13) {
        var info = document.getElementById('input');
        if (info.value > "") {
          backStack.push(info.value);
          info.value = "";
          showStack();
        }
      }
    }
    function dropEntry() {
      if (backStack.length > 0) { backStack.pop(); }  showStack();
    }
    function swapEntry() {
      if (backStack.length > 1) {
        var top0 = backStack.pop();      var top1 = backStack.pop();
        backStack.push(top0);            backStack.push(top1);
      }
      showStack();
    }
    
    </script>
    
    </body>
    </html>

  • Users who have thanked jmrker for this post:

    DDH (01-21-2013)

  • #6
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,211
    Thanks
    80
    Thanked 4,571 Times in 4,535 Posts
    Actually, you don't even need the intermediate temporary variable (temp in my code, s in jmrker's code).

    This works:
    Code:
    <!DOCTYPE html>
    <html>
    <body>
    <body>
    <form onsubmit="return false;">
    <input type="text" value="" id="input" />
    </form>
    <br>Stack Display:<br>
    <div id="TextBox1"></div>
    
    <script type="text/javascript">
    (
      function()
      {
          var backStack = [ ];
          var inp = document.getElementById("input");
          inp.onkeyup = userInput;    
    
          function userInput(e)
          {
              if(e.which == 13 && inp.value != "" )
              { 
                  backStack.push( inp.value );
                  document.getElementById("TextBox1").innerHTML = 
                         [].concat(backStack).reverse().join("<br/>");
                  inp.value = "";
                  inp.focus();
             }
          }
      }
    )();
    </script>
    </body>
    </html>
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    DDH (01-21-2013)

  • #7
    DDH
    DDH is offline
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    9
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Thank you!

  • #8
    Regular Coder
    Join Date
    Jan 2013
    Location
    Germany
    Posts
    578
    Thanks
    4
    Thanked 77 Times in 77 Posts
    You could also use shift/unshift instead of push/pop.

  • Users who have thanked Airblader for this post:

    DDH (01-21-2013)

  • #9
    DDH
    DDH is offline
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    9
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Is there a way to display the popped element from an array into a text box.

  • #10
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,133
    Thanks
    38
    Thanked 504 Times in 498 Posts

    Question

    Quote Originally Posted by DDH View Post
    Is there a way to display the popped element from an array into a text box.

    Which text box? The entry box or a different one?

    Assuming input box and code from post #5:
    Code:
    function dropEntry() {
      if (backStack.length > 0) { var top0 = backStack.pop(); document.getElementById('TextBox1').value = top0; }
      showStack();
    }
    You should try some of the modifications yourself to see how it works for future reference.
    Last edited by jmrker; 01-21-2013 at 03:35 PM.

  • Users who have thanked jmrker for this post:

    DDH (01-21-2013)

  • #11
    DDH
    DDH is offline
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    9
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Now I have a displayed item, but instead of the letters it displays 1,2,3....

  • #12
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,133
    Thanks
    38
    Thanked 504 Times in 498 Posts

    Exclamation

    Quote Originally Posted by DDH View Post
    Now I have a displayed item, but instead of the letters it displays 1,2,3....
    That doesn't make sense.
    Show the code you are testing.

  • Users who have thanked jmrker for this post:

    DDH (01-21-2013)

  • #13
    DDH
    DDH is offline
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    9
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Basically I want to display the items as it pops it , and pushes it from one stack to another.
    Last edited by DDH; 01-21-2013 at 06:52 PM.

  • #14
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,133
    Thanks
    38
    Thanked 504 Times in 498 Posts

    Exclamation

    Quote Originally Posted by DDH View Post
    Sorry, this is the code. Basically I want to display the items as it pops it , and pushes it from one stack to another.

    Code:
    if (backStack.length > 0) { document.getElementById('display').value = forwardStack.push(backStack.pop()); showBackStack(); showForwardStack();}
    Show the WHOLE code. JS and HTML (and any CSS if used)
    Where is the forwardStack coming from???
    Don't make us guess at what your problem is without providing the source.

  • Users who have thanked jmrker for this post:

    DDH (01-21-2013)

  • #15
    DDH
    DDH is offline
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    9
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Okay.
    Last edited by DDH; 01-21-2013 at 06:13 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •