<script type="text/javascript"> jQuery(function($){ $('.dd').nestable(); $('.dd-handle a').on('mousedown', function(e){ e.stopPropagation(); }); $('[data-rel="tooltip"]').tooltip(); $('#nestable').nestable().on('change', function(){ var r = $('.dd').nestable('serialize'); $("#xx").html(JSON.stringify(r)); //改变排序之后的数据 }); $('#nestable').nestable().on('change', updateOutput); }); </script>
以上代码用来获取操作后的json 数据,传递给后台,进行数据排序处理。
以下为我的操作:
<script type="text/javascript"> jQuery(function($){ var courseID = '{$course_id}'; $('.dd').nestable(); $('.dd-handle a').on('mousedown', function(e){ e.stopPropagation(); }); $('[data-rel="tooltip"]').tooltip(); $('#nestable').nestable().on('change', function(){ var r = $('.dd').nestable('serialize'); console.log(11); console.log(JSON.stringify(r)); $.ajax({ type: 'POST', url: "__URL__/updateSort", data: {jsonData:JSON.stringify(r),courseId:courseID}, success:function(result){ //console.log(result); window.location.reload(); }}); $("#xx").html(JSON.stringify(r)); //改变排序之后的数据 }); $('#nestable').nestable().on('change', updateOutput); }); </script>
public function updateSort(){ //$data = '[{"id":605,"children":[{"id":4093},{"id":4095},{"id":4094},{"id":4096},{"id":4097},{"id":4098},{"id":4099},{"id":4100},{"id":4101},{"id":4102},{"id":4103},{"id":4104},{"id":4105},{"id":4106},{"id":4107},{"id":4108},{"id":4109},{"id":4110},{"id":4111},{"id":4112}]}]'; $data = $_POST['jsonData']; //$data = '[{"id":553,"children":[{"id":3769},{"id":3768},{"id":3770},{"id":3771},{"id":3772},{"id":3773},{"id":3774},{"id":3775},{"id":3776},{"id":3777},{"id":3778}]}]'; $data = json_decode($data); //var_dump($data); $courseId = $_POST['courseId']; //$courseId = 343; $chapterId = $data[0]->id; //$chapterId = 553; $childrenData = $data[0]->children; try{ foreach($childrenData as $key=>$item){ echo $item->id."--".$key."<br/>"; M('CourseChapterSection')->where(array('course_id'=>$courseId,'chapter_id'=>$chapterId,'section_id'=>$item->id))->data(array('s_sort'=>$key))->save(); } echo 1; }catch(Exception $e){ echo 0; } }