浅谈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 相关文章推荐
jquery实现手机发送验证码的倒计时代码
Feb 12 Javascript
checkbox选中与未选中判断示例
Aug 04 Javascript
JS实现很酷的EMAIL地址添加功能实例
Feb 28 Javascript
实例解析jQuery中如何取消后续执行内容
Dec 01 Javascript
Jquery Easyui分割按钮组件SplitButton使用详解(17)
Dec 18 Javascript
Angular 4.X开发实践中的踩坑小结
Jul 04 Javascript
Vue结合SignalR实现前后端实时消息同步
Sep 19 Javascript
vue2.0安装style/css loader的方法
Mar 14 Javascript
深入理解Node module模块
Mar 26 Javascript
JavaScript中join()、splice()、slice()和split()函数用法示例
Aug 24 Javascript
原生js实现无缝轮播图
Jan 11 Javascript
JS前端面试必备——基本排序算法原理与实现方法详解【插入/选择/归并/冒泡/快速排序】
Feb 24 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开发者的10个技巧
2011/02/25 PHP
php header Content-Type类型小结
2011/07/03 PHP
php使用GeoIP库实例
2014/06/27 PHP
PHP的Yii框架中过滤器相关的使用总结
2016/03/29 PHP
使用正则去除php代码中的注释方法
2016/11/03 PHP
支付宝支付开发――当面付条码支付和扫码支付实例
2016/11/04 PHP
PHP ob缓存以及ob函数原理实例解析
2020/11/13 PHP
基于jquery跨浏览器显示的file上传控件
2011/10/24 Javascript
兼容IE、FireFox、Chrome等浏览器的xml处理函数js代码
2011/11/30 Javascript
jquery+css+ul模拟列表菜单具体实现思路
2013/04/15 Javascript
jQuery插件HighCharts绘制2D带有Legend的饼图效果示例【附demo源码下载】
2017/03/10 Javascript
详解nodejs中express搭建权限管理系统
2017/09/15 NodeJs
canvas轨迹回放功能实现
2017/12/20 Javascript
Vue 创建组件的两种方法小结(必看)
2018/02/23 Javascript
Js中使用正则表达式验证输入是否有特殊字符
2018/09/07 Javascript
vue 的 solt 子组件过滤过程解析
2019/09/07 Javascript
vue-cli和v-charts实现可视化图表过程解析
2019/10/08 Javascript
vue-resource:jsonp请求百度搜索的接口示例
2019/11/09 Javascript
Nodejs封装类似express框架的路由实例详解
2020/01/05 NodeJs
javascript中导出与导入实现模块化管理教程
2020/12/03 Javascript
[01:27]2014DOTA2展望TI 剑指西雅图IG战队专访
2014/06/30 DOTA
[04:59]DOTA2-DPC中国联赛 正赛 Ehome vs iG 选手采访
2021/03/11 DOTA
Python的垃圾回收机制深入分析
2014/07/16 Python
Python 经典面试题 21 道【不可错过】
2018/09/21 Python
对python 多个分隔符split 的实例详解
2018/12/20 Python
Python使用修饰器进行异常日志记录操作示例
2019/03/19 Python
python3 tkinter实现点击一个按钮跳出另一个窗口的方法
2019/06/13 Python
Python中字符串List按照长度排序
2019/07/01 Python
python正则爬取某段子网站前20页段子(request库)过程解析
2019/08/10 Python
Python3 webservice接口测试代码详解
2020/06/23 Python
浅析css3中matrix函数的使用
2016/06/06 HTML / CSS
整理HTML5的一些新特性与Canvas的常用属性
2016/01/29 HTML / CSS
AmazeUI 单选框和多选框的实现示例
2020/08/18 HTML / CSS
安全生产警示教育活动总结
2015/05/09 职场文书
2015年医务科工作总结范文
2015/05/26 职场文书
南京南京观后感
2015/06/02 职场文书