Вход

Просмотр полной версии : Как отследить события с динамического контента?


yarnik
10.03.2012, 23:09
Имеем автокомплит по названию предприятия

$("#firms").autocomplete({
source: "ajax_firms.cgi",
select: function (event, ui) {
$.ajax({
type: "GET",
url: "ajax_staff.cgi",
data: "firms=" + (ui.item.id),
success: function (html) {
$("#value").html(html);
}
});
}
});

При успешном выборе нами генерируется динамическая форма с именами сотрудников

<select name="person" id="person">
<option value="1">person1</option>
<option value="2">person2</option>
</select>

Как отследить событие при смене сотрудника? Пробовал .change, но оно динамические ловить не хочет.

Rootpassword
10.03.2012, 23:11
<select name="person" id="person" onchange="alert('я поменялся');">
<option value="1">person1</option>
<option value="2">person2</option>
</select>

yarnik
10.03.2012, 23:26
я же jQuery хочу ловить, для дальнейшей обработки через аякс
пробовал так, не получается
$("select").change(function () {
var str = "";
$("select option:selected").each(function () {
str += $(this).text() + " ";
});
$("div").text(str);
})
.trigger('change');

zebra
10.03.2012, 23:32
События нужно вешать после того как селект будет добавлен в dom. Или можно повесить событие 1 раз через jquery.live

yarnik
10.03.2012, 23:58
извините, мне не совсем понятны ваши слова, можно получить пример кода?

yarnik
11.03.2012, 00:17
к чему это было? и вроде бы уважаемый человек на форуме...
если посмотреть то что я написал в начале поста, то там можно увидеть что с автокомплитом проблем нету.

yarnik
11.03.2012, 01:03
о! спасибо за расширенный ответ.
вроде начал соображать, ушел читать.

yarnik
11.03.2012, 02:07
пока сделал вот так, прошу проверить меня.

1. сначала мы ищем фирму, включается автокомплит

2. после удачного поиска, вызывается select, который выводит список сотрудников.
на странице у нас уже жестко прописана форма <select name="person" id="person"></select>, а от сервера соответственно получаем только
<option></option>
<option value="1">person1</option>
<option value="2">person2</option>
3. по умолчанию у нас пусто в <select>, а соответственно и выводить ничего не надо. а вот при выборе срабатывает .change(), которая отдает данные скрипту, для того что б он вытащил с базы более полную инфу о персоне.

$("#firms").autocomplete({
source: "ajax_firms.cgi",
select: function(event, ui){
$.ajax({
type: "GET",
url: "ajax_staff.cgi?firms="+(ui.item.id),
success: function(html){
$("#person").html(html);
}
});
}
});

$("#person").change(function(){
$.ajax({
type: "GET",
url: "ajax_person.cgi?person=" + $("#person").val(),
success: function(html){
$("#person_add").val(html);
}
});
});

рабочий пример можно посмотреть тут
http://www.ahost.com.ua/crm/index2.html

T-sh
11.03.2012, 05:14
лишний "мусор" на странице в виде пустых селектов.

в случае с динамикой стоит всегда использовать ".live"

yarnik
11.03.2012, 20:13
хорошо, а можно ли как то после генерирования списка $("#person").html(html);
узнать кто выбран как текущий и запустить $("#person").change(function(){
ну или ".live" если я переделаю динамический select