js控制li标签排序问题 js调用php函数

最新推荐文章于 2021-06-04 17:57:45 发布

原创最新推荐文章于 2021-06-04 17:57:45 发布 · 708 阅读

0 ·

CC 4.0 BY-SA版权

PHP应用同时被 2 个专栏收录

34 篇文章

订阅专栏

jQuery

6 篇文章

订阅专栏

本文深入探讨了一种通过管理类别和执行特定操作来优化数据组织的方法。利用PHP、HTML、JS和相关技术，实现了动态的类别列表展示、删除功能，并通过JavaScript实现类别顺序的实时调整。此外，还提供了对数据排序和删除操作的后端支持，确保了数据管理的高效性和用户体验的提升。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

【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>

【效果预览】