所以我有一个清单/任务管理器类应用程序,基本上使用模型从数据库中提取一堆字符串值,然后将其传递给使用展开/折叠图案表的视图。最终用户修改器超出展开/折叠状态的唯一元素是项目状态的掺杂列表。
客户基本上只想在页面底部的一个按钮更新用户更改的所有行,而不是每行的更新按钮。所以我的目标是尝试创建所述按钮。至于View代码片段,我已经尝试过使用Html.BeginForm了,但是还无法弄清楚如何同时捕获多个项目ID:
@using (Html.BeginForm("UpdateDB", "Checklist", new { id = model.ID })) // model does not exist in this current context
{
<table id="checklistGrid" class="table table-bordered table-striped grid">
<tr>
<th>@Html.DisplayNameFor(model => model.ww)</th>
.... // more table headers
</tr>
@foreach (var group in Model.GroupBy(x => x.ww))
{
<tr class="group-header">
<td colspan="12">
<span class="h2">@group.Key</span>
</td>
</tr>
foreach (var dept in group.GroupBy(x => x.dept))
{
<tr class="dept-header">
<td colspan="12">
<span class="h4">@dept.Key</span>
</td>
</tr>
foreach (var item in dept)
{
<tr class="row-header">
<td> @Html.HiddenFor(modelItem => item.ID)</td>
<td>@Html.DisplayFor(modelItem => item.ww)</td>
.... // more table columns
<td>
@{
List<string> ddl = new List<string> { "Done", "Not Done", "N/A" };
SelectList sl = new SelectList(ddl, item.status);
@Html.DropDownList("newStatus", sl); // Added
}
</td>
<td>@Html.DisplayFor(modelItem => item.applied_by)</td>
<td>
@{
DateTime tmp;
//Check if not null, if not null convert to specified time zone
if (DateTime.TryParse(item.timestamp.ToString(), out tmp))
{
tmp = item.timestamp ?? DateTime.MinValue;
string zoneName = "India Standard Time";
var abbrZoneName = TimeZoneNames.TimeZoneNames.GetAbbreviationsForTimeZone(zoneName, "en-US");
TimeZoneInfo zoneInfo = TimeZoneInfo.FindSystemTimeZoneById(zoneName);
DateTime istTime = TimeZoneInfo.ConvertTimeFromUtc(tmp, zoneInfo);
@Html.Raw(istTime.ToString() + " (" + abbrZoneName.Generic + ")");
}
else
{
@Html.DisplayFor(modelItem => item.timestamp);
}
}
</td>
</tr>
}
}
}
</table>
<p><input type="submit" value="Save Changes" /></p>
}
<script type="text/javascript">
// Hide/Show Dept's Data on Click
$(function () {
$('.dept-header').click(function () {
$(this).nextUntil('.dept-header, .group-header').toggle();
});
});
$(function () {
$('.group-header').click(function () {
var elm = $(this);
if (elm.next().is(":visible")) {
elm.nextUntil('.group-header').hide();
} else {
elm.nextUntil('.group-header', '.dept-header').show();
}
});
});
</script>
我怀疑使用Jquery + Ajax&amp;&amp; amp;更容易(并且计算速度更快)。 Json附加到底部的按钮onclick,将id和选定下拉文本的集合发送到ActionResult
中的Controller
(然后更新数据库),然后刷新成功的Ajax回调。但是我的Jquery / Javascript foo很弱,并且给定了可扩展/折叠数据行的可点击“标题”类型的行,我不清楚如何有效地使用Jquery导航并获取item.ID
和所选的下拉列表每行中的文本,将其捆绑,然后通过管道传递到所需的ActionResult。
那么如何将所有行的ID和选定的下拉文本同时发送到ActionResult
Html.BeginForm
或Jquery等人的<{p}}
编辑:模型供参考:
using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema;
using System.Data.Entity;
using System.Linq;
using System.Web;
namespace TaskTracker.Models
{
[Table("some_update")]
public class TaskInfo
{
public int ID { get; set; }
[Display(Name = "WW")]
public int ww { get; set; }
[Display(Name = "File Name")]
public string filename { get; set; }
[Display(Name = "Dept")]
public string hsd_unit { get; set; }
[Display(Name = "Owner")]
public string owner { get; set; }
[Display(Name = "Manager")]
public string manager { get; set; }
[Display(Name = "Project")]
public string project { get; set; }
[Display(Name = "Status")]
public string status { get; set; }
[Display(Name = "Last Applied By")]
public string applied_by { get; set; }
[Display(Name = "Last Updated Time Stamp")]
public DateTime? timestamp { get; set; }
}
public class TaskInfoDBContext : DbContext
{
public DbSet<TaskInfo> TaskInfoSet { get; set; }
}
}