Struggling with implementing the 'accordion' script from JqueryUI on my asp.net page .aspx.
I'm having trouble finding comprehensive documentation for the accordion in this context, only basic HTML
<p><h3><div> etc...Here's an example of the code on the aspx page:
<%@ Page Language="C#" MasterPageFile="~/Zulcon_ppal.Master" AutoEventWireup="true" CodeBehind="EnvianosTuCurriculum.aspx.cs" Inherits="Grupo_Zulcon.EnvianosTuCurriculum" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
$(function() {
$( "#accordion" ).accordion({
heightStyle: "content"
});
});
</script>
<style type="text/css">
.curriculumContainer
{
width:90%;
color:#646464;
margin:30px auto;
} and then more page specific css... </asp:Content>
However, when I try to use a title within a <div>, nothing seems to be happening:
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div class="fixed-width-wrapper contentContainer">
<div style="padding:20px">
<div style="padding-bottom:5px; border-bottom:solid 1px #cccccc; background-image:url('images/menuzulcon3.png'); height: 59px; width: 953px;" class="titulosGeneral";></div>
<div style="padding-bottom:5px; border-bottom:solid 1px #cccccc" class="titulosGeneral">Bachillerato</div>
<div class="curriculumdivcompleto">
<div id="accordion">
<div class="curriculumLadoRegistroizq">
<div style="margin-top:10px" class="autenticacionTitulo">Location (City, Country)</div>
<div style="margin-top:5px"><asp:TextBox ID="Loc_prim" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
</div>
<div class="curriculumLadoRegistro2">
<div style="margin-top:10px" class="autenticacionTitulo">Institution Name</div>
<div style="margin-top:5px"><asp:TextBox ID="Insti_prim" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
</div>
<div class="curriculumLadoRegistroizq">
<div style="margin-top:10px" class="autenticacionTitulo">Year of Graduation</div>
<div style="margin-top:5px"><asp:TextBox ID="year_prim" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
</div>
<div class="curriculumLadoRegistro2">
<div style="margin-top:10px" class="autenticacionTitulo">Years Completed</div>
<div style="margin-top:5px"><asp:TextBox ID="completed_prim" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
</div>
<div> </div>
<div style="padding-bottom:5px; border-bottom:solid 1px #cccccc" class="titulosGeneral">Higher Education</div>
<div class="curriculumLadoRegistroizq">
<div style="margin-top:10px" class="autenticacionTitulo">Location (City, Country)</div>
<div style="margin-top:5px"><asp:TextBox ID="Loc_sec" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
</div>
<div class="curriculumLadoRegistro2">
<div style="margin-top:10px" class="autenticacionTitulo">Institution Name</div>
<div style="margin-top:5px"><asp:TextBox ID="Name_sec" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
</div>
<div class="curriculumLadoRegistroizq">
<div style="margin-top:10px" class="autenticacionTitulo">Degree Earned</div>
<div style="margin-top:5px"><asp:TextBox ID="degree_sec" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
</div>
<div class="curriculumLadoRegistroizq2">
<div style="margin-top:10px" class="autenticacionTitulo">Year of Graduation</div>
<div style="margin-top:5px"><asp:TextBox ID="year_sec" runat="server" MaxLength="25" ValidationGroup="Curriculum" CssClass="autenticacionTextBoxReducido"></asp:TextBox></div>
</div>
<div class="curriculumLadoRegistroizq3">
<div style="margin-top:10px" class="autenticacionTitulo">Completed Semesters</div>
<div style="margin-top:5px"><asp:TextBox ID="Semester_sec" runat="server" MaxLength="25" ValidationGroup="Curriculum" CssClass="autenticacionTextBoxReducido"></asp:TextBox></div>
</div>
</div>
</div>
<div style="text-align:right; margin-top:20px"><asp:Button ID="Button3" runat="server" ValidationGroup="Curriculum" postbackurl="Envia4.aspx" OnClick="Register" CssClass="my_btn"/></div>
</div>
</div>
</asp:Content>
If anyone has any insight into what may be going wrong, I would greatly appreciate it.
Thank you in advance.