У меня есть несколько дивы, что я хочу, чтобы отсортировать с помощью функции сортировки JQuery на основе имени атрибута продукта внутри продукта. Однако, когда я нажимаю кнопку для запуска функции, все divs внезапно исчезают, когда я проверял, чтобы увидеть ошибки, не было обнаружено ошибок.JQuery Сортировка Divs на основе содержимого -не Рабоче
Пожалуйста, помогите мне знать, что это проблема.
Вот моя функция JQuery и называют:
<script type="text/javascript">
$(document).ready(function(){
$divs = $("div.section-item");
$("#asc").on("click", function(){
var alphabetically = $divs.sort(function(a, b){
return $(a).find(".name").text() > $(b).find("name").text();
});
$("#section-item").html(alphabetically);
});
});
</script>
Это контейнер со всеми дивов:
<div id="block-section-item">
<div id="bdi-button">
<button type="submit" id="asc" class="rec">Nom</button>
</div>
<div id="section-item">
<?php
include 'Include/__Class/Cls_Product.php';
$product = new ClsProduct($bdd);
$products = $product->DisplayAllProducts();
foreach($products as $row){
echo'<div class="section-items">
<span class="section-items-img">
<img src="Image/clio-full.jpg">
</span>
<span class="section-items-bottom">
<span class="section-item-text">';
echo '<h4 class="name">'.$row['Product_name'].'</h4>';
echo '<h4 class="price">'.$row['Product_price'].'</h4>';
echo'<span class="section-item-icon">
<span class="voir-item"><a href="'.$_SERVER['PHP_SELF'].'?id='.$row["Product_id"].'"></a></span>
<span class="middle-item"></span>
<span class="nakrih-item"><a href="'.$_SERVER['PHP_SELF'].'?id='.$row["Product_id"].'"></a></span>
</span>
</span>';
echo'</div>';
}
?>
</div>
</div>
Большое спасибо за быстрый ответ, но вы можете мне сказать, какие изменения вы сделали в HTML файле? потому что код JavaScript тот же, и он не работает. Я проверял файл HTML и я не могу найти разницу между моим и вашим (в терминах имен классов и DIVS ид) На этот раз он не исчезающие, но порядок грязен и не эффективный – Alladin
Обновите свой вопрос с новым код – rad11
я на самом деле, я видел, что вы сделали несколько обновлений для вашего ответа, однако, последнее обновление я увидел, что он работал для вас в jsfiddle, но в моем коде не – Alladin