Построение динамически созданного Clickable Divs JQuery Ajax
Мне нужна помощь jQuery ajax. В настоящее время у меня есть основной контент div, который заполняется ajax-вызовом XML-файла. Файл XML генерируется из результирующего набора БД. Это все работает нормально. Вызов ajax запускается нажатием кнопки, но я хочу это изменить.
У меня есть другой div, который я заполнил списком названий. Я хочу, чтобы при щелчке по названию основной контент div должен обновляться данными, относящимися к этому заголовку. Мне было интересно, что будет лучшим способом сделать это. Должен ли я создать интерактивный div, который делает вызов ajax? и если да, то как мне определить, какой div был нажат в коде для основного содержимого div. Я надеюсь, что это имеет смысл...... вот мой код для заполненного списка
$(document).ready(function() {
$("#getData").click(function() {
var $title = "";
$.get("phpAjaxMovieListingTotal.php", function(theXML) {
$('row',theXML).each(function(i) {
$title = $(this).find("Title").text();
});
$("#movieListingContentDiv").html($title);
});
});
});
1 ответ
Хорошо, для получения списка интерактивных элементов div, загруженных из xml, посмотрите демонстрационную версию. Демо
Вот код:
function movieTitle_Clicked (title)
{
alert("Movie title '"+title+"' clicked");
}
function GetMovies ()
{
$.post("THEXML.php", function(data){
$('row title',data).each(function(i){
var title = $(this).text();
$('#container').append('<div onClick="javascript:movieTitle_Clicked(\''+title+'\')">'+title+'</div>');
});
}, 'xml');
}
$(document).ready(function() {
GetMovies();
});