浅谈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 相关文章推荐
文本加密解密
Jun 23 Javascript
jQuery $.each的用法说明
Mar 22 Javascript
关于Javascript与iframe的那些事儿
Jul 04 Javascript
详解JavaScript函数绑定
Aug 18 Javascript
Ajax同步与异步传输的示例代码
Nov 21 Javascript
了不起的node.js读书笔记之node.js中的特性
Dec 22 Javascript
JS 中使用Promise 实现红绿灯实例代码(demo)
Oct 20 Javascript
微信小程序实现简单input正则表达式验证功能示例
Nov 30 Javascript
详解Express笔记之动态渲染HTML(新手入坑)
Dec 13 Javascript
Vue实现的父组件向子组件传值功能示例
Jan 19 Javascript
js实现点击生成随机div
Jan 16 Javascript
js实现限定区域范围拖拉拽效果
Nov 20 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教程 基本语法
2009/10/23 PHP
php使用curl访问https示例分享
2014/01/17 PHP
PHP批量上传图片的具体实现方法介绍.
2014/02/26 PHP
php常用数学函数汇总
2014/11/21 PHP
php实现的IMEI限制的短信验证码发送类
2015/05/05 PHP
php生成动态验证码gif图片
2015/10/19 PHP
PHP+MySql+jQuery实现的&quot;顶&quot;和&quot;踩&quot;投票功能
2016/05/21 PHP
php array_keys 返回数组的键名
2016/10/25 PHP
PHP实现的DES加密解密封装类完整实例
2017/04/29 PHP
静态的动态续篇之来点XML
2006/08/15 Javascript
一个不错的用JavaScript实现的UBB编码函数
2007/03/09 Javascript
一个JS翻页效果
2007/07/23 Javascript
jQuery 核心函数以及jQuery对象
2010/03/23 Javascript
jQuery中append()方法用法实例
2014/12/25 Javascript
javaScript知识点总结(必看篇)
2016/06/10 Javascript
AngularJS 指令的交互详解及实例代码
2016/09/14 Javascript
微信小程序 location API接口详解及实例代码
2016/10/12 Javascript
微信小程序云开发修改云数据库中的数据方法
2019/05/18 Javascript
微信小程序如何引用外部js,外部样式,公共页面模板
2019/07/23 Javascript
echarts浮动显示单位的实现方法示例
2020/12/04 Javascript
python操作ssh实现服务器日志下载的方法
2015/06/03 Python
Linux系统上Nginx+Python的web.py与Django框架环境
2015/12/25 Python
Python的Flask框架及Nginx实现静态文件访问限制功能
2016/06/27 Python
tensorflow 恢复指定层与不同层指定不同学习率的方法
2018/07/26 Python
IntelliJ IDEA安装运行python插件方法
2018/12/10 Python
基于python实现的百度新歌榜、热歌榜下载器(附代码)
2019/08/05 Python
使用python制作一个解压缩软件
2019/11/13 Python
使用Python生成200个激活码的实现方法
2019/11/22 Python
tensorflow dataset.shuffle、dataset.batch、dataset.repeat顺序区别详解
2020/06/03 Python
有影响力的品牌之家:Our Social Collective
2019/06/08 全球购物
PHP数据运算类型都有哪些
2013/11/05 面试题
大学生个人事迹材料
2014/01/21 职场文书
如何写好优秀的创业计划书
2014/01/30 职场文书
奖励通知
2015/04/22 职场文书
力克胡哲观后感
2015/06/10 职场文书
建议书的格式及范文
2015/09/14 职场文书