我在模式对话框上渲染局部视图时遇到2个问题 .
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>
搜索功能中的Ajax:
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>
任何帮助,将不胜感激 .
谢谢!
2 回答
1)它确实渲染,但问题是jquery模态大小没有't increase (that'为什么你可以在重新打开对话框时看到它) . 看到:Make JQuery UI Dialog automatically grow or shrink to fit its contents
2)可能是你在同一页面上有多个带有FirstName,LastName id的控件吗?
我怀疑这是完全相关的,并且与我的对话框是在构建dom之后由ajax呈现的部分视图这一事实有关 .
当我使用相同的对话框并将其移动到我的视图并使用HTML.RenderPartial时,然后在单击时显示对话框,它们都按预期开始工作 .