jQuery Divable在Div上追加

Question

我有一個購物籃，我需要能夠添加多個項目，我已經配置了jQuery可排序插件，但是，當我添加多個項目時，當我將添加另一個項目添加到放置器時，它們會組合在一起div，我認為這是問題所在，但是我如何做到這一點，以便我可以添加更多項目，但仍使可排序函數對單個項目起作用？

請幫忙，或者有人可以給我看一個工作的小提琴，在其中添加更多thena 1個食物項目不會將它們分組在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上！ 它的星期二！