如何在MVC上只编辑几个字段并禁用我表单上的其他字段?

时间:2016-11-04 12:30:45

标签: c# asp.net asp.net-mvc asp.net-mvc-4 razor

我正在制作库存跟踪工具,在此工具中,我们可以为测试人员预订设备。但我遇到的问题是,当我尝试编辑其中一个预订时,所有字段都打开进行编辑,我不希望这样。只有应该可编辑的字段才是ActualCheckIn和ActualCheckOut,但我想我是怎么做的。如果你们可以帮助我,那将非常有帮助。我已经发布了bookingController.cs的代码。

       public async Task<ActionResult> Index()
        {
           var bookings =
              await
                _db.Bookings.Include(b => b.Tester)
                    .Include(b => b.Inventory)
                    .Include(b => b.Inventory.Device)
                    .AsNoTracking()
                    .ToListAsync();

        return View(bookings);
    }

    public async Task<ActionResult> AddBooking()
    {
        var viewModel = new BookingViewModel
        {
            BookingDate = DateTime.Now,
            Testers = await _db.Testers.AsNoTracking().ToListAsync(),
            Inventories = GetAvailableInventories()
        };

        return View("Booking", viewModel);
    }

    [HttpPost]
    [ValidateAntiForgeryToken]
    public async Task<ActionResult> AddBooking(BookingViewModel model)
    {
        if (model.Action.Equals("cancel"))
            return RedirectToAction("Index");

        if (!ModelState.IsValid)
        {
            model.Testers = await _db.Testers.ToListAsync();
            model.Inventories = GetAvailableInventories();
            return View("Booking", model);
        }

        var booking = new Booking
        {
            BookingId = model.BookingId,
            BookingDate = model.BookingDate,
            TesterId = model.TesterId,
            LabNumber = model.LabNumber.Value,
            PlanCheckIn = model.PlanCheckIn.Value,
            PlanCheckOut = model.PlanCheckOut,
            ActualCheckIn = model.ActualCheckIn,
            ActualCheckOut = model.ActualCheckOut,
            Notes = model.Notes,
            TotalHours = model.TotalHours
        };

        using (var transaction = _db.Database.BeginTransaction())
        {
            try
            {
                // update device usage if new booking
                if (booking.BookingId == 0)
                {
                    var invetory = await _db.Inventories.FindAsync(model.LabNumber.Value);
                    var device = await _db.Devices.FindAsync(invetory.DeviceId);
                    device.TotalUsage++;
                }

                _db.Bookings.AddOrUpdate(booking);
                await _db.SaveChangesAsync();

                transaction.Commit();
            }
            catch (Exception)
            {
                transaction.Rollback();
                throw;
            }
        }

        return RedirectToAction("Index");
    }

    public async Task<ActionResult> EditBooking(int bookingId)
    {
        var booking = await _db.Bookings.FindAsync(bookingId);

        var model = new BookingViewModel
        {
            BookingId = booking.BookingId,
            BookingDate = booking.BookingDate,
            TesterId = booking.TesterId,
            LabNumber = booking.LabNumber,
            PlanCheckOut = booking.PlanCheckOut,
            PlanCheckIn = booking.PlanCheckIn,
            ActualCheckIn = booking.ActualCheckIn,
            ActualCheckOut = booking.ActualCheckOut,
            Notes = booking.Notes,
            TotalHours = booking.TotalHours,
            Testers = await _db.Testers.ToListAsync(),
            Inventories = GetAvailableInventories(booking.LabNumber)
        };


        return View("Edit", model);
    }

我还有另一个问题,如果我的表单中的所有字段都已填写,是否有任何方法可以禁用链接以编辑该预订?提前致谢!!

这是我的view.cshtml:

<div class="col-sm-6">
     <div class="form-group">
         @Html.LabelFor(m => m.ActualCheckIn, "Actual CheckOut", new { @class = "col-sm-3 control-label" })
         <div class="col-sm-9">
              <div class="input-group date">
                   <div class="input-group-addon">
                         <i class="fa fa-calendar"></i>
                   </div>
                   @Html.TextBoxFor(m => m.ActualCheckIn, "{0:MM/dd/yyyy}", new { @class = "form-control pull-right datepicker", id = "actualCheckInInput" })
               </div>

         </div>
     </div>
     <div class="form-group">
         @Html.LabelFor(m => m.ActualCheckOut, "Actual CheckIn", new { @class = "col-sm-3 control-label" })
         <div class="col-sm-9">
             <div class="input-group date">
                 <div class="input-group-addon">
                     <i class="fa fa-calendar"></i>
                 </div>
                 @Html.TextBoxFor(m => m.ActualCheckOut, "{0:MM/dd/yyyy}", new { @class = "form-control pull-right datepicker", id = "actualCheckOutInput" })
             </div>
         </div>
     </div>

1 个答案:

答案 0 :(得分:3)

可能最简单的方法是为Edit用例引入一个不同的ViewModel,它只公开可编辑的属性。这增加了灵活性和可维护性。

protected

作为替代方案,请重复使用BookingViewModel。关键是只为可编辑的属性呈现public class EditBookingViewModel { // post as hidden field so we can fetch the record to update public long BookingId {get; set;} // render inputs for these fields so they can be edited public DateTime ActualCheckIn {get; set;} public DateTime ActualCheckOut {get; set;} }

Edit.cshtml

<input>

在POST EditBooking操作中,使用ID从数据库中检索要更新的预订,并仅映射可编辑字段

@model BookingViewModel

@{ Html.BeginForm("EditBooking", "Booking", FormMethod.Post) }

@* Shown, editable, posted back *@
@Html.EditorFor(m => m.ActualCheckIn)
@Html.EditorFor(m => m.ActualCheckOut)

@* Shown, not editable, not posted back *@
@Html.DisplayFor(m => m.BookingDate)

@* Not shown, not editable, posted back *@
@Html.HiddenFor(m => m.BookingId)

@{ Html.EndForm(); }