浅谈js控制li标签排序问题 js调用php函数的方法


Posted in Javascript onOctober 16, 2016

【Html代码】

<span style="font-size:14px;"><ul class="list-group"> 
   <? if ($categorys): ?>         
  <? foreach ($categorys as $category):?> 
    <li class="list-group-item" data-id="<? echo $category->id ?>"> 
      <? echo $category->name?> 
        <a href="<? echo site_url('group/category/delete?id=' . $category->id) ?>" onclick="<?echo lang('confirm')?>"> 
            <span class="glyphicon glyphicon-remove"></span></a> 
        </li>   
    <? endforeach;?>         
   <? else: ?> 
  <div class="alert alert-danger">暂时没有设置</div> 
   <? endif; ?> 
</ul></span>

【js代码】

<span style="font-size:14px;">   <script> 
      require(["jquery","jqueryui"],function($) { 
        var d = window.top.dialog({ 
          content: '配置已更新' 
        }); 
        $(function() { 
          $( ".list-group").sortable({ 
            stop: function( event, ui ) { 
              data = ''; 
              $('li.list-group-item').each(function (){ 
                data += ',' + $(this).attr('data-id'); 
              }); 
              $.post('/group/category/listorder',{data:data}); 
              d.show(); 
              setTimeout(function () { 
                d.close(); 
              }, 1000); 
            } 
          }).disableSelection(); 
        }); 
      }); 
    </script></span>

【php代码】

<span style="font-size:14px;">public function listorder() { 
    $data = explode(',', $this->input->post('data')); 
    $i = 1; 
    foreach ($data as $id) { 
      if (!$id) 
        continue; 
      $this->category_model->save($id, array( 
        'listorder' => $i, 
      )); 
      $i++; 
    } 
  } 
 
  public function delete() { 
    $id = $this->input->get('id'); 
    $this->category_model->delete($id); 
    messagebox(lang('success'), 'referer'); 
  }</span>

浅谈js控制li标签排序问题 js调用php函数的方法

以上就是小编为大家带来的浅谈js控制li标签排序问题 js调用php函数的方法全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
html中table数据排序的js代码
Aug 09 Javascript
JQuery循环滚动图片代码
Dec 08 Javascript
javascript获取选中的文本的方法代码
Oct 30 Javascript
jQuery实现仿美橙互联两级导航菜单的方法
Mar 09 Javascript
JavaScript判断undefined类型的正确方法
Jun 30 Javascript
JS onkeypress兼容性写法详解
Apr 27 Javascript
jQuery插件HighCharts绘制的基本折线图效果示例【附demo源码下载】
Mar 07 Javascript
js实现鼠标拖拽多选功能示例
Aug 01 Javascript
js getBoundingClientRect使用方法详解
Jul 17 Javascript
小程序实现按下录音松开识别语音
Nov 22 Javascript
如何用vue-cli3脚手架搭建一个基于ts的基础脚手架的方法
Dec 12 Javascript
JavaScript位置参数实现原理及过程解析
Sep 14 Javascript
JS实现禁止鼠标右键的功能
Oct 15 #Javascript
Vue.js快速入门实例教程
Oct 15 #Javascript
JavaScript随机生成颜色的方法
Oct 15 #Javascript
js实现目录链接,内容跟着目录滚动显示的简单实例
Oct 15 #Javascript
js控制div层的叠加简单方法
Oct 15 #Javascript
js实现table添加行tr、删除行tr、清空行tr的简单实例
Oct 15 #Javascript
js控制li的隐藏和显示实例代码
Oct 15 #Javascript
You might like
php中的一个中文字符串截取函数
2007/02/14 PHP
php微信开发之上传临时素材
2016/06/24 PHP
PHP提取字符串中的手机号正则表达式怎么写
2017/07/17 PHP
Input 特殊事件onpopertychange和oninput
2009/06/17 Javascript
document.body.scrollTop 值总为0的解决方法 比较常见的标准问题
2009/11/30 Javascript
JavaScript数值数组排序示例分享
2014/05/27 Javascript
JS自定义对象实现Java中Map对象功能的方法
2015/01/20 Javascript
继续学习javascript闭包
2015/12/03 Javascript
bootstrap的3级菜单样式,支持母版页保留打开状态实现方法
2016/11/10 Javascript
JS中使用gulp实现压缩文件及浏览器热加载功能
2017/07/12 Javascript
详解js正则表达式验证时间格式xxxx-xx-xx形式
2018/02/09 Javascript
webpack项目调试以及独立打包配置文件的方法
2018/02/28 Javascript
解决echarts的多个折现数据出现坐标和值对不上的问题
2018/12/28 Javascript
JavaScript中filter的用法实例分析
2019/02/27 Javascript
js字符串类型String常用操作实例总结
2019/07/05 Javascript
python client使用http post 到server端的代码
2013/02/10 Python
Python heapq使用详解及实例代码
2017/01/25 Python
在numpy矩阵中令小于0的元素改为0的实例
2019/01/26 Python
python中使用ctypes调用so传参设置遇到的问题及解决方法
2019/06/19 Python
Python通过socketserver处理多个链接
2020/03/18 Python
Python如何对XML 解析
2020/06/28 Python
Python常用模块函数代码汇总解析
2020/08/31 Python
python空元组在all中返回结果详解
2020/12/15 Python
Dr. Martens马汀博士澳大利亚官网:马丁靴鼻祖
2019/07/02 全球购物
what is the difference between ext2 and ext3
2015/08/25 面试题
酒吧副总经理岗位职责
2013/12/10 职场文书
学雷锋志愿者活动总结
2014/06/27 职场文书
大学生实习证明范本
2014/09/19 职场文书
检讨书格式
2015/01/23 职场文书
简单的辞职信范文(2016最新版)
2015/05/12 职场文书
离婚起诉书范本
2015/05/18 职场文书
小学语文国培研修日志
2015/11/13 职场文书
2016最新离婚协议书范本及程序
2016/03/18 职场文书
假如给我三天光明:舟逆水而行,人遇挫而达 
2019/10/29 职场文书
SpringBoot工程下使用OpenFeign的坑及解决
2021/07/02 Java/Android
Python干货实战之八音符酱小游戏全过程详解
2021/10/24 Python