Donate. I desperately need donations to survive due to my health

Get paid by answering surveys Click here

Click here to donate

Remote/Work from Home jobs

Javascript for loop and data display

on

I have list that pulls json that looks like this:

  1. ID: 2
  2. Main_x0020_button_x0020_a_x0020_: false
  3. Main_x0020_button_x0020_title: "Resistors & capacitors"
  4. Primary_x0020_link: "https://www.google.com/"
  5. Primary_x0020_link_x0020_title: "Google website"
    1. ID: 3
  7. Main_x0020_button_x0020_a_x0020_: false
  8. Main_x0020_button_x0020_title: "Resistors & capacitors"
  9. Primary_x0020_link: "https://www.yahoo.com/"
  10. Primary_x0020_link_x0020_title: "Yahoo website"
    1. ID: 4
  12. Main_x0020_button_x0020_a_x0020_: false
  13. Main_x0020_button_x0020_title: "Resistors & capacitors"
  14. Primary_x0020_link: "https://www.youtube.com/"
  15. Primary_x0020_link_x0020_title: "youtube website"

I wrote this function:

function draw_part(dat){
        dat=dat.results;
            var a = '';
            for(var i=0;i<dat.length;i++){
                a+='<div class="panel-group" id="accordion"><div class="panel panel-default"><div class="panel-heading"><h4 class="panel-title"><a data-toggle="collapse" data-parent="#accordion" href="#section'+dat[i].ID+'">'+dat[i].Main_x0020_button_x0020_title+'</a></h4></div><div id="section'+dat[i].ID+'" class="panel-collapse collapse in"><div class="panel-body"><ul>';
                a+='<li><a href="'+dat[i].Primary_x0020_link+'">'+dat[i].Primary_x0020_link_x0020_title+'</a></li>';                
                a+='</ul></div></div></div>';
            }                       
            $('#pds').empty().append(a);
        }

I want the end result to be one button called Resistors & capacitors that expands to show the 3 primary links. Instead it creates a button for each link. How do I write a for loop for this? I'll keep trying.

Comments

Post a Comment