Paging and search of one datatable appearing on multiple jquery tabs

Paging and search of one datatable appearing on multiple jquery tabs

jcg31jcg31 Posts: 8Questions: 4Answers: 0

I have four jquery tabs, each containing a different datatable. For some reason that I can not identify, the paging and search from the third tab is showing up at the bottom of the first tab (see attached image). This portion of the datatable also appears correctly on the third tab as expected. Any help would be appreciated.

       <div id="tabs-1">
            <ul>
                <li><a id="lys" href="#unprocessedDiv" >Unprocessed</a></li>
                <li><a id="lys3" href="#processedDiv" >Processed</a></li>
                <li><a id="prpscts" href="#getprospects" >Prospects</a></li>
                <li><a id="lys2" href="#Leaderboard" >Leaderboard</a></li>
            </ul>

            <div id="unprocessedDiv">
                <table id="unprocessed" width="500" border="0">
                    <thead id="tblhead">
                        <tr>
                            <th class="dthead" scope="col">Advertiser</th>
                            <th class="dthead" scope="col">Account</th>
                            <th class="dthead"  scope="col">Location</th>
                            <th class="dthead"  scope="col">Rep</th>
                            <th class="dthead"  scope="col">Entered</th>
                            <th class="dthead"  scope="col">Ad No.</th>
                            <th class="dthead"  scope="col">Processed</th>
                        </tr> 
                    </thead>
                    <tbody id="tblbody"></tbody>
                </table>
            </div>

            <div id="processedDiv">
                <table id="processed" width="500" border="0">
                    <thead id="tblhead">
                        <tr>
                            <th class="dthead" scope="col">Advertiser</th>
                            <th class="dthead" scope="col">Account</th>
                            <th class="dthead"  scope="col">Location</th>
                            <th class="dthead"  scope="col">Rep</th>
                            <th class="dthead"  scope="col">Entered</th>
                            <th class="dthead"  scope="col">Ad No.</th>
                            <th class="dthead"  scope="col">Processed</th>
                        </tr> 
                    </thead>
                    <tbody id="tblbody"></tbody>
                </table>
            </div>


            <div id="Prospects" class="hideit">
                <table id="getprospects" width="500" border="0">
                    <thead id="tblhead2">
                        <tr>
                            <th>Rep</th>
                            <th>Prospect</th>
                            <th>Phone</th>
                            <th>SubCategory</th>
                            <th>Rank</th>
                        </tr>
                    </thead>
                    <tbody id="tblbody2"></tbody>
                </table>
            </div>

            <div id="Leaderboard">
                <select name ="leaderboardSelect" class= "forminput11 clearable  c1" id ="leaderboardSelect"  ></select>
                <input type="button" name="getLeader" id="getLeader" value="Get Leader">
                <table id="getleader" width="500" border="0">
                    <thead>
                        <tr>
                            <th width="75px" align="left">Property</th>
                            <th width="75px"  align="left">Sales Rep</th>
                            <th width="75px"  align="left">Sales</th>

                        </tr>
                    </thead>
                    <tbody style="
                           background-color: white;
                           font-size: 12px;
                           text-align: left;
                           " id="tblbody3"></tbody>
                </table>
            </div>

Answers

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    Looks like the href for the third tab doesn't correspond to the div container for the third tab.

    Allan

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    Congrats on posting thread #40'000 btw :smile:.

This discussion has been closed.