jquery無法正確更新車把局部視圖（express，node.js）

已更新文件以顯示如何使其正常工作。我在下面接受的答案並沒有顯示太多的代碼，一切都以評論結束。所以爲了簡單起見，我在這裏展示了正確的代碼（我的原始代碼有3個錯誤）。jquery無法正確更新車把局部視圖（express，node.js）

我用Express和Handlebars使用Node.JS。我在更新特定的div以及發送數據時遇到了麻煩。這是有效的。

在我的視圖目錄中有：index.handlebars，view1.handlebars，temp.handlebars。

裏面view1.handlebars，我有一個button：

<button type="button" id="btn-here" data-id="{{data.uniqueId}}"><a href="../update_this">Update This</a></button>

和div：

<div id="sectional"> 
    {{> partial}} 
</div>

當有人點擊button，我要更新的截面div。所以使用jQuery像這樣：

$('#btn-here').on('click', function(event) { 
    event.preventDefault(); 
    var id_num = $(this).data('id'); //id_num is correct 

    $.get("/temp/" + id_num, function(res) { 
     var updated_html = res; 
     $('#sectional').html(updated_html); 
    }); 
});

我允許了jQuery找出通過temp.handlebars文件：

router.get('/temp/:id', view1.showstuff);

而且view1.showstuff函數內部：

showstuff: function(req, res) { 
      res.locals.model = model; 
      res.render('temp/' + id, {layout: false}); 
     };

這現在沿着視圖數據發送並僅更新jquery調用中指定的視圖。

感謝您對下方用戶的幫助！

來源

2015-04-28 lynvie

如果您在瀏覽器中訪問「http：// yoursite.com/temp.html」，會發生什麼情況？你只是得到'temp.html'或整個'index.html'內容的內容？ – GregL

那麼，因爲我用express（＆handlebars）使用Node.JS，所以我得到錯誤消息，說瀏覽器不能「GET /temp.html」。我沒有將它作爲我的routes.js文件中的路線。 – lynvie

當您請求'temp.html'時，Chrome devtools的Network標籤會返回什麼結果？ 'temp.html'是你期望得到的實際文件嗎？如果是這樣，您將需要配置路由以允許您通過某個URL獲取它。 – GregL

您也需要一臺路由器的處理程序如下

app.get('/temp.html', function (req, res, next) { 
    res.render('temp', {layout: false}); 
});

，或將您的temp.html公共文件夾中，但那麼你就不能使用{{>泛音}}作爲其不受視圖引擎處理

來源

2015-04-28 06:28:36 Molda

你的意思是完全擺脫jquery調用，只使用渲染？但是，它是如何知道更新部分div？ – lynvie

不，jQuery沒問題。但是對於jquery $ .get（「temp.html」...來工作，您需要app.get（'/ temp.html'...服務器上的處理程序或者如果temp.html是靜態HTML文件，您可以將其放置它在公共文件夾 – Molda

好吧，爲了讓事情起作用，我最初在公共文件夾中有temp.html，但我想以正確的方式做事，所以我把文件放回到views目錄中，然後添加了這個res。我得到了相同的行爲，索引頁面出現在我的#sectional div！我打印從jquery調用「res」的輸出，它絕對加載index.handlebars，而不是我的temp.handlebars文件。 – lynvie

jquery無法正確更新車把局部視圖（express，node.js）

回答

相關問題