Как работать с флажками в ASP.NET MVC?

Question

У меня есть вид, внутри которого есть два флажка. На проверенном мне нужно сохранить текущее назначенное значение в таблице базы данных.

Вот модель:

public class RoomHk
{
  public int RoomHkId { get; set; }
  public int RoomId { get; set; }
  public DateTime? DeepCleaning { get; set; }
  public DateTime? NewLinen { get; set; }
}

Это дочерний стол моей комнаты Стол. Следующее мое представление: предположим, пользователь сначала установил флажок, затем нажал кнопку «Сохранить», а затем я хочу сохранить текущее время и дату в столбце NewLinen таблицы RoomHk в соответствующем RoomId. Как я могу сделать это с помощью метода jQuery post?

<div class="col-6">
  @if (item.NewLinen == null)
  {
    <input type="checkbox" data-nlid="@item.RoomId" class="form-check-input newLinen" />
    <label>New Linen</label>
    <br />
  }

  @if (item.DeepCleaning == null)
  {
    <input type="checkbox" data-dcid="@item.RoomId" class="form-check-input deepClean" />
    <label>Deep Cleaning</label>
  }
</div>

<button type="button" class="btn btn-default insert" data-rid="@item.RoomId">Save</button>

$(function () {
  $('.insert').click(function () {
    $.post("@Url.Action("SetCleaningStatus", "HouseKeeping")", { id: $(this).data("id"), });
  });
});

Answer 1

Вы можете использовать Html.BeginForm и поместить кнопку отправки внутри формы . Это важно, в противном случае вам нужно будет использовать дополнительные сценарии, чтобы заставить его работать.

Если вам нужно опубликовать состояние двух флажков (DeepCleaning и NewLinen), я бы предложил иметь их как Boolean вместо DateTime, чтобы вы могли сопоставлять их состояния (отмеченные / не отмеченные) к соответствующим свойствам, потому что вы, кажется, хотите это сделать.

SetCleaningStatus.cshtml

@model RoomHk;

@Html.BeginForm("SetCleaningStatus", "HouseKeeping") 
{
  <!-- Will be posted to the controller, no additional Javascript necessary -->
  @Html.HiddenFor(m => m.RoomId)

  <div class="col-6">
    @if (item.NewLinen == null)
    {
        <input type="checkbox" data-nlid="@item.RoomId" class="form-check-input newLinen" />
        <label>New Linen</label>
        <br />
    }

    @if (item.DeepCleaning == null)
    {
        <input type="checkbox" data-dcid="@item.RoomId" class="form-check-input deepClean" />
        <label>Deep Cleaning</label>
    }
  </div>


  <!-- IMPORTANT: the type needs to be `submit` instead of `button` -->
  <input type="submit" class="btn btn-default insert" value="Save" />
}

HouseKeeping.cs

public class RoomHk
{
    public int RoomHkId { get; set; }
    public int RoomId { get; set; }
    public DateTime? DeepCleaning { get; set; }
    public DateTime? NewLinen { get; set; }
}

[HttpGet]
public ActionResult SetCleaningStatus() 
{
    var model = new RoomHk();

    return View(model);
}

[HttpPost]
public ActionResult SetCleaningStatus(RoomHk arg) 
{
    bool response = new {
        success = true
    };

    // Here is your RoomId
    arg.RoomId;

    arg.NewLinen = DateTime.Now;

    // Save posted data to DB
    // ...

    // Return your response here
    return Json(response);
}

POST отметьте проверенное состояние флажков

Используйте Html.CheckBoxFor и Html.LabelFor и позвольте компилятору отображать эти поля для вас, с правильными идентификаторами и именами, правильно установленными.

public class RoomHk
{
    // Make them booleans
    public bool DeepCleaning { get; set; }
    public bool NewLinen { get; set; }
}

<div class="col-6">
  <!--
  <input type="checkbox" data-nlid="@item.RoomId" class="form-check-input newLinen" />
  <label>New Linen</label>
  <br />
  -->

  @Html.LabelFor(m => m.NewLinen, "New Linen")
  @Html.CheckBoxFor(m => m.NewLinen, new { @class = "form-check-input" })
</div>