Comparing Arrays

[thesprucegoose]

Hello,

I'm trying to compare an array to a variable and see if it has the same value then output the second part of the array:

<script language="javascript">

var photoCaptionID0 = "13006";
var photoCaptionID1 = "24018";
var photoCaptionID2 = "13002";
var photoCaptionID3 = "24065";
var photoCaptionID4 = "24021";
var photoCaptionID5 = "24005";

var captionID = new Array();
captionID[0] = "13006, Item 1";
captionID[1] = "24018, Item 2";
captionID[2] = "13002, Item 3";
captionID[3] = "24065, Item 4";
captionID[4] = "24021, Item 5";
captionID[5] = "24005, Item 6";



for(var i = 0; i < captionID.length; i++){
	if (captionID[i][0] == photoCaptionID0){
		break;
		document.getElementById("photoCaptionID0").innerHTML = captionID[i][1];
		
	}
}

</script>

So using this example. If any of the first section in the array captionID (24001, 13001, etc) has the same value as photoCaptionID0, then print the second part of captionID (Item 1, Item 2, etc).

Thanks much!

--thesprucegoose

[jlizarraga]

I think this might be what you want (no loop here):

if (captionID[0] == photoCaptionID0){ // If the first entry om captionID is the same as photoCaptionID0...
	// ...then get the element with id photoCaptionID0 ("13006"), and set its innerHTML to the value of captionID's second entry.
	document.getElementById(photoCaptionID0).innerHTML = captionID[1];
}

[codeexploiter]

Try the following code. The changes I've made are highlighted.

<script type="text/javascript">
            var photoCaptionID0 = "13006";
            var photoCaptionID1 = "24018";
            var photoCaptionID2 = "13002";
            var photoCaptionID3 = "24065";
            var photoCaptionID4 = "24021";
            var photoCaptionID5 = "24005";
            
            var captionID = new Array();
            captionID[0] = ["13006", "Item 1"];
            captionID[1] = ["24018", "Item 2"];
            captionID[2] = ["13002", "Item 3"];
            captionID[3] = ["24065", "Item 4"];
            captionID[4] = ["24021", "Item 5"];
            captionID[5] = ["24005", "Item 6"];
			
			for(var i = 0; i < captionID.length; i++){
				if (captionID[i][0] == photoCaptionID0){
					document.getElementById("photoCaptionID0").innerHTML = captionID[i][1];					
					break;		
				}
			}

        </script>

[Twey]

The 'correct' way to do what you're doing is something like:

<script type="text/javascript">

  String.prototype.startsWith = function(s) {
      return this.indexOf(s) === 0;
  };

  var photoCaptionIDs = ["13006",
                         "24018",
                         "13002",
                         "24065",
                         "24021",
                         "24005"],
      captionIDs    = ["13006, Item 1",
                       "24018, Item 2",
                       "13002, Item 3",
                       "24065, Item 4",
                       "24021, Item 5",
                       "24005, Item 6"];

  for (var i = 0; i < captionIDs.length; ++i)
      if (captionIDs[i].startsWith(photoCaptionIDs[i]))
          document.getElementById("photoCaptionID" + i).innerHTML = captionIDs[i];

</script>

However, this is still a terrible way to do it: parallel arrays are horrible to work with, and innerHTML is non-standard and should be avoided where possible (and it's overkill here, anyway, since there is no HTML). What you really want to be doing is something like this:

<script type="text/javascript">

  Array.map = function(f, a) {
      for (var i = a.length - 1, r = []; i >= 0; --i)
          r[i] = f(a[i], i);

      return r;
  };

  String.prototype.startsWith = function(s) {
      return this.indexOf(s) === 0;
  };

  var Dom = function() {
      function clear(el) {
          while (el.hasChildNodes())
              el.removeChild(el.firstChild);

          return el;
      }

      function setText(el, text) {
          return clear(el).appendChild(document.createTextNode(text)).parentNode;
      }

      return {
          clear: clear,
          setText: setText
      };
  }();

  var photoCaptions = [
      ["13006", "Item 1"],
      ["24018", "Item 2"],
      ["13002", "Item 3"],
      ["24065", "Item 4"],
      ["24021", "Item 5"],
      ["24005", "Item 6"]
  ];

  Array.map(function(v, k) {
      Dom.setText(document.getElementById("photoCaptionID" + k), v[0] + ", " + v[1]);
  }, photoCaptions);
  
</script>