Как мне решить проблему с доступностью элементов jquery?

Question

[aumarov111]

$('.filter fieldset .expand .sended-param').on('click', function() {
	$(this).find("input[type=radio]").prop('checked', true);
	postAjax();
});


function postAjax() {
	var template = $("#products").html();
	var filter = $("#filter").html();
	$.ajax({
		type: "post",
		url: "/filter",
		data: $(".filter form").serialize(),
		success: function(result) {
			$('.filter fieldset .expand .sended-param').on('click', function() {
	            $(".products").html(_.template(template,{ result:result, manufacturers:manufacturers, country:country }));
	            $(".presets").html(_.template(filter,{ result:result, manufacturers:manufacturers, country:country }));
	            $.ajax({
					type: "post",
					url: "/filter",
					data: $(".filter form").serialize(),
					success: function(result) {
			            $(".products").html(_.template(template,{ result:result, manufacturers:manufacturers, country:country }));
			            $(".presets").html(_.template(filter,{ result:result, manufacturers:manufacturers, country:country }));
			        }
				});
			});
        }
	});
}

Answer 1

[Александр Хиренко]

Ну а html где? Как Вы подгружаете контент, динамически?
Если да, то навешивайте событие после того как контент загрузился.
А лучше покажите нам Ваш код на jsfiddle.net

Comments

[aumarov111]

html вставил. В скрипте только консоль лог. Все эти фореачи это функции шаблонизатора php и они достаются из базы данных(не аяксом)

[Александр Хиренко]

@aumarov111 jsfiddle.net/s2FwL ну вот все работает. Вообще, навешивать динамические события - плохой тон, тем более если у вас контент статический, правильно будет так jsfiddle.net/s2FwL/1

[aumarov111]

@Satanpit контент будет подгружаться ajax'ом иначе не нужно было мне

[aumarov111]

не работает

[aumarov111]

z-index даже на 999 поставил в инспекторе кода все норм

[Александр Хиренко]

@aumarov111 ну как не работает если в примере все работает :) Говорю же, если используете AJAX, то навешивать событие нужно в success функции. Покажите код в котором не работает.

[aumarov111]

@Satanpit поправлюсь. Теперь это работает, но не работает на вновь созданых элементах с помощью ajax. В инспекторе кода html присутсвует

[aumarov111]

@Satanpit код вставил

[Александр Хиренко]

@aumarov111 Повторюсь, если используете AJAX, то навешивать событие нужно в success функции.

[aumarov111]

@Satanpit и как это сделать?

[Александр Хиренко]

@aumarov111 Навешиваете событие после вставки кода.

success: function(data) {
            $(".presets").html(_.template(template,{ data:data }));
            
            $('.filter fieldset .expand').on('click', function() {
		console.log("sss");
	     });
}

[aumarov111]

@Satanpit у меня 2 аякс запроса отправляеются, один получает фильтры а другой продукцию. я обновил код в вопросе, он подвисает

[aumarov111]

с каждым кликом на категории он отправляет все больше и больше запросов

[Александр Хиренко]

@aumarov111 как у Вас все жестоко :)
Во-первых вынесите AJAX в отдельную ф-ю, у Вас она дублируется 3 раза, во-вторых, не понимаю логики в коде, зачем навешивать событие на блок, если вам нужно навешивать событие на чекбоксы, понятно что подвисает, у Вас куда не кликни сразу выполняется запрос.

[aumarov111]

@Satanpit обновил код еще раз. Как правильно сделать? все равно с каждым разом на клик по категории больше и больше запросов

[Павел Соловьёв]

unbind события делайте перед on click

[aumarov111]

@pavel_salauyou а в каком месте мне его прописать? Я сделал и там и там пробовал чет не то

[Павел Соловьёв]

перед $('.filter fieldset .expand').on('click', а вообще код с document on click должен работать 100%, что-то у вас не то. Навешивать событие в success неправильно, как видите есть проблемы.

[Александр Хиренко]

@pavel_salauyou неправильная сама реализация, а навешивание в succes правильное решение. Или Вы предлагаете навешивать динамическое событие? Почитайте о нем и поймете почему этот плохая идея.

Answer 2

[Павел Соловьёв]

попробуйте $(document).on('click', ...);

Comments

[aumarov111]

нет не работает

[Павел Соловьёв]

ну попробуйте убрать .filter fieldset .expand и оставить только .expand

[aumarov111]

@pavel_salauyou не работает

[Павел Соловьёв]

$(document).on('click', '.sended-param', function() {
postAjax();
});

100% должно работать.