Question

我正在开发一个MVC 3项目（CRUD）...我想为网球场创建一个预订......

页面

enter image description here

所以，当我输入“开始时间”（法语中的“heurededébut”）时，我想动态地增加“FinishTime”红色（法语中的“heure de fin”）。 ..如果是简单的比赛增加1点，如果不是2点......

我是MvC3的初学者所以我不知道怎么做...当然，我不是要求你做我的工作，而是要做到这一点的正确方法，如果可能的话......

查看：

@using (Html.BeginForm()) {
@Html.ValidationSummary(true)
<fieldset>
    <legend>Reservation</legend>

    <div class="editor-label">
        @Html.LabelFor(model => model.Date)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Date)
        @Html.ValidationMessageFor(model => model.Date)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.StartTime)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.StartTime)
        @Html.ValidationMessageFor(model => model.StartTime)
    </div>


    <div class="editor-label">
        @Html.LabelFor(model => model.Simple)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Simple)
        @Html.ValidationMessageFor(model => model.Simple)
    </div>


    <div class="editor-label">
        @Html.LabelFor(model => model.FinishTime)
    </div>
    <div class="editor-fieldFinishTime">
        @Html.DisplayFor(model => model.FinishTime)
        @Html.ValidationMessageFor(model => model.FinishTime)
    </div>

    <div class="editor-label">
         @Html.LabelFor(model => model.Customer.Name)
    </div>
    <div class="editor-field">
         @Html.EditorFor(model => model.Customer.Name)
        @Html.ValidationMessageFor(model => model.Customer.Name)
    </div>


    <div class="editor-label">
        @Html.Label("Terrain N°")
    </div>
    <div class="editor-field">
        @Html.DropDownListFor(c=>c.TennisCourtID,ViewBag.TennisCourtID as SelectList)
    </div>

    <p>
        <input type="submit" value="Create" />
    </p>
</fieldset>
}

<div>
@Html.ActionLink("Back to List", "Index")
</div>

我忘了确切地说所有俱乐部可以有不同的时间表...... 例如：

分会1： 简单：1点双人间：2：00

Club2： 简单：1点30分双人间：2：30

所以在我的数据库表中TennisClub我有一个属性SimpleGameTime和DoubleGameTime ...抱歉:(

Answer 1

绑定到change的{{1}}事件作为开始时间（在呈现的HTML中检查其ID）：

Input

定义一个解析时间的函数，请参阅此处的this post。

在$("input#TheId").bind("onchange", onStartTimeChanged);函数中获取复选框状态（使用正确的jQuery选择器更新控件）：

onStartTimeChanged

然后只需使用适当的偏移量添加已解析的日期，然后使用var checked = $('input[type=checkbox]').is(':checked');将其写回“结束时间”控件。

注意：我假设您将使用JavaScript在客户端执行计算。如果您更喜欢在服务器端执行所有操作，则必须在控制器中添加启用AJAX的方法，并将开始时间和标志作为参数。在toLocaleTimeString()函数中，您必须调用它并异步更新函数返回的结束时间。如果有很多逻辑（或者它不是微不足道的话），我更喜欢使用AJAX的服务器端解决方案。

例如（我没有检查代码，所以使用它暨grano salis）用POST调用服务器端方法（你必须传递参数，作为替代，你可以只使用getJson与GET，但你必须工作路由）：

onStartTimeChanged

您的服务器端功能：

function ComputeEndTime(matchStartTime, isSimpleMatch) {
   var url = '<%= Url.Action("ControllerName", "ComputeEndTime") %>';
   $.post(url, { startTime: matchStartTime, isSimple: isSimpleMatch },
      function(data) {
         return data.endTime;
      }
   );
}

如何动态更改MVC 3中标签的值？

1 个答案: