與jQuery的局部視圖ajax不會渲染

我有2個問題在模態對話框上呈現局部視圖。與jQuery的局部視圖ajax不會渲染

1）我使用ajax後，它調用操作，返回部分視圖與聯繫人列表，我更新div，但它不顯示。如果我關閉並重新加載對話框，則會顯示。

2）在部分視圖對話框上有文本框元素，jquery選擇器找到但val（）爲空。

調試它一路通過，很好......只是不呈現。

模式：

@model CRM.Model.Shared.ContactSearchModel 

<div id="divSearchContactModal" class="modal fade" role="dialog"> 
    <div class="modal-dialog modal-lg"> 
     <div class="modal-content"> 
      <form id="contactSearchForm" class="form-horizontal"> 
       <div class="modal-header"> 
        <h4 class="modal-title">Search/Add Contact</h4> 
       </div> 
       <div class="modal-body"> 
        <div class="row"> 
         <div class="col-md-12"> 
          <div class="form-group"> 
           <div class="col-md-4"> 
            @Html.LabelFor(model => model.FirstName, new { @class = "control-label" }) 
            @Html.EditorFor(model => model.FirstName) 
           </div> 
           <div class="col-md-4"> 
            @Html.LabelFor(model => model.LastName) 
            @Html.EditorFor(model => model.LastName) 
           </div> 
           <div class="col-md-2"> 
             <button id="contact-search-button" type="button" onclick="Search();" class="btn btn-mercury-modal-search" style="vertical-align: middle">Search</button> 
            </div> 
           </div> 
          </div> 
         </div> 
        </div> 

        <div id="divSearchResultsContent"> 
        </div> 
       </div> 
      </form> 
     </div> 
    </div> 
</div>

阿賈克斯的搜索功能：

function Search() { 

    //these return empty text for val() !!! 
    var firstName = $("#FirstName").val(); 
    var lastName = $("#LastName").val(); 

    $.ajax({ 
     type: "POST", 
     url: "/ContactSearch/Search/", 
     data: { FirstName: firstName, LastName: lastName }, 
     success: function (data) { 
      $('#divSearchResultsContent').html(data); 
     }, 
     error: function (jqXhr, textStatus, errorThrown) { 
      console.log(textStatus, errorThrown); 
     } 
    }); 
    return true; 
}

控制器：

[HttpPost] 
    [OutputCache(Duration = 0)] 
    public ActionResult Search(ContactSearchModel model) 
    { 
      model.FirstName = "Daffy"; 
      model.LastName = "Duck"; 

      var response = _contactManager.SearchContacts(new SearchContactsRequest 
      { 
       FirstName = model.FirstName, 
       LastName = model.LastName 
      }); 

      if (!response.IsSuccess) 
      { 
       throw new Exception(response.ErrorMessage); 
      } 

      model.SearchFinished = true; 
      model.ContactList = response.ContactList; 
      model.SearchCount = response.ContactList.Count; 

      return PartialView("_ContactSearchResults", model); 

    }

部分信息查看_ContactSearchResults

@using CRM.Entities.Common 
@model CRM.Model.Shared.ContactSearchModel 
<table class="table table-responsive"> 
    <thead> 
     <tr> 
      <th> 
       First Name 
      </th> 
      <th> 
       Last Name 
      </th> 
      <th> 
       DBA Name 
      </th> 
      <th> 
       Address 
      </th> 
      <th> 
       City 
      </th> 
      <th> 
       State 
      </th> 
      <th> 
       Zip 
      </th> 
      <th> 
       Phone 
      </th> 
      <th> 
      </th> 
    </thead> 
    <tbody> 
     @if (Model.SearchFinished) 
     { 
      if (Model.SearchCount > 0) 
      { 
       foreach (Contact contact in Model.ContactList) 
       { 
        <tr> 
         <th> 
          @Html.Label(contact.FirstName) 
         </th> 
         <th> 
          @Html.Label(contact.LastName) 
         </th> 
         <th> 
          @Html.Label(contact.DbaName) 
         </th> 
         <th> 
          @Html.Label(contact.ContactAddress) 
         </th> 
         <th> 
          @Html.Label(contact.ContactCity) 
         </th> 
         <th> 
          @Html.Label(contact.ContactState) 
         </th> 
         <th> 
          @Html.Label(contact.ContactZipCode) 
         </th> 
         <th> 
          @Html.Label(contact.PhoneNumber) 
         </th> 
         <th> 
          @*@Html.ActionLink("Select", "Select", "ContactSearch", new { EntityId = Model.EntityId, ContactEntityId = @contact.ContactId, RoleId = Model.RoleId }, null)*@ 
         </th> 
        </tr> 
       } 
      } 
      else 
      { 
       <tr> 
        <th> 
         "No contacts found." 
        </th> 
       </tr> 
      } 
     } 
    </tbody> 
</table>

任何幫助，將不勝感激。

謝謝！

來源

2015-08-27 Dan Murphy

你可以在jsfiddle上覆制相同的http：//jsfiddle.net並生成html（不要在jsfiddle中使用asp.net代碼） – dreamweiver

1）它渲染，但問題是，jQuery的模態大小不增加（這就是爲什麼你可以看到它重新打開對話框）。看到這個：Make JQuery UI Dialog automatically grow or shrink to fit its contents

2）可能是你有多個控件與FirstName，姓在同一頁上的ID？

來源

2015-08-27 11:06:56

感謝您的回覆。我檢查了呈現的返回的html，即使尺寸太小，html也不在對話框中。 –

double檢查了我們沒有在名字的2個控件上使用相同的ID。甚至把名字改爲加倍確定，但沒有骰子。 –

我懷疑這是所有相關的，並與我的對話是建立dom後由ajax呈現的局部視圖的事實有關。

當我使用相同的對話框並將其移動到我的視圖並使用HTML.RenderPartial，然後在點擊時顯示對話框，它就會按預期開始工作。

來源

2015-08-27 16:37:34

與jQuery的局部視圖ajax不會渲染

回答

相關問題