Accessing Instance variables of javascript objects

Question

<!doctype html>
<html>
<head>
  <title>jQuery Tagit Demo Page (HTML)</title>
  <script src="demo/js/jquery.1.7.2.min.js"></script>
  <script src="demo/js/jquery-ui.1.8.20.min.js"></script>
  <script src="js/tagit.js"></script>

  <link href="demo/css/demo.css" rel="stylesheet" type="text/css"/>
  <link rel="stylesheet" type="text/css" href="css/tagit-stylish-yellow.css">

  <script>


    $(document).ready(function () {


    var list = new Array();
     var availableTags = [];

     $('#demo2').tagit({tagSource:availableTags});


     $('#demo2GetTags').click(function () {
        showTags($('#demo2').tagit('tags'))
      });

     /*
    $('li[data-value]').each(function(){
        alert($(this).data("value"));
    });*/

    function showTags(tags) {

        var list = new Array();
        console.log(tags);
        var string;
        for (var i in tags)
          string +=    new String(tags[i].value)

            console.log(string);
        }


    });
  </script>
</head>
<body>

<div id="wrap">

<div class="box">
  <div class="note">
    You can manually specify tags in your markup by adding <em>list items</em> to the unordered list!
  </div>

    <ul id="demo2" data-name="demo2">
        <li data-value="here">here</li>
        <li data-value="are">are</li>
        <li data-value="some...">some</li>
        <!-- notice that this tag is setting a different value :) -->
        <li data-value="initial">initial</li>
        <li data-value="tags">tags</li>
    </ul>

  <div class="buttons">
    <button id="demo2GetTags" value="Get Tags">Get Tags</button>
    <button id="demo2ResetTags" value="Reset Tags">Reset Tags</button>
    <button id="view-tags">View Tags on the console </button>
  </div>
</div>

</div>
<script>
</script>
</body>
</html>

my problem with this code is that this function

function showTags(tags) {

            var list = new Array();
            console.log(tags);
            var string;
            for (var i in tags)
              string +=  tags[i].value;
                console.log(string);
            }
        });

if I did that i returns to me an "undefined" and then after that some values of the list items. but if I changed that function to this one

function showTags(tags) {

        var list = new Array();
        console.log(tags);

        for (var i in tags)
          string +=  tags[i].value;

            console.log(string);
        }


    });

it only returns me the word "tags" why is it like that?

Consider building a reproducible demonstration at jsfiddle.net or jsbin.com — lanzz
– lanzz, Commented Aug 1, 2012 at 14:20

gilly3 · Accepted Answer · 2012-08-01 14:23:13Z

3

you need to initialize string. The += operator appends a value, but since string has no value there's nothing to append to.

var string = "";

answered Aug 1, 2012 at 14:23

gilly3

92.6k26 gold badges148 silver badges179 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

marteljn · Accepted Answer · 2012-08-01 14:27:16Z

1

You are missing a bracket after your for loop so the console.log statement is not getting called for each iteration.

answered Aug 1, 2012 at 14:27

marteljn

6,5263 gold badges32 silver badges44 bronze badges

Collectives™ on Stack Overflow

Accessing Instance variables of javascript objects

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related