Making accordions with tabs in asp.net using jquery

Question

Im making accordion tabs using jquery in visual studio and the panes don't expand or collapse at the moment. I'm getting this error Uncaught TypeError: Object [object Object] has no method 'tabs' Here is my html

<section id="Popularquestions">
            <h4>Popular Questions</h4>
        <h5 class="current">1.What are the most common camera ports?</h5>
        <div class="pane"><p><a href="Knowledgebase/commonports.aspx">Here</a> is a table of the most common camera ports available</p></div>
        <h5>2.Where can I see a list of vendors and their MAC addresses?</h5>
        <div class="pane"><p></p></div>
        <h5>3.Where can I see a list of makes and models?</h5>
        <div class="pane"><p></p></div>
        <h5>4.Where can I see a list of usernames and passwords?</h5>
        <div class="pane"><p></p></div>
        <h5>5.Where can I see a list of available apps?</h5>
        <div class="pane"><p></p></div>

jquery

<script src="assets/jquery.js"></script>
    <script>
        $("#accordion").tabs(
    "#accordion div.pane",
    { tabs: 'h2', effect: 'slide', initialIndex: null }
  );
    </script>

And css

#accordion {
    background:#333 url(/media/img/gradient/h300.png) 0 0;
    width: 300px;
    border:1px solid #333;
    -background:#666;
    margin: 0 auto;
}

/* accordion header */
#accordion h2 {
    background:#ccc url(/media/img/gradient/h30.png);
    line-height: 14px;
    margin:0;
    padding:5px 15px;
    font-size:14px;
    font-weight:normal;
    border:1px solid #fff;
    border-bottom:1px solid #ddd;
    cursor:pointer;
}

/* currently active header */
#accordion h2.current {
    cursor:default;
    background-color:#fff;
}

/* accordion pane */
#accordion .pane {
    border:1px solid #fff;
    border-width:0 2px;
    display:none;
    height:180px;
    padding:15px;
    color:#fff;
    font-size:12px;
}

/* a title inside pane */
#accordion .pane h3 {
    font-weight:normal;
    margin:0;
    font-size:16px;
    color:#999;
}

intellisense doesn't recognise the .tabs part of the method so am I missing something there? — Ronan
– Ronan, Commented Nov 15, 2013 at 12:25
I just added that it makes no difference apart from css, same error is there — Ronan
– Ronan, Commented Nov 15, 2013 at 12:28
are you using jquery ui tabs? if yes, did you forget to include jqueryui library? — Ravimallya
– Ravimallya, Commented Nov 15, 2013 at 12:31
Head on over to jqueryui.com/accordion and make sure that you click on the view source link to see how the html is structured and the javascript files that are required. — user2417483
– user2417483, Commented Nov 15, 2013 at 12:32

Sandcar · Accepted Answer · 2013-11-16 23:54:51Z

1

try like this:

 <script>
$(function() {

 $("#accordion").tabs(
    "#accordion div.pane",
    { tabs: 'h2', effect: 'slide', initialIndex: null }

});
</script>

answered Nov 16, 2013 at 23:54

Sandcar

8921 gold badge9 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Making accordions with tabs in asp.net using jquery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related