CODEWITHSUNDEEP
javascripthtmlarrayslist
user2444832
user2444832

Reputation: 13

Input data from table of arrays into list

I've got a list and I want to input a data from it by the table of arrays and I don't have idea how . Here is the code and my attempts:

HTML:

<body>

  <div class="top-menu style4"style="margin-top:300px;">
    <ul class="top-menu-main">
      <li>
    <ul class="top-submenu">
      <li><a  class="up_items"style="padding-top:5px;">SEMINARS</a></li>
      <li><a  class="up_items"style="padding-top:5px;">STATUTES</a></li>
      <li><a  class="up_items"style="padding-top:5px;">R&Eacute;SUM&Eacute;</a></li>
      <li><a  class="up_items"style="padding-top:5px;">ADR & PPCs</a></li>
      <li><a class="up_items"style="padding-top:5px;">PREPARATIONS</a></li>
      <li><a  class="up_items"style="padding-top:5px;">MUSINGS</a></li>
      <li><a  class="up_items"style="padding-top:5px;">GLOSSARY</a></li>
      <li><a class="up_items"style="padding-top:5px;">AWARDS</a></li>
    </ul>
        <a style="width:100px;text-align:center;text-align:center;font-family:arial;font-size:0.7em;font-weight:bold;border-top:none;">START</a>
      </li>

    </ul>
  </div>
</body>

I've tried to do something with this script but what i got is a simple list without any slide, css elements and so on which i included in my code ..

JS:

<script type="text/javascript">
function makeMenu() {
  var items = ['Start','Trident','Internet Explorer 4.0','Win 95+','5','5'];
  var str = '<ul><li>';
      str += items.join('</li><li>');
      str += '</li></ul>';
  document.getElementById('jMenu0').innerHTML = str;
}
window.onload = function() { makeMenu(); }


  $(document).ready(function(){
    $("#jMenu").jMenu();
  })
</script>

Upvotes: 0

Views: 108

Answers (2)

jbaylina
jbaylina

Reputation: 4708

There are some mistakes in your code.

Use the same jQuery ready function to load menu. Use .class selector or #id to select the menu. Don't include two times the UL tag.

Here is your code working:

function makeMenu() {
  var items = ['Start','Trident','Internet Explorer 4.0','Win 95+','5','5'];
  var str = '<li>';
      str += items.join('</li><li>');
      str += '</li>';
      $('.top-menu-main').html(str);
}


  $(document).ready(function(){
    makeMenu();
    $(".top-menu-main").menu();
  });

You can check it here:

http://jsbin.com/irasof/1/edit

Upvotes: 1

A4L
A4L

Reputation: 17595

You haven't assigned an id to your unordered list.

the call

$("#jMenu").jMenu();

expects to find an element with the id jMenu.

Try adding that id in your js function

var str = '<ul id\"jMenu\"><li>';

take a look at the docs of that plug-in

And the line

document.getElementById('jMenu0').innerHTML = str;

tries to add the generated HTML inside an element with the id jMenu0. The HTML code you are showing does not contain such an element. You need to add it first, maybe somthing like that will be enough

<div id="jMenu0" />

Upvotes: 1

Related Questions