Динамическая подгрузка контента Ajax

12
Zion-i2
На сайте с 10.06.2011
Offline
108
5051

Драсти! Есть скрипт

<script type="text/javascript">

$(document).ready(function(){
$('#getEdit').click(function(){
$.ajax({
url: "getEdit.php",
cache: false,
beforeSend: function() {
$('#divEdit').html('<img src="images/loader.gif">');
},
success: function(html){
$("#divEdit").html(html);
}
});
return false;
});
});
</script>

И есть контейнер

<div id="divEdit"></div>

И есть ссылка

<a href="#" id="getEdit">Редактировать</a>

По нажатию на которую подгружается инфа с файла getEdit.php

Мне же нужно подгружать инфу с этого файла по айди

url: "getEdit.php?id=1",

Для этого нужно присвоить каждой ссылке айди, как-то так

<a href="#1" id="getEdit">Редактировать</a>

<a href="#2" id="getEdit">Редактировать</a>

<a href="#3" id="getEdit">Редактировать</a>

Или как?

И от сюда второй вопрос: как потом перехватить этот айди и передать его в фаил getEdit.php?

То есть, что писать в этой строчке после равно? url: "getEdit.php?id=",

Что-то нарыл в инете, понял лишь что как-то так нужно

url: "getEdit.php?id=+ $(this).attr('id')",

но плохо в этом разбираюсь, помогите пожалуйста оптимизировать код под описанные выше нужды, буду благодарен.

bay_ebook
На сайте с 28.05.2010
Offline
111
#1

js меняем на

<script type="text/javascript">

function toAtjax(id){
$.ajax({
url: "getEdit.php?id=" + id,
cache: false,
beforeSend: function() {
$('#divEdit').html('<img src="images/loader.gif">');
},
success: function(html){
$("#divEdit").html(html);
}
});
return false;
};
</script>

а на ссылках пишем:


<a href="javascript:void(0);" onclick="toAtjax(1);">Редактировать</a>
<a href="javascript:void(0);" onclick="toAtjax(2);">Редактировать</a>
<a href="javascript:void(0);" onclick="toAtjax(3);">Редактировать</a>

ПС - id="getEdit" на странице может быть только один ,посему ваш вариант изначально неверный, на крайних хоть бы на class вешали обработчик.

Нужен прогер на php+mysql+понимание чужего кода? (/ru/forum/540660) Вам сюда PHP-шаман (http://php-shaman.pw/)
Zion-i2
На сайте с 10.06.2011
Offline
108
#2

Спасибо, а в

<a href="javascript:void(0);" onclick="toAtjax(<?php echo $id; ?>);">Редактировать</a>

А в void(0);" тоже нужно айди добавить <?php echo $id; ?> или там везде нули должны быть? Просто работает и так и так, но как правильно?

bay_ebook
На сайте с 28.05.2010
Offline
111
#3
Zion-i2:
А в void(0);" тоже нужно айди добавить <?php echo $id; ?> или там везде нули должны быть? Просто работает и так и так, но как правильно?

javascript:void(0); нужен для того, что бы страницу не перегрузило, можно например использовать и # но лучше js

Можно и просто onclick="toAtjax(1);" заменить на onclick="return toAtjax(1);" и в href писать все что угодно, при условии, что функция будет возвращать false

C
На сайте с 04.02.2005
Offline
277
#4
нужен для того, что бы страницу не перегрузило, можно например использовать и # но лучше js

Аргументируйте, а если... js отключен? (не для флуда, причина отключения может быть разная)

bay_ebook
На сайте с 28.05.2010
Offline
111
#5
Chukcha:
Аргументируйте, а если... js отключен? (не для флуда, причина отключения может быть разная)

js может быть и отключен, все ровно будет работать. А лучше за # тем, что есть вариант, когда браузер распознает # как запрос к прокрутке страницы в начало. Расписывать не буду, это связано с якорями.

C
На сайте с 04.02.2005
Offline
277
#6

При отключенном js уже пофик, куда перебросит.

Но зачем нагружать обработчик событий, если, так будет тоже работать

<a href="javascript:toAtjax(1)"

bay_ebook
На сайте с 28.05.2010
Offline
111
#7
Chukcha:

Но зачем нагружать обработчик событий, если, так будет тоже работать
<a href="javascript:toAtjax(1)"

Будет работать. Вот только href есть только у a, onclick - можно повесить на любой элемент. Да и читаемость кода падает.

Кстати # будет заносится в историю, и мешать юзеру, если нужно back нажимать.

Chukcha:
При отключенном js уже пофик, куда перебросит.

Ну далеко не всегда пофик.

C
На сайте с 04.02.2005
Offline
277
#8
Да и читаемость кода падает.

Спорно...

Кстати # будет заносится в историю, и мешать юзеру, если нужно back нажимать

.

Бесспорно, если js отключен.

но преимущество хеша перед void не вижу.

Тут нужно все же понять, что хочет ТС.

а хочет он, наверное, иметь возможность что-то редактировать на лету зарегистрированным пользователем.

Но в таком случае, обработчики нужно выносить из html кода

и правильно подходить к структуре (семантике).

ведь идентификатор ссылки (ресурса для редактирования) можно запихнуть не только в тег id, но и в rel, или же привязать к родительскому блоку... и т.д.

[Удален]
#9
bay_ebook:
onclick - можно повесить на любой элемент

вот это и надо использовать вместе с

bay_ebook:
на class вешали обработчик

т.е. что-то вида

<span class="getEdit_1">Редактировать</span> <span class="getEdit_2">Редактировать</span> <span class="getEdit_3">Редактировать</span> ....
$("span[class^='getEdit']").click(function(){
.....
C
На сайте с 04.02.2005
Offline
277
#10

burunduk, согласен.

getEdit_1 - и есть идентификатор ресурса.

12

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий