Vertical Scroll Bar not appearing in the TabStrip

1 posts, 0 answers
  1. Amit
    Amit avatar
    1 posts
    Member since:
    Sep 2012

    Posted 26 Sep 2012 Link to this post

    I have two tabs in my TabStrip but vertical scrollbar is not appearing in the TabStrip, below is the code i am using to create TabStrip

    <div id="tabstrip">
            <ul>
                <li class="k-state-active">Search in Flow Library </li>
                <li>Search by FA/LSR# </li>
            </ul>
            <div>
                <div style="width: 100%; height: 22px;" class="panelHeader">
                    <b>Search Flow Libraries</b>
                </div>
                <table width="100%" id="tabbed">
                    <tr>
                        <td align="right">
                            Flow Name:
                        </td>
                        <td style="padding-left: 10px">
                            <input type="text" id="txtFlowName" class="k-textbox" />
                        </td>
                        <td align="right">
                            Creator:
                        </td>
                        <td style="padding-left: 10px">
                            <input type="text" id="txtCreator" class="k-textbox" />
                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            Generic:
                        </td>
                        <td style="padding-left: 10px">
                            <input type="text" id="txtGeneric" class="k-textbox" />
                        </td>
                        <td align="right">
                            Model:
                        </td>
                        <td style="padding-left: 10px">
                            <input type="text" id="txtModel" class="k-textbox" />
                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            Customer Parent:
                        </td>
                        <td style="padding-left: 10px">
                            <input type="text" id="txtCustParent" class="k-textbox" />
                        </td>
                        <td align="right">
                            Customer Account Name:
                        </td>
                        <td style="padding-left: 10px">
                            <input type="text" id="txtCustACName" class="k-textbox" />
                        </td>
                    </tr>
                    <tr>
                        <td colspan="4">
                            <hr />
                        </td>
                    </tr>
                    <tr>
                        <td colspan="3">
                            <button class="k-button" id="btnMyFlowLib">
                                My Flow Libraries</button>
                        </td>
                        <td align="right">
                            <button class="k-button" id="btnSearch">
                                Search</button>
                            <button class="k-button" id="btnReset">
                                Reset</button>
                        </td>
                    </tr>
                </table>
                <div style="width: 100%; height: 22px;" class="panelHeader">
                    <b>Results/My Flow Libraries</b>
                </div>
                <div style="float: right">
                    <button class="k-button" id="btnImport">
                        Import</button></div>
                <br />
                <div>
                    <table id="grid">
                        <thead>
                            <tr>
                                <th data-field="rank">
                                    Flow Name
                                </th>
                                <th data-field="rating">
                                    Description
                                </th>
                                <th data-field="title">
                                    Generic
                                </th>
                                <th data-field="year">
                                    Model
                                </th>
                                <th data-field="year">
                                    Creator
                                </th>
                                <th data-field="year">
                                    Source
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>
                                    Deepak's Flow
                                </td>
                                <td>
                                    This for testing
                                </td>
                                <td>
                                    adxl678
                                </td>
                                <td>
                                    ADXL
                                </td>
                                <td>
                                    dbeshoyi
                                </td>
                                <td>
                                    Not Sure
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Amit's Flow
                                </td>
                                <td>
                                    This for testing
                                </td>
                                <td>
                                    adxl678
                                </td>
                                <td>
                                    ADXL
                                </td>
                                <td>
                                    dbeshoyi
                                </td>
                                <td>
                                    Not Sure
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Vijay's Flow
                                </td>
                                <td>
                                    This for testing
                                </td>
                                <td>
                                    adxl678
                                </td>
                                <td>
                                    ADXL
                                </td>
                                <td>
                                    dbeshoyi
                                </td>
                                <td>
                                    Not Sure
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Sandeep's Flow
                                </td>
                                <td>
                                    This for testing
                                </td>
                                <td>
                                    ADXL678
                                </td>
                                <td>
                                    ADXL
                                </td>
                                <td>
                                    dbeshoyi
                                </td>
                                <td>
                                    Not Sure
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <script>
                        $(document).ready(function () {
                            $("#grid").kendoGrid({
                                height: 180
                            });
                        });
                    </script>
                </div>
            </div>
            <div>
                <div style="width: 100%; height: 22px;" class="panelHeader">
                    <b>Search FA/LS</b>
                </div>
                <table width="100%">
                    <tr>
                        <td align="right">
                            Request Number:
                        </td>
                        <td style="padding-left: 10px">
                            <input type="text" id="txtReqNum" class="k-textbox" />
                        </td>
                        <td align="right">
                            Serial Number:
                        </td>
                        <td style="padding-left: 10px">
                            <input type="text" id="txtSerialNum" class="k-textbox" />
                        </td>
                    </tr>
                    <tr>
                        <td colspan="4">
                            <hr />
                        </td>
                    </tr>
                    <tr>
                        <td colspan="4" align="right">
                            <button class="k-button" id="txtSearch">
                                Search</button>
                            <button class="k-button" id="txtReset">
                                Reset</button>
                        </td>
                    </tr>
                </table>
                <div style="width: 100%; height: 22px;" class="panelHeader">
                    <b>Results/My Flow Libraries</b>
                </div>
                <div style="float: right; padding-top: -10px">
                    <button class="k-button" id="btnImport1">
                        Import</button></div>
                <br />
                <div>
                    <table id="grid1">
                        <thead>
                            <tr>
                                <th data-field="rank">
                                    Flow Name
                                </th>
                                <th data-field="rating">
                                    Description
                                </th>
                                <th data-field="title">
                                    Generic
                                </th>
                                <th data-field="year">
                                    Model
                                </th>
                                <th data-field="year">
                                    Creator
                                </th>
                                <th data-field="year">
                                    Source
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>
                                    Deepak's Flow
                                </td>
                                <td>
                                    The Shawshank Redemption9.2
                                </td>
                                <td>
                                    adxl678>
                                </td>
                                <td>
                                    ADXL
                                </td>
                                <td>
                                    dbeshoyi
                                </td>
                                <td>
                                    Not Sure
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Amit's Flow
                                </td>
                                <td>
                                    The Shawshank Redemption9.2
                                </td>
                                <td>
                                    adxl678>
                                </td>
                                <td>
                                    ADXL
                                </td>
                                <td>
                                    dbeshoyi
                                </td>
                                <td>
                                    Not Sure
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Vijay's Flow
                                </td>
                                <td>
                                    The Shawshank Redemption9.2
                                </td>
                                <td>
                                    adxl678>
                                </td>
                                <td>
                                    ADXL
                                </td>
                                <td>
                                    dbeshoyi
                                </td>
                                <td>
                                    Not Sure
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Sandeep's Flow
                                </td>
                                <td>
                                    The Shawshank Redemption9.2
                                </td>
                                <td>
                                    ADXL678
                                </td>
                                <td>
                                    ADXL
                                </td>
                                <td>
                                    dbeshoyi
                                </td>
                                <td>
                                    Not Sure
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <script>
                        $(document).ready(function () {
                            $("#grid1").kendoGrid({
                                height: 180
                            });
                        });
                    </script>
                </div>
            </div>
        </div>
        <script>
            $(document).ready(function () {
                $("#tabstrip").kendoTabStrip({
                    animation: false
                });
                var window = $("#window").kendoWindow({
                    height: "70%",
                    modal: true,
                    visible: false,
                    iframe: true,
                    draggable: false,
                    content: "../Pages/LoadWorkflow.aspx",
                    title: "Load Saved Workflow",
                    width: "70%"
                }).data("kendoWindow");
            });
        </script>
Back to Top