title: Dynamic Bootstrap Accordian loads in show
body: <p>I have a bootstrap accordion that is generated dynamically from code behind. It is loaded during page_init. Everything works except they are all set to open ('show') not closed ('hide').</p>
  
  <p>If I take the generated markup and run it, it works fine so the html is OK. Any ideas?</p>
  
  <p>Thanks</p>
  
  <p>============== EDIT ============</p>
  
  <p>This script resolves the problem</p>
  
  <pre><code>Private Sub SectionClose()
      Try
          Dim SB As New StringBuilder
          SB.Append("$(document).ready(function(){")
          SB.Append(" $('#accordion').accordion({ collapsible: true, active: false }); ")
          SB.Append("$('.selector').accordion(); ")
          SB.Append("}); ")
          ScriptManager.RegisterStartupScript(Me, Me.GetType(), "ShowCollapse", SB.ToString, True)
      Catch ex As Exception
          Dim vError As New SendError
          vError.MailError("214", PageName, ex)
      End Try
  End Sub
  </code></pre>
  
  <p>and it now works perfectly, but throws a Object doesn't support property or method 'accordion'</p>
  
  <p>This is what the generated markup looks like</p>
  
  <pre><code> &lt;div class="panel panel-default"&gt;
      &lt;div class="panel-heading"&gt;Current Board Members&lt;/div&gt;
      &lt;!-- Start of Dynamic elements --&gt;
      &lt;div id="MainContent_ContactBoardMembers" class="panel-body"&gt;
  
          &lt;div class="panel-group" id="accordion"&gt;
              &lt;div class="panel panel-default"&gt;
                  &lt;div class="panel-heading"&gt;
                      &lt;h4 class="panel-title"&gt;&lt;a data-toggle="collapse" data-parent="#accordion" href="#collapse_1"&gt;John Doe - Treasurer&lt;/a&gt;&lt;/h4&gt;
                  &lt;/div&gt;
                  &lt;div id="collapse_1" class="panel-collapse collapse"&gt;
                      &lt;div class="panel-body"&gt;&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="panel-heading"&gt;
                      &lt;h4 class="panel-title"&gt;&lt;a data-toggle="collapse" data-parent="#accordion" href="#collapse_2"&gt;John Smith - President&lt;/a&gt;&lt;/h4&gt;
                  &lt;/div&gt;
                  &lt;div id="collapse_2" class="panel-collapse collapse"&gt;
                      &lt;div class="panel-body"&gt;&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="panel-heading"&gt;
                      &lt;h4 class="panel-title"&gt;&lt;a data-toggle="collapse" data-parent="#accordion" href="#collapse_3"&gt;Bill Mathews - Director at large&lt;/a&gt;&lt;/h4&gt;
                  &lt;/div&gt;
                  &lt;div id="collapse_3" class="panel-collapse collapse"&gt;
                      &lt;div class="panel-body"&gt;&lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;!-- End of Dynamic elements --&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Edit - added to show how to create accordion from code behind</p>
  
  <pre><code> Dim i As Integer = 0
              For Each Row As DataRow In DT.Rows
                  i = Row("Member_ID")
                  Dim MemberName As String = ""
                  MemberName += vFunction.ReturnText(Row("First_Name"))
                  MemberName += " " &amp; vFunction.ReturnText(Row("Surname"))
                  MemberName += " - " &amp; vFunction.ReturnText(Row("Position"))
                  Dim PanelHeading As New HtmlGenericControl("div")
                  With PanelHeading
                      .Attributes.Add("class", "panel-heading")
                  End With
                  Dim H4 As New HtmlGenericControl("h4")
                  With H4
                      .Attributes.Add("class", "panel-title")
                  End With
                  PanelHeading.Controls.Add(H4)
                  Dim aData As New HtmlGenericControl("a")
                  With aData
                      .Attributes.Add("class", "accordion-toggle collapsed")
                      .Attributes.Add("data-toggle", "collapse")
                      .Attributes.Add("data-parent", "#accordion")
                      .Attributes.Add("href", "#collapse_" &amp; i)
                      ' .Attributes.Add("data-target", "#collapse_" &amp; i)
                      .InnerHtml = MemberName
                  End With
  
  
                  H4.Controls.Add(aData)
  </code></pre>