Sinatra + Ajax加載動態內容

Question

我想創建一個頁面，並使用Ajax（JQuery）填充動態信息。該信息將來自我需要在其他URL中執行的各種GET。 我將使用Sinatra + JQuery來做到這一點，但是由於我的WEB體驗幾乎爲空，並且沒有任何想法如何做到這一點。 對此的必要條件是：

• 每次GET完成時，頁面上應該會出現一行新信息。
• 如果GET無法完成，頁面上會顯示默認信息。

我的想法到目前爲止是做這樣的事情：

• 有我的控制器執行線程內每個GET。
• 每次一個線頭，成功與否，我告知結果的視圖和渲染的部分
• 我會盡可能多的部分，因爲我需要（每得到我所必須做）
• 的我第一次加載頁面我填寫默認的信息，他們通過我與AJAX成功的GET請求

更新這似乎不是正確的方法，所以我問別人已經做過類似的事情或有更多的經驗對此有所幫助。

Answer 1

從一個簡單的get('/'){}路由開始，該路由保存默認消息（或任何其他GET路由）。然後你有你想要在默認路由上顯示的其他GET路由。在Sinatra中，您可以使用request.xhr?來檢查請求是否是xhr請求。如果您有xhr請求，則將json值返回給您的視圖，否則請拒絕請求或使用正確的html呈現視圖。這是在你的sinatra後端。在您的視圖中，您可以使用JQuery或任何其他JS庫或純JS處理異步數據請求。您可以使用JQuery中的ajax函數來請求路由中的數據，然後將它們添加到DOM中。就這麼簡單:)現在您將不得不在JQuery網站上調查如何製作ajax請求以及如何將數據追加到現有的DOM。這裏的所有都是它的。