knockout.js - JQuery Sortable Identifying Item Position -
i have list user can sort. when user clicks submit button, list items should each have id identifying position. force location index id value of each item?
and if user makes no changes, default should used. i.e. analyst = 0, supervisor = 1, manager = 3
var currentid = 0; $("#sortable").sortable({ start: function (event, ui) { //debugger; currentid = $(ui.item).index(); //console.log($(ui.item).index()); }, cancel: ".ui-state-disabled", update: function (event, ui) { //debugger; //console.log($(ui.item).data('id')); var newid = $(ui.item).index(); alert('current: ' + currentid.tostring()); alert('new: ' + newid.tostring()); } }); $(".sortable").draggable({ containment: "parent" }); var viewmodel = function(data) { var self = this; self.userselectedapprovallevels = ko.observablearray([ {approvallevelname: "analyst"}, {approvallevelname: "supervisor"}, {approvallevelname: "manager"} ]); }; ko.applybindings(new viewmodel());
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script> <p>sort in order of approval level (highest lowest)</p> <ul id="sortable" data-bind="foreach: userselectedapprovallevels"> <li> <span data-bind="text: approvallevelname"> </span> </li> </ul> <button type="submit" id="savebtn" data-bind="click: addnew">save</button>
Comments
Post a Comment