AJAX成功刷新CFDIV

我有一個將數據添加到我的ColdFusion數據庫的AJAX調用。AJAX成功刷新CFDIV

<!---Script to add dashboard link --->  
      <cfoutput> 
      <script> 
      $(function(){ 
      //Add a new note to a link 
      $("##add_dashboard_links").submit(function(){ 
       // prevent native form submission here 
        $.ajax({ 
         type: "POST", 
         data: $('##add_dashboard_links').serialize(), 
         url: "actionpages/add_dashboard_link.cfm", 
         beforeSend: function(){ 
          $('.loader').show(); 
         }, 
         complete: function(){ 
          $('.loader').hide(3000); 
         }, 
         success: function() { 
          $("##noteDiv").load('templates/dashboard_notes.cfm?techID=#techID#'); 
          $("##addNoteResponse").html(''); 
          $("##link_description").val(''); 
          $("##link_url").val(''); 
          $("##notes").val(''); 
          $("##addNoteResponse").append("Link successfully added."); 
          }  
        }); 
        return false;   
       }); 
      }); 
      </script> 
      </cfoutput>

我也有結合一些其他內容

 <!---Dashboard Links ---> 
     <div id="noteDiv" bind="url:templates/dashboard_notes.cfm"> 
     </div>

這裏是我的模態代碼中找到我的模板頁面上包含這個AJAX腳本引用（這個插件可以在這裏找到的形式CFDIV https://github.com/kylefox/jquery-modal）：

<!--- Link to open the modal to add a new dasboard link ---> 
     <div id="DashboardLinks" style="display:none;"> 
     <h3>Add a new dashboard link:</h3> 
     <form id="add_dashboard_links"> 
      <table width="100%" id="dashboard_table" border="0" cellpadding="5"> 

       <tr> 
       <td colspan="3"></td> 
       </tr> 
       <tr> 
       <td>Link Description:</td> 
       <td colspan="2"><input type="text" name="link_description" id="link_description" required="yes" message="Please enter the Link Description"/></td> 
       </tr> 
       <tr> 
       <td>Link URL:</td> 
       <td colspan="2"><input type="text" name="link_url" id="link_url" required="yes" validate="url" message="Please enter the Link URL with http:// -or- https://"/></td> 
       </tr> 
       <tr> 
       <td>Link Notes:</td> 
       <td colspan="2"><textarea id="notes" name="notes" cols="" rows="">&nbsp;</textarea></td> 
       </tr> 
       <tr> 
       <td colspan="3"><input type="submit" name="button" id="button" value="Add Link" /> 
      <input type="hidden" name="link_hidden" value="1"><br /> 
       <div class="loader"><img class="loading-image" src="images/loading.gif" /></div> 
       <div class="response" id="addNoteResponse"></div> 
      </td> 
       </tr> 
      </table> 
      </form> 
      </div>

有沒有辦法一次我收到了AJAX成功刷新此CFDIV標籤？

謝謝。

來源

2014-10-31 Brian Fleishman

cfdiv在服務器端執行，其中Ajax請求在客戶端執行。如果你想刷新cfdiv，你必須做出另一個Ajax請求，並在相應的div中重新設置響應。 – 2014-10-31 17:48:41

你想要那個div的新內容是什麼？ – 2014-10-31 19:43:33

我正在從cfquery輸出數據。與我的腳本添加到的數據相同。所以我基本上試圖用我新添加的記錄刷新我的cfquery的輸出。 – 2014-10-31 19:59:16

請勿使用cfdiv（或任何其他ColdFusion UI功能）。既然你已經在使用jQuery，那就堅持下去。使用普通的舊的HTML <div>並保持相同的ID。

<div id="noteDiv" bind="url:templates/dashboard_notes.cfm"></div>

然後，在你的AJAX調用，將其添加到success塊

$("#noteDiv").load('templates/dashboard_notes.cfm');

您還需要添加該行的其他地方獲取內容最初加載。

來源

2014-11-01 14:12:13

Scott是100％的權利。 CF的UI工具非常類似於你不能把重量放在很多的柺杖上。他們支持你的第一步，但是當你不願意做或者需要一些操縱和加強時，你會後悔的。偶爾你會發現自己有更多的時間進入柺杖柺杖，而不是如果你剛剛學會走路。 – 2014-11-01 15:37:19

太棒了。我會嘗試一下，然後回去。 – 2014-11-01 18:46:27

這似乎很好，我已經使用編輯後的代碼更新了我的帖子。儘管如此，還是有一個小問題出現。在我的模板頁面上，我的表單位於模式中。該模式來自這裏找到的插件[鏈接]（https://github.com/kylefox/jquery-modal）。問題是，現在腳本完成後，它會按預期更新DIV，但會使模式自動消失，但我的瀏覽器窗口仍具有不透明疊加層。如果我隨後點擊任何地方，不透明度將消失。但我仍然希望模態可見，以便用戶可以選擇關閉它。有任何想法嗎？ – 2014-11-01 20:46:43

AJAX成功刷新CFDIV

回答

相關問題