我正在尝试使用替换div的ajax调用，但我的多选控件正在失去其样式。
我有一个调用我的部分视图的视图：
@Html.Partial("_Languages",Model)
在此视图中，我还引用了unobstrusive-ajax.min.js文件和相关的css：
<link href="~/SmartAdmin/scripts/Test/css/bootstrap-multiselect.css" rel="stylesheet" /> //This is a the top of my view
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script> //This is at the bottom of my view
我有一个脚本文件，它引用了从我的布局页面调用的jquery和jquery-ui文件。
在我的部分视图中，我使用Ajax.BeginForm及其选项来替换“listofLanguages”div：
@model AccountRegistrationModel
<div id="listofLanguages">
<article class="col-sm-12 col-md-12 col-lg-6">
<!-- Widget ID (each widget will need unique ID)-->
<div class="jarviswidget jarviswidget-color-darken" id="wid-id-0" data-widget-editbutton="false" data-widget-deletebutton="false" data-widget-togglebutton="false">
<!-- widget options:
usage: <div class="jarviswidget" id="wid-id-0" data-widget-editbutton="false">
data-widget-colorbutton="false"
data-widget-editbutton="false"
data-widget-togglebutton="false"
data-widget-deletebutton="false"
data-widget-fullscreenbutton="false"
data-widget-custombutton="false"
data-widget-collapsed="true"
data-widget-sortable="false"
-->
<header>
<span class="widget-icon"> <i class="fa fa-table"></i> </span>
<h2>Languages </h2>
</header>
<!-- widget div-->
<div>
<!-- widget edit box -->
<div class="jarviswidget-editbox">
<!-- This area used as dropdown edit box -->
</div>
<!-- end widget edit box -->
<!-- widget content -->
<div class="widget-body no-padding">
<div class="widget-body no-padding">
@{
var options = new AjaxOptions()
{
//LoadingElementId = "loadingDisplay",
HttpMethod = "POST",
InsertionMode = InsertionMode.ReplaceWith,
UpdateTargetId = "listofLanguages"
//OnBegin = "ChangeButtonText"
};
}
@using (Ajax.BeginForm("SaveLanguage", "Account", options, new { @id = "ppl", @class = "smart-form" }))
{
@Html.HiddenFor(m => m.UserId)
@Html.HiddenFor(m => m.Email)
TempData["email"] = Model.Email;
<fieldset>
<div class="row">
<section class="col col-6">
<div class="form-group">
<select id="Language" name="Language" style="width:100%" class="select2" value="@Model.Language">
@foreach (var languagemetro in @Model.LanguageMetrosList)
{
<optgroup label="@languagemetro.LanguageMetroName">
@foreach (var language in Model.LanguageList)
{
if (@languagemetro.pkiLanguageMetroID == @language.fkiLanguageMetroId)
{
if (@language.Language == Model.Language)
{
<option value="@language.Language" selected="selected">@language.Language</option>
}
else
{
<option value="@language.Language">@language.Language</option>
}
}
}
</optgroup>
}
</select>
</div>
</section>
<section class="col col-6">
<select id="ddlReadWriteSpeak" name="SelectedReadWriteSpeak" multiple="multiple">
<option value="Read">Read</option>
<option value="Write">Write</option>
<option value="Speak">Speak</option>
</select>
<br />
<br />
<button type="submit" class="btn btn-success btn-xs pull-right">
Save Language
</button>
@*<div class="pull-right">
@Html.ActionLink("Save Language", "SaveLanguage", "Account", new { userEmail = Model.Email, iLanguageId = $('Languages').val() }, new { @class = "btn btn-success btn-xs" })
</div>*@
</section>
</div>
</fieldset>
}
</div>
<table id="dt_basic" class="table table-striped table-bordered table-hover" width="100%">
<thead>
<tr>
<th style="width:5%"></th>
<th data-class="expand"><i class="text-muted hidden-md hidden-sm hidden-xs"></i> Language</th>
<th data-hide="phone" style="text-align:center"><i class="text-muted hidden-md hidden-sm hidden-xs"></i> Read</th>
<th data-hide="phone,tablet" style="text-align:center"><i class="txt-color-blue hidden-md hidden-sm hidden-xs"></i> Write</th>
<th data-hide="phone,tablet" style="text-align:center"><i class="txt-color-blue hidden-md hidden-sm hidden-xs"></i> Speak</th>
<th></th>
</tr>
</thead>
<tbody>
@{
int a = 0;
foreach (var item in Model.LanguagesViewModelList.OrderBy(x => x.PriorityLevel))
{
a++;
<tr>
<td>
@if (a == Model.LanguagesViewModelList.Count())
{
<a href="@Url.Action("LanguagePriorityUp", new { pkiRes_LanguageId=item.Res_LanguageId })">
<span class="fa fa-toggle-up"></span>
</a>
}
else if (item.PriorityLevel > 1)
{
<a href="@Url.Action("LanguagePriorityUp", new { pkiRes_LanguageId=item.Res_LanguageId })">
<span class="fa fa-toggle-up"></span>
</a>
<a href="@Url.Action("LanguagePriorityDown", new { pkiRes_LanguageId=item.Res_LanguageId })">
<span class="fa fa-toggle-down"></span>
</a>
}
else if (item.PriorityLevel == 1)
{
<a href="@Url.Action("LanguagePriorityDown", new { pkiRes_LanguageId=item.Res_LanguageId })">
<span class="fa fa-toggle-down"></span>
</a>
}
</td>
<td>@item.Language</td>
<td style="text-align:center">
@if (item.Read == "Yes")
{
<span class="fa fa-check"></span>
}
else
{
<span class="fa fa-close"></span>
}
</td>
<td style="text-align:center">
@if (item.Write == "Yes")
{
<span class="fa fa-check"></span>
}
else
{
<span class="fa fa-close"></span>
}
</td>
<td style="text-align:center">
@if (item.Speak == "Yes")
{
<span class="fa fa-check"></span>
}
else
{
<span class="fa fa-close"></span>
}
</td>
<td>
@*<a href="#" id="dialog_link" class="btn btn-danger btn-xs">
<span class="fa fa-trash-o"></span>
</a>*@
<a href="@Url.Action("DeleteLanguage", new { pkiRes_LanguageId = item.Res_LanguageId })">
<span class="fa fa-trash-o"></span>
</a>
@*@Html.ActionLink("Delete","Delete", new { employmentId = item.pkiEmploymentDetailID, userId = Model.fkiUserID })*@
@*<button type="submit" onclick="deleteEmployment('@item.pkiEmploymentDetailID')" class="btn btn-xs btn-danger text-center">
<span class="fa fa-trash-o"></span>
</button>*@
</td>
</tr>
}
}
</tbody>
</table>
</div>
<!-- end widget content -->
</div>
<!-- end widget div -->
</div>
<!-- end widget -->
</article>
</div>
我错过了什么，我的多选控件没有通过css？
修改 所以使用firefox并查看控制台日志，它没有显示任何内容，但使用chrome我得到了这个错误：
Uncaught TypeError: Cannot read property 'fn' of undefined
我怀疑是因为我的multi-select.js文件在ajax调用之后没有被提取，但我不知道如何在ajax调用之后包含它？
如果我遗漏任何信息，请告诉我。
答案 0 :(得分：0)
所以我无法找到这个特定问题的解决方案，多重选择从未刷新过。我甚至尝试过destroy属性，没有任何效果。
我最终做的是将mutiselects留在视图中，部分视图包含我的表格，我只是在局部视图中刷新了表格。