We are providing online training of realtime Live project on Asp.Net MVC with Angular and Web API. For more information click here. If you have any query then drop the messase in CONTACT FORM

Tuesday, August 18, 2015

Sort table example in Jquery

<html>
<head >
    <title></title>
      <script src="Scripts/jquery-2.1.1.js" type="text/javascript"></script>
    <script src="Scripts/jquery-ui.js" type="text/javascript"></script>
    <link href="themes/vader/jquery-ui.css" type="text/css" rel="stylesheet" />
    <link href="themes/vader/theme.css" type="text/css" rel="stylesheet" />
    <script type="text/javascript">
        $(document).ready(function () {
            $("#ulsortable").sortable();
            });
    </script>
    <style type="text/css">
        #ulsortable{
        list-style-type:none;
        margin:5px;
        padding:5px;
        width:60%;
        }

            #ulsortable li {
            margin:5px;
            padding:5px;
            font-size:20px;
            height:20px;
            background-color:aqua;
            border:2px solid gray;
            cursor:pointer;
            }
    </style>
</head>
<body>
    <form id="form2" runat="server">
    <div>      

        <ul id="ulsortable">
            <li>List Item1</li>
            <li>List Item2</li>
            <li>List Item3</li>
            <li>List Item4</li>
            <li>List Item5</li>
        </ul>         

    </div>
    </form>
</body>

</html>

OUTPUT:


No comments: