Question

我有一个购物篮，我需要能够添加多个项目，我已经配置了jQuery可排序插件，但是，当我添加超过1个额外项目时，他们组合在一起，因为我正在添加另一个项目，对于一个占位符div，我认为这是问题所在，但我如何制作它以便我可以添加更多项目，但仍然保持可排序功能处理单个项目？

请帮助或者有人可以告诉我一个工作小提琴在哪里添加更多的食物而不是另外一种食物项目不会将它们分组到foodplacer div中

<td>
            <ul id="sortable">
<?php
    $mCount = 1;
    if(isset($_POST['itemDetails']) && is_array($_POST['itemDetails']) && count($_POST['itemDetails']) > 0){
        foreach($_POST['itemDetails'] as $itemDetail){
            if(!empty($itemDetail['title']) || !empty($itemDetail['brand']) || !empty($itemDetail['order']) || !empty($itemDetail['notes'])){
                echo('<li class="ui-state-fooddefault">
                <input style="font-size:14px" type="text" size="25" name="itemDetails['.$mCount.'][title]" value="'.$itemDetail['title'].'" id="itemDetailTitle'.$mCount.'" onKeyPress="return disableEnterKey(event)" /><br />
                <input style="font-size:14px" type="text" size="25" name="itemDetails['.$mCount.'][brand]" value="'.$itemDetail['brand'].'" id="itemDetailbrand'.$mCount.'" onKeyPress="return disableEnterKey(event)" /><br />
            <input style="font-size:14px" type="text" size="40" name="itemDetails['.$mCount.'][notes]" value="'.$itemDetail['notes'].'" id="foodNotes'.$mCount.'" onKeyPress="return disableEnterKey(event)" /></li>');
        $mCount++;  
            }
        } 
    } else {
        //INITAL REQUEST IF 0 POST DATA
        echo('<li class="ui-state-fooddefault"><p class="itemDetailTrackNumber">Track '.$mCount.'</p>
        <label for="itemDetailTitle'.$mCount.'">Title</label>
        <input style="font-size:14px" type="text" size="25" name="itemDetails['.$mCount.'][title]" value="" id="itemDetailTitle'.$mCount.'"  onkeyup="showResult(this.value)/>
        <div id="livesearch"></div>
        <label for="itemDetailbrand'.$mCount.'">brand</label> 
        <input style="font-size:14px" type="text" size="25" name="itemDetails['.$mCount.'][brand]" value="" id="itemDetailbrand'.$mCount.'" onKeyPress="return disableEnterKey(event)" />
        <label for="foodNotes'.$mCount.'">Notes</label><input style="font-size:14px" type="text" size="40" name="itemDetails['.$mCount.'][notes]" value="" id="foodNotes'.$mCount.'" onKeyPress="return disableEnterKey(event)" /></li>');
        $mCount++;
    }

?>
        <script type="text/javascript">
            var currCount = <?php echo($mCount); ?>;
            function addNewItem(){
                jQuery("#foodPlacer").append('<li class="ui-state-fooddefault"><label>Track '+currCount+'</label><label for="itemDetailTitle'+currCount+'">Title</label><input style="font-size:14px" type="text" size="25" name="itemDetails['+currCount+'][title]" value="" id="itemDetailTitle'+currCount+'" onkeyup="showResult(this.value); onclick=showsearch();" autocomplete="off" onKeyPress="return disableEnterKey(event)" /><div id="livesearch"></div><label for="itemDetailbrand'+currCount+'">brand</label><input style="font-size:14px" type="text" size="25" name="itemDetails['+currCount+'][brand]" value="" id="itemDetailbrand'+currCount+'" /><input style="font-size:14px" type="text" size="40" name="itemDetails['+currCount+'][notes]" value="" id="foodNotes'+currCount+'" /></li>');                
                jQuery("#itemDetailTitle"+currCount).keypress(function(event){  return disableEnterKey(event); });
                currCount++;
                return false;
            }
            function disableEnterKey(e){
                var key;
                if(window.event)
                    key = window.event.keyCode;     //IE
                else
                    key = e.which;     //firefox
                if(key == 13)
                    return false;   else    return true;
            }
        </script>
       <a href="#" onclick="addNewItem(); return false;">Add Another food Item</a> <div id="foodPlacer"></div></ul></td>

Answer 1

将它附加到Sortable而不是foodplacer，抱歉伙计们！它的星期二！

div上的jQuery Sortable追加

1 个答案: