浅谈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 相关文章推荐
Prototype使用指南之array.js
Jan 10 Javascript
jquery实现个人中心导航菜单效果和美观都非常不错
Sep 02 Javascript
理解javascript回调函数
Dec 28 Javascript
js重写方法的简单实现
Jul 10 Javascript
JavaScript实现二分查找实例代码
Feb 22 Javascript
微信小程序中setInterval的使用方法
Sep 29 Javascript
Angular 作用域scope的具体使用
Dec 11 Javascript
JavaScript实现全选取消效果
Dec 14 Javascript
vue项目实现表单登录页保存账号和密码到cookie功能
Aug 31 Javascript
vue动画效果实现方法示例
Mar 18 Javascript
基于Bootstrap和JQuery实现动态打开和关闭tab页的实例代码
Jun 10 jQuery
vue中div禁止点击事件的实现
Apr 02 Vue.js
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
自己动手做一个SQL解释器
2006/10/09 PHP
浅析php中抽象类和接口的概念以及区别
2013/06/27 PHP
解析PHP的Yii框架中cookie和session功能的相关操作
2016/03/17 PHP
PHP通过引用传递参数用法分析
2016/12/01 PHP
javascript常见数字进制转换实例分析
2016/04/21 Javascript
jQuery 常用代码集锦(必看篇)
2016/05/16 Javascript
图文详解Javascript中的上下文和作用域
2017/02/15 Javascript
React-Native中props具体使用详解
2017/09/04 Javascript
vue-cli之router基本使用方法详解
2017/10/17 Javascript
原生JS获取元素的位置与尺寸实现方法
2017/10/18 Javascript
使用 vue.js 构建大型单页应用
2018/02/10 Javascript
使用Vue构建可重用的分页组件
2018/03/26 Javascript
js实现轮播图的完整代码
2020/10/26 Javascript
Vue使用vue-recoure + http-proxy-middleware + vuex配合promise实现基本的跨域请求封装
2019/10/21 Javascript
详解js location.href和window.open的几种用法和区别
2019/12/02 Javascript
vue.config.js中配置Vue的路径别名的方法
2020/02/11 Javascript
vue实现瀑布流组件滑动加载更多
2020/03/10 Javascript
Python卸载模块的方法汇总
2016/06/07 Python
实例讲解Python中global语句下全局变量的值的修改
2016/06/16 Python
Python实现基于TCP UDP协议的IPv4 IPv6模式客户端和服务端功能示例
2018/03/22 Python
python数据结构学习之实现线性表的顺序
2018/09/28 Python
python实现beta分布概率密度函数的方法
2019/07/08 Python
python中实现栈的三种方法
2020/12/19 Python
python 装饰器重要在哪
2021/02/14 Python
VSCode 自定义html5模板的实现
2019/12/05 HTML / CSS
初中女生自我鉴定
2013/12/19 职场文书
2014年小学元旦活动方案
2014/02/12 职场文书
社会实践活动总结报告
2014/04/29 职场文书
关于对大人不礼貌的检讨书
2014/09/29 职场文书
2014年个人委托书范本
2014/10/13 职场文书
质量负责人岗位职责
2015/02/15 职场文书
公司备用金管理制度
2015/08/04 职场文书
读《钢铁是怎样炼成的》有感:百炼方成钢
2019/11/05 职场文书
详解OpenCV曝光融合
2022/04/29 Python
索尼ICF-36收音机评测
2022/04/30 无线电
python数字图像处理数据类型及颜色空间转换
2022/06/28 Python