通過JQuery將表單響應加載到div AJAX

我正在開發用於文檔協作的應用程序。我可以加載部分的視圖和編輯模板，但發佈有1個小障礙。表單有些不同，因爲它們使用的是動作而不是href。響應正是我想要的（我可以使用chrome開發工具查看它），並且響應字符串將附加到正確的div，然後在ajaxComplete上移除。如果我將表單動作視爲href，除了正確的響應外，我還會得到一個缺失的模板500響應。通過JQuery將表單響應加載到div AJAX

任何人都知道最後一小步是如何獲得加載到DOM的表單響應？這是我的ajax成功函數：

$('section') 
.live('ajax:success', function(event, data, status, xhr) { 
    $('#' + response_str).html(data); 
});

值得一提的是，演出和編輯使用e.preventDefault()然後用HREF捕捉鏈接後。我不能用它來發布，因爲它會搞亂表單動作。

這裏是我的節目，編輯和發佈功能的好辦法。

// .live() because edit btn is an ajax loaded element 
$('[id^=edit_s]').live('click', function(e) { 
    e.preventDefault(); 
    target = $(this).attr('href'); 
    sectionID = $(this).attr('id').match(/[\d]+$/); 
    sectionLayer = $(this).attr('data-target'); 
    response_str = 'response_s' + sectionID; 
    appropriateDiv.addClass(response_str); 
    $("." + response_str).load(target); 
}); 

//this could stand to be less ambigious. select the actual form for example. 
$('[id^=publish_s]').live('click', function(e) { 
    target = $(this).closest('form').attr('action'); 
    alert(target); 
    appropriateDiv.addClass(response_str); 
    $(this).addClass('disabled'); 
    //$("." + response_str).load(target); // doesn't work! 
}); 

$('[id^=show_s]').live('click', function(e) { 
    target = $(this).attr('href'); 
    sectionID = $(this).attr('id').match(/[\d]+$/); 
    sectionLayer = $(this).attr('data-target'); // contains "#" 
    appropriateDiv = $('div.tab-pane' + sectionLayer); 

    // Don't need preventDefault() if tab since bootstrap does it 
    if($(this).attr('data-toggle') != "tab") { 
    e.preventDefault(); 
    appropriateDiv.removeClass('loaded'); 
    } 

    response_str = 'response_s' + sectionID; 
    if ($(appropriateDiv).hasClass('loaded')) { 
    //alert("Already loaded, bro"); 
    } else { 
    appropriateDiv.addClass(response_str + ' loaded');// ensure AJAX fills the right section 
    $("." + response_str).load(target); 
    } 
});

在此先感謝！

來源

2012-12-19 Archonic

原來是一個愚蠢的錯誤。在我的成功功能中，我選擇了ID而不是班級（告訴你這很愚蠢）。

顯示和編輯工作的原因是因爲包括將響應放入選定元素（duh）中。

來源

2012-12-19 18:40:44 Archonic

這個問題和答案仍然說明如何使用jquery ajax獲取表單響應到DOM。讓表單提交（不要使用'e.preventDefault（）'）並在ajax：success函數中使用'appropriateDiv.html（data）'。 – Archonic

通過JQuery將表單響應加載到div AJAX

回答

相關問題