Quick and easy sortable list using jquery-ui


1. Need to load jQuery and jQuery-ui library


  <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
  <script type="text/javascript" src="js/jquery-ui-1.10.4.custom.min.js"></script>

2. Now you need to initialize sorting flavour


  <script type="text/javascript">
    jQuery(document).ready(function() {
        jQuery(function() {
            jQuery(".sortable").sortable({opacity: 0.6, cursor: 'move', update: function() { }});
        });
    });
  </script>

3. Now this is the time to play on sorting list, Inject sorting functionality to a list order


  <ul class="sortable">
        <li>This is first li</li>
	<li>This is second li</li>
	<li>This is third li</li>
  </ul>

Thats it. DONE

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s