- <meta name="description" content="Add, Sort and Save result">
- <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
+ <meta name="description" content="Add, Sort and Save result">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
- background-color: #3c6dc5;
- font-family: helvetica;
- background-color: orange;
-$(document).ready(function ($) {
+ background-color: #3c6dc5;
+ font-family: helvetica;
- addNewValue = function (newTask) {
- var newLi = $('<li>' + newTask + '</li>');
- newLi.on('click', function () {
- $(this).remove(); // Attach the event handler *before* adding the element
- $('ul').addClass('listitems').prepend(newLi); // To put the new task at the top of the list
- $('form').submit(function () {
- var newVal = $('.input').val();
- if (!isNaN(parseFloat(newVal))) {
- return false; // So the change persists
+ background-color: orange;
+<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
+<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.min.js"></script>
+ $(document).ready(function($) {
+ addNewValue = function(newTask) {
+ var newLi = $('<li>' + newTask + '</li>');
+ newLi.on('click', function() {
+ $(this).remove(); // Attach the event handler *before* adding the element
+ $('ul').addClass('listitems').prepend(newLi); // To put the new task at the top of the list
- $('ul').sortable(); // Because what good is a to-do list that you can't sort? :)
- $('input:button').click(function () {
- function sort_li(a, b) {
- return ($(b).text() < $(a).text()) ? 1 : -1;
+ $('form').submit(function() {
+ var newVal = $('.input').val();
+ if (!isNaN(parseFloat(newVal))) {
+ return false; // So the change persists
+ $('ul').sortable(); // Because what good is a to-do list that you can't sort? :)
- $("ul.listitems li").sort(function (a, b) {
- return $(b).text() - $(a).text()
+ $('input:button').click(function() {
+ function sort_li(a, b) {
+ return ($(b).text() < $(a).text()) ? 1 : -1;
+ $("ul.listitems li").sort(function(a, b) {
+ return $(b).text() - $(a).text()
+ orderedlist.appendTo('.listitems');
+ var orderedListValues = [];
+ $(orderedlist).each(function() {
+ orderedListValues.push($(this).text());
- orderedlist.appendTo('.listitems');
- var orderedListValues = [];
- $(orderedlist).each(function () {
- orderedListValues.push($(this).text());
+ window.localStorage.setItem("sorrt", orderedListValues);
- window.localStorage.setItem("sorrt", orderedListValues);
+ function getStorage() {
+ return window.localStorage.getItem("sorrt");
- function getStorage() {
- return window.localStorage.getItem("sorrt");
- var storage = getStorage();
- if (storage != null && storage != '') {
- $(storage.split(",")).each(function (index, val) {
- console.log(index.val);
+ var storage = getStorage();
+ if (storage != null && storage != '') {
+ $(storage.split(",")).each(function(index, val) {
+ console.log(index.val);
<label>Enter a new value:</label>
<input class="input" type="number">
<input type="submit" value="Add">
- <input type="button" value="Sort">
+ <input type="button" value="Sort">
<ul title="Click to delete; drag to reorder">
- <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
- <script src="http://code.jquery.com/ui/1.11.0/jquery-ui.min.js"></script>
- <!-- <script src="main.js"></script> -->