Question

我有一个AJAX调用，它将数据添加到我的ColdFusion数据库。

 <!---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>

我还有一个与其他内容绑定的CFDIV

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

这是我的模板页面上的模态代码，其中包含此AJAX脚本引用的表单（此插件位于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 SUCCESS，有没有办法刷新这个CFDIV标签？

感谢。

Answer 1

不要使用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' );

您还需要在其他地方添加该行以获取最初加载的内容。

在AJAX成功时刷新CFDIV

1 个答案: