www.webdeveloper.com
Results 1 to 3 of 3

Thread: Collapsing buttons in bootstrap problem

  1. #1
    Join Date
    Feb 2014
    Posts
    25

    Collapsing buttons in bootstrap problem

    Hello,

    It looks like you guys have a great forum here, so I decided to join and see if anybody could assist me with something that's been driving me crazy for the past few days.

    I have multiple long-width bootstrap buttons that I would like to be expandable and collapsable upon clicking; but the way I have the code now it will only keep expanding and collapsing the very first tab regardless of which button I hit.

    I have a feeling I need to give each button it's own ID and somehow call that in the bootstrap javascript, but I've been unable to find the solution so far.


    Here is the code for 2 of the buttons (as an example):

    First button:
    Code:
    <!-- SALES AND SOURCING-->
    <div class="bs-example">
        <!-- Trigger Button HTML -->
        <input type="button" class="btn btn-block btn-info btn-lg role="button" value="Sales and Sourcing">
        <!-- Collapsible Element HTML -->
        <div id="toggleDemo">
    
    <table class="table table-bordered table-condensed table-hover">
    <!-- rest of the table code -->
    Second button:
    Code:
    <div class="bs-example">
        <!-- Trigger Button HTML -->
        <input type="button" id="test" class="btn btn-block btn-info btn-lg role="button" value="Logistics">
        <!-- Collapsible Element HTML -->
        <div id="toggleDemo1">
    	
    <table class="table table-bordered table-condensed table-hover">
    <!-- rest of the table code -->

    Javascript:
    Code:
    $(document).ready(function(){
        $(".btn").click(function(){
            $("#toggleDemo").collapse('toggle');
        });
    });

    Currently the problem is that clicking any button just opens/closes the first button, but no others.

    Do I need to duplicate the JS code for each button I want to collapse? How can I make it point to that instead of just all buttons?

  2. #2
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,517
    Your code is JQuery, although JQuery is written in JavaScript, JQuery is a framework, so please ask in the JQuery (frameworks) forum.
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

  3. #3
    Join Date
    Feb 2014
    Posts
    25
    Ok I reposted it there, thank you

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles