У меня есть корзина для покупок, где мне нужно добавить несколько элементов, я настроил jQuery-сортируемый плагин, однако, когда я добавляю более одного дополнительного элемента, они группируются вместе, поскольку я добавляю добавьте еще один элемент в div-ролик, я понимаю, что это проблема, но как я могу это сделать, чтобы я мог добавить больше элементов, но все-таки сохранить сортируемую функцию, работающую над отдельными элементами?jQuery Sortable append on Div
Пожалуйста, помогите или кто-то может показать мне рабочую скрипку, где Добавления большего количества Тена 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>