使用复选框禁用 jquery-ui 可排序，复选框状态存储在数据库中答案

【问题标题】：Disable jquery-ui sortable using a checkbox with the checkbox status stored in database使用复选框禁用 jquery-ui 可排序，复选框状态存储在数据库中
【发布时间】：2012-11-17 05:08:21
【问题描述】：

我正在使用 jquery-ui 可排序交互。我想要一个复选框，在选中时禁用可排序的交互。列表顺序和复选框状态都存储在 mysql 数据库中，并使用 php 代码动态加载并使用 ajax 进行更新。下面的代码适用于除列表的可排序性状态与页面首次加载时的复选框状态不匹配之外的所有内容。第一次选中复选框后，一切正常。 php 变量 $items 是一个保存列表的对象，$lock 保存“已选中”或“未选中”。

<head>
<script>        
$(function() {  
        $("#sortable").sortable({stop:function(i) {
        $.post('/index.php/welcome/process_sort',     $("#sortable").sortable("serialize"))
        }})
    });
</script>
<script>    
     $(function() { 
        $("#disabler").change(function() { 
            if (this.checked) {
                $("#sortable").sortable( "option", "disabled", true );       
            } else { 
                $("#sortable").sortable("option", "disabled", false);
            }
        })
    });

</script>
</head>
<body>
<input type="checkbox" id="disabler" value="disabler" <?php echo $lock ?>  >disable<br>    </input>

<ul id="sortable">
    <?php
        foreach ($item as $row) {
        $my_id = "id_".$row->id_items;
        $my_text = $row->text;
        ?>
        <li id=<?php echo"$my_id" ?> name=<?php echo"$my_id" ?> value=<?php   echo "$my_text"?> class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s">    </span><?php echo "$my_text"?></li>
            <?php   
        }
    ?>
</ul>
</body>

我尝试添加一个包含 jquery if 块的 $(document).ready 函数，但它破坏了可排序的交互。

【问题讨论】：

标签： php jquery-ui jquery

【解决方案1】：

试试这样的

 <script>    
   $(function() { 
      $("#disabler").change(function() { 
        if (this.checked) {
            $("#sortable").sortable( "option", "disabled", true );       
        } else { 
            $("#sortable").sortable("option", "disabled", false);
         }
      })
      checkDisable();
  });

 function checkDisable(){
   if($("#isAgeSelected").is(':checked')){
        $("#sortable").sortable( "option", "disabled", true ); 
      }
    else {
       $("#sortable").sortable("option", "disabled", false);
     }
 }

【讨论】：