JavaScript - display keys and values of an array -


i'm playing module object , trying create sort of blog (it's not going used in real life - me learning stuff). when user fills form , provides tag, checks whether tag exists in associative array, if not, adds value = 1. if tag exists, adds +1 value. want display on side how many entries each tag there are, eg:

cooking(3) sport(1)

it seems partially work when add tag, displays in keeps increasing count of categories/tags:

cooking(1) sport(1)

then

cooking(2) sport(2)

...not 1 user has added.

var myarticles = (function () {     var s, articles;      return {          settings: {             articlelist: "articles", // div generated articles             articleclass: "article", // class of article             articleindex: 0,             sidebar: document.getelementbyid("sidebar"),             taglist: {},             // cats: object.keys(this.settings.taglist)         },          init: function() {             // kick things off             s = this.settings;             articles = document.getelementbyid(this.settings.articlelist);         this.createarticle();         },          createarticle: function() {             var div = document.createelement("div");         var gettag = document.getelementbyid("tag").value;         var gettitle = document.getelementbyid("title").value;          // add classes         div.classlist.add(this.settings.articleclass, gettag);          // add title / content         var title = document.createelement("h2");         var textnode = document.createtextnode(gettitle);         title.appendchild(textnode);         div.appendchild(title);          // add category         div.innerhtml += "article" + this.settings.articleindex;             articles.appendchild(div);             this.settings.articleindex +=1;         this.updatecategories(gettag);         },      updatecategories: function(tag) {          // create header         this.settings.sidebar.innerhtml = "<h3>categories</h3>";          // create keys , count them         if (tag in this.settings.taglist) {         this.settings.taglist[tag] += 1;         } else {         this.settings.taglist[tag] = 1;         }          var cats = object.keys(this.settings.taglist);          // create unordered list, assign class , append div="sidebar"         var ul = document.createelement('ul');         ul.classlist.add("ul-bare");         this.settings.sidebar.appendchild(ul);          // iterate on array , append each element li         (var i=0; i<cats.length; i++){         var li=document.createelement('li');         ul.appendchild(li);         li.innerhtml=cats[i] + "(" + this.settings.taglist[tag] + ")";         }     }     }; }()); 

and html:

 <body>     <div id="container">     <h1>my articles</h1>     <div id="genarticle" class="left">       <form id="addart" method="post">     <div>           <label for="title">title</label>           <input type="text" id="title" class="forma" placeholder="title" required />     </div>     <div>           <label for="tag">tag</label>           <input type="text" id="tag" class="forma" placeholder="tag" required />     </div>     <div>           <label for="art">article</label>           <textarea id="art" class="forma" required /></textarea>     </div>     <input type="button" onclick="myarticles.init()" value="add art">     <input type="reset" value="reset form">     <input type="range" size="2" name="satisfaction" min="1" max="5" value="3">       </form>       <div id="articles"></div>      </div> <!-- end of genarticle -->     <aside id="sidebar" class="right">     </aside>     </div> <!-- end of container -->      <script src="js/script.js"></script>   </body> 

i think line wrong

li.innerhtml=cats[i] + "(" + this.settings.taglist[tag] + ")";

it this.settings.taglist[cats[i]]

not this.settings.taglist[tag]


Comments

Popular posts from this blog

authentication - Mongodb revoke acccess to connect test database -

r - Update two sets of radiobuttons reactively - shiny -

ios - Realm over CoreData should I use NSFetchedResultController or a Dictionary? -