jquery accordion populate headings with records

Posted on 2011-10-05
Last Modified: 2012-05-12
hi all please can any one help.

i have this accordion jQuery

i am looking to try and populate the headings with a result from a php query.

the thing is i need to know how to automatically add new headings to the accordion if lots of results are  found by my php database query.

hope i have explained well. thx for any comments.  
Question by:helpchrisplz
    LVL 5

    Expert Comment

    Is the content of the accordion static (hard coded) or dynamic (an AJAX response per se)?
    LVL 1

    Author Comment

    i have a online games league. am letting players create a war / appointment. and on each clan profile this accordion will show the date, name of clans as the heading in the accordion then if the user clicks the heading it will expand and show more information about the league match appointment.

    need to add more headings to the accordion if there are loads of upcoming league wars / appointments booked in.
    LVL 1

    Author Comment

    so depending on the amount of records produced by the while loop i need to count them and have that as the number of headings in the accordion and then populate each heading with each record
    LVL 5

    Accepted Solution

    Ok, i think i got the idea here...

    This is based on the basic functionality demo
    <!DOCTYPE html>
    <html lang="en">
    	<meta charset="utf-8">
    	<title>jQuery UI Accordion - Default functionality</title>
    	<link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
    	<script src="../../jquery-1.6.2.js"></script>
    	<script src="../../ui/jquery.ui.core.js"></script>
    	<script src="../../ui/jquery.ui.widget.js"></script>
    	<script src="../../ui/jquery.ui.accordion.js"></script>
    	<link rel="stylesheet" href="../demos.css">
    	$(function() {
                $( "#accordion" ).accordion();
    <div class="demo">
    <div id="accordion">
            $query = "SELECT heading, content FROM table WHERE 1";
            $result = mysql_query($query);
            while($row = mysql_fetch_object($result)){
    	<h3><a href="#"><?php echo $row->heading;?></a></h3>
    		<?php echo $row->content; ?>
        <?php } ?>
    </div><!-- End demo -->

    Open in new window

    LVL 1

    Author Comment

    ahh looks so simple i understand now. i will test tomorrow as its 3:37 AM here  
    LVL 1

    Author Closing Comment


    Featured Post

    What Security Threats Are You Missing?

    Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

    Join & Write a Comment

    International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
    These days socially coordinated efforts have turned into a critical requirement for enterprises.
    Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
    The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

    729 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    21 Experts available now in Live!

    Get 1:1 Help Now