ansaurus

Question

Returning currently displayed index of an array Javascript...

Answer 1

+1 A:

You're making a lot of beginner mistakes in your JavaScript but it seems as if curQuote has the value you want, no?

Tips:
You can declare an array as such: var array = [1,2,3,4,5,6,7];
Terminate statements with a semi-colon.
Use var keyword for local variables.
Don't put braces around one line if statements bodies.
Use indentation properly to make the code readable.

Pierre-Antoine LaFayette 2010-03-12 20:38:12

curQuote does not dynamically update

Jeff Kindred 2010-03-12 20:56:37

It updates every time you call move since you are assigning to it and it is a global variable.

Pierre-Antoine LaFayette 2010-03-12 21:07:17

Answer 2

A:

Try this var curPage = quotations[curQuote];

Artic 2010-03-12 20:40:38

He needs the index not the value here. Additionally `curQuote` is set to `numQuotes` when it wraps around; you'll index out of bounds for that case.

Pierre-Antoine LaFayette 2010-03-12 20:47:42

Answer 3

A:

In your code, curQuote is already the value you want. I rewrote everything to clean it up and show some better logic/syntax. Note that ideally you would be attaching the click handlers via DOM methods and not using inline handlers, but for simplicity I've left it that way here.

Working version viewable here: http://jsbin.com/irihu3/2

<html>
  <head>
    <title>Quotations</title>
    <script type="text/javascript" charset="utf-8">
      var quotations = ["hi", "how", "are", "you", "today", "good", "sir"],
        lastIndex = quotations.length - 1,
        currentIndex = 0;

      function move(xflip) {
        currentIndex = currentIndex + xflip;

        if (currentIndex > lastIndex) {
          currentIndex = 0;
        } else if (currentIndex < 0) {
          currentIndex = lastIndex;
        }

        document.getElementById('quotation').innerHTML = quotations[currentIndex] + " (Quote #" + (currentIndex + 1) + ")";
        return false;
      }
    </script>
  </head>
  <body>
    <div id="quotation">hi (Quote #1)</div>
    <a onclick="move(-1);">Prev</a>
    <a onclick="move(1)">Next</a>
  </body>
</html>

Some things to note:

Always declare variables with the var keyword or you create global variables.
You can combine multiple variable declarations into one statement by separating them with commas. It's good practice to stick to one var statement and to put it at the top of your code/function.
All you really need to keep track of here is the current index of the array, not the quote itself. It's also not important how long the array is, just what the last index is. As such, in my code I am using currentIndex and lastIndex instead of curQuote and numQuotes.
Using return false; at the end of your function will suppress the default action when clicking on a hyperlink (not following the link). This is what you want in this case, because you're using a hyperlink to trigger behavior on the page and not actually navigating to another page.

Jimmy Cuadra 2010-03-12 20:52:57

The code you have supplied here works as intended, however it doesnt provide a solution for my initial question... curQuote does not update dynamically for some reason. Thanks for updating the syntax and logic for me!

Jeff Kindred 2010-03-12 21:09:41

Not sure what you mean by "update dynamically." `currentIndex` in my code will always contain the index of the quote currently being displayed on the page. Because `currentIndex` is defined outside the `move` function, that same variable is always updated by the `move` function whenever you click a link.

Jimmy Cuadra 2010-03-12 21:15:39

When I load the page, it displays '1 of 7' when I click next(calling the move function) it still displays '1 of 7' even though the 2nd index of the array is displayed.

Jeff Kindred 2010-03-12 21:20:20

It works just fine for me. See it in action here: http://jsbin.com/irihu3

Jimmy Cuadra 2010-03-12 21:24:34

You need to update the div that indicates the page number (1 of 7) on every call to move.

Pierre-Antoine LaFayette 2010-03-12 21:25:45

ok... maybe I confused you by using numbers as my array variables this is just until I get it all working, there will be actual quotes as the variables. I want to display a 'counter' for lack of a better word at the bottom of said quotes to display what the number of the current quote is i.e. 4 of 7 etc... does that make sense?

Jeff Kindred 2010-03-12 21:28:48

Updated my code to do that. See the updated JSBin link for an example.

Jimmy Cuadra 2010-03-12 21:41:04

Thank you for your help!

Jeff Kindred 2010-03-12 21:48:53

ansaurus

tags:

views:

answers:

Returning currently displayed index of an array Javascript...

related questions