我有一个asp.net页面,它包含许多选项卡和日期时间选择器。
当用户从日期时间选择器中选择一个日期并单击更新按钮时,它会执行该操作但它不会将用户返回到同一选项卡。
HTML代码
<ul class='tabs'>
<li><a href='#tab1'>Production</a></li>
<li><a href='#tab2'>Page2</a></li>
<li><a href='#tab4'>Page3</a></li>
<li><a href='#tab6'>Page4</a></li>
</ul>
<div id='tab1'>
<hr />
<div class="ProductionDiv">
<label class="ProductionLabel">Production Data</label>
@{
using (Html.BeginForm("UpdateProductionData", "Home", FormMethod.Post))
{
<h3>Date :</h3> <input type="text" id="dp4" name="dp4"/>
<input type="submit" value="Update"/>
}
}
</div>
<div id='tab2'>
<hr />
<div class="ProductionDiv">
<label class="ProductionLabel">Production Data</label>
@{
using (Html.BeginForm("UpdateProductionData", "Home", FormMethod.Post))
{
<h3>Date :</h3> <input type="text" id="dp4" name="dp4"/>
<input type="submit" value="Update"/>
}
}
</div>
<div id='tab3'>
<hr />
<div class="ProductionDiv">
<label class="ProductionLabel">Production Data</label>
@{
using (Html.BeginForm("UpdateProductionData", "Home", FormMethod.Post))
{
<h3>Date :</h3> <input type="text" id="dp4" name="dp4"/>
<input type="submit" value="Update"/>
}
}
</div>
<div id='tab4'>
<hr />
<div class="ProductionDiv">
<label class="ProductionLabel">Production Data</label>
@{
using (Html.BeginForm("UpdateProductionData", "Home", FormMethod.Post))
{
<h3>Date :</h3> <input type="text" id="dp4" name="dp4"/>
<input type="submit" value="Update"/>
}
}
</div>
C#代码 我做我需要做的事情并返回索引表单是否有任何方法来指定返回哪个选项卡。 返回视图(“索引”);
答案 0 :(得分:4)
如何使用隐藏字段+ jquery,如下所示:
更新ViewModel并添加int
属性,例如LastTabIndex,然后在表单中添加隐藏字段:
@Html.HiddenFor(m=>m.LastTabIndex)
然后使用jquery:
<script type="text/javascript">
$(function() {
$(".tabs").tabs({
create: function() {
var index = 0;
if (Modernizr.localstorage) {
if (localStorage.getItem("LastTabIndex") === null) {
localStorage.setItem("LastTabIndex", 0);
} else {
index = localStorage.getItem("LastTabIndex");
}
} else {
index = $('#LastTabIndex').val();
}
$(".tabs").tabs("option", "active", index);
},
activate: function() {
var sel = $('.tabs').tabs('option', 'active');
$("#LastTabIndex").val(sel);
if (Modernizr.localstorage) {
localStorage.setItem("LastTabIndex", sel);
}
}
});
});
</script>
编辑:我已更新我的代码以使用混合解决方案(localstorage,如果不支持本地存储,则使用隐藏字段)。
希望这有帮助!
此致 乌罗什