Collapsible table columns

Basic Example

Table with Collapsible Columns
Collapsible Column 1
Fixed Column 2
Collapsed Column 3
Fixed Column 4
Some long, extended content for column 1
Some content for column 3 that is really long and not needed often.
 
        
<table class="table table-striped table-condensed bse-col-collapse-add " style="width:375px;">
    <thead>
    <tr>
        <th class="title" colspan="4">
            Table with Collapsible Columns
            <button class="btn btn-primary bse-col-collapse-controlAll">
                <span class="bse-col-collapse-controlLabel">Expand all</span>
            </button>
        </th>
    </tr>
    <tr>
        <th class="bse-col-collapse-control">
            <div>Collapsible Column 1</div>
        </th>
        <th title="This Column is fixed">
            <div>Fixed Column 2</div>
        </th>
        <th class="bse-col-collapse-control bse-col-collapse-collapsed">
            <div>Collapsed Column 3</div>
        </th>
        <th title="This Column is fixed">
            <div>Fixed Column 4</div>
        </th>
    </tr>

    </thead>
    <tbody>
    <tr>
        <td>
            <div>Some long, extended content for column 1</div>
        </td>
        <td>
            <input class="numberinput form-control" placehoder="need more space!" type="number">
        </td>
        <td>
            <div>Some content for column 3 that is really long and not needed often.</div>
        </td>
        <td>
            <input class="textinput form-control" placehoder="feeling very cramped!">
        </td>
    </tr>
    </tbody>
</table>