OFFSET FETCH in SQL Server

If you are given task to do custom paging then what you will do ?  you will write where condition and use row_number() function. But here SQL provide new way to get records as per our requirement for paging. Just write below query and pass start Record number and total record to get and you will gget your result :

SELECT * FROM  Table1

ORDER BY 1

OFFSET 0 ROWS FETCH NEXT 10 ROWS ONLY

Arguments Explanation :

OFFSET : Specifies the number of rows to skip, before starting to return rows from the query expression. The argument for the OFFSET clause can be an integer or expression that is greater than or equal to zero. You can use ROW and ROWS interchangeably.

FETCH (FIRST|NEXT): Specifies the number of rows to return, after processing the OFFSET clause. The argument for the FETCH clause can be an integer or expression that is greater than or equal to one. You can use ROW and ROWS interchangeably. Similarly, FIRST and NEXT can be used interchangeably

Why Should be a fan as you are star of tomorrow....

Treeview using Javascript

CSS  :

<style>

        body {

            font-family: Verdana, helvetica, arial, sans-serif;

            font-size: 0.8em;

        }

        .treeview, .treeview ul {

            padding: 0;

            margin: 0;

            list-style: none;

        }

            .treeview ul {

                background-color: white;

                margin-top: 4px;

            }

            .treeview .hitarea {

                background: url(image/treeview-default.gif) -64px -25px no-repeat;

                height: 16px;

                width: 16px;

                margin-left: -16px;

                float: left;

                cursor: pointer;

            }

        /* fix for IE6 */

        * html .hitarea {

            display: inline;

            float: none;

        }

        .treeview li {

            margin: 0;

            padding: 3px 0pt 3px 16px;

        }

        .treeview li {

            background: url(image/TrLine.gif) 0 0 no-repeat;

        }

            .treeview li.collapsable, .treeview li.expandable {

                background-position: 0 -174px;

            }

        .treeview .expandable-hitarea {

            background-position: -80px -3px;

        }

        .treeview li.last {

            background-position: 0 -1763px;

        }

        .filetree span.folder, .filetree span.file {

            padding: 1px 0 1px 22px;

            display: inline;

        }

        .filetree span.folder {

            background: url(image/folder.gif) 2px 0 no-repeat;

        }

        .filetree span.file {

            background: url(image/inbox.gif) 2px 0 no-repeat;

        }

        .lastIcon {

            background-position: -48px -45px !important;

        }

        .click:hover {

            cursor: pointer;

        }

    </style>

Javascript :

<script>

        $(document).ready(function () {

            $(".click").click(function () {

                $(this).next().slideToggle(200);

            })

        })

    </script>

HTML :

<div style="width:400px;">

            <ul id="browser" class="filetree treeview">

                <li class="closed expandable">

                    <div class="click">

                        <div class="hitarea closed-hitarea expandable-hitarea"></div>

                        <span class="folder">Folder 1</span>

                    </div>

                    <ul style="display: none;">

                        <li class="last"><span class="file">Item 1</span></li>

                    </ul>

                </li>

                <li class="collapsable">

                    <div class="click">

                        <div class="hitarea collapsable-hitarea"></div>

                        <span class="folder">Folder 2</span>

                    </div>

                    <ul>

                        <li class="last"><span class="file">Item 1</span></li>

                    </ul>

                </li>

                <li class="collapsable">

                    <div class="click">

                        <div class="hitarea collapsable-hitarea"></div>

                        <span class="folder">Folder 3</span>

                    </div>

                    <ul>

                        <li class="collapsable">

                            <div class="click">

                                <div class="hitarea collapsable-hitarea"></div>

                                <span class="folder">Subfolder 1</span>

                            </div>

                            <ul id="folder21" style="display: block;">

                                <li><span class="file">Item 1</span></li>

                                <li class="last"><span class="file">Item 2</span></li>

                            </ul>

                        </li>

                        <li class="last"><span class="file">Item 1</span></li>

                    </ul>

                </li>

                <li class="last closed expandable">

                    <div class="click">

                        <div class="lastIcon hitarea closed-hitarea expandable-hitarea"></div>

                        <span class="folder">Folder 4</span>

                    </div>

                    <ul style="display: none;">

                        <li class="last"><span class="file">Item 1</span></li>

                    </ul>

                </li>

            </ul>

        </div>

Download source code from here