Как изменить контент в div, основанный на выпадающем списке

Я загружаю свой контент из своей DB с помощью PHP в мой div.

У меня есть dropdown над ним, где я должен иметь возможность сортировать содержимое, а это означает, что при выборе dropdown старый контент в div удаляется, и появляется новое.

Итак, как можно «удалить» старый контент в div и получить новый контент на основе dropdown selection ?

Это то, что я получил до сих пор:

  <div class="col-md-4"> <ul class="nav nav-tabs top_nav"> <li role="presentation" class="active"><a href="#">Edit</a></li> <li role="presentation" class="inactive"> <!-- THE DROPDOWN THAT SHOULD SORT THE CONTENT BELOW --> <!-- REMOVE OLD, AND GET NEW AFTER SELECTED --> <select id="filter_type"> <option selected value="Alle">Alle</option> <option value="Privat_Tale">Privat Tale</option> <option value="Erhverv_Tale">Erhverv Tale</option> <option value="Gamle">Gamle</option> <option value="Privat_MBB">Privat MBB</option> <option value="Erhverv_MBB">Erhverv MBB</option> <option value="Familietele">Familietele</option> <option value="Retention">Retention</option> </select> </li> </ul> <!-- LOAD THE CONTENT FROM DB, AND SHOW IT --> <div class="abo_load" id="abo_load"> <?php if (mysql_num_rows($sql_select_edit) > 0) { while ($row = mysql_fetch_assoc($sql_select_edit)) { ?> <div class="abo_box" id="abo_box"> <label class="abo_navn"><?php echo $row['abo_name']; ?></label> <input type="hidden" value="<?php echo $row['category']; ?>" name="category" /> <form action="conn/delete.php" method="post"> <input type="hidden" value="<?php echo $row['id']; ?>" name="slet"> <input class="delete" value="Delete" type="submit" onclick="return confirm('Er du sikker??\nDet ville jo være ÆV med en Fejl 40!');"> </form> <label class="edit">Edit</label> <?php include("files/edit_list_content.php"); ?> </div> <?php } } ?> </div> </div> 

EDIT: Я уже сделал это с помощью JQuery, я загружаю страницу php, которая получает выбранный элемент, а затем получает данные из БД. Но проблема в том, что при загрузке я не могу использовать JQuery для управления новым контентом. Подобно тому, как у меня есть метка редактирования содержимого с функцией скрытия JQuery. Эта функция работает, когда я получаю данные, хотя php из моей БД, но не тогда, когда я получаю данные, хотя загружает JQuery. Вот почему я хочу загрузить данные, хотя php

Вам нужно связать событие change в раскрывающемся меню и на основе выбора, запустить запрос ajax для получения связанного контента и затем после получения содержимого обновления внутри DIV .

Если вы используете jQuery, некоторые полезные функции:

Ajax: http://api.jquery.com/jquery.ajax/

Событие привязки: https://api.jquery.com/change/

Хороший пример реализации приведен здесь: https://stackoverflow.com/a/4910803/2004910