我需要根据用户的操作来更新到期日期。我想在javascript中处理此问题,而不是将隐藏字段发送回控制器。

在模型中,我有两个日期。

    [DataType(DataType.Date)]
    public DateTime ExpirationDate { get; set; }

    [DataType(DataType.Date)]
    public DateTime LastUpdatedDate { get; set; }


在表单中,我显示了当前的到期日期,并且此下拉选择框

                <div class="controls col-md-6">
                    <label for="selExpirationPeriod">Select the expiration period</label>
                </div>
                <div class="controls col-md-6">
                    <select id="selExpirationPeriod" class="form-control">
                        <option value=30>30 days</option>
                        <option value=90>90 days</option>
                        <option value=182>Half year</option>
                        <option value=365 selected>Year</option>
                    </select>
                </div>


目的是使用所选期间更新到期日期。

单击“更新”按钮后,便有了要在其中进行更改的例程。

function updateModel() {

    alert($('#ExpirationDate'));
    return true;
}


它不显示到期日期,而是显示“ [object Object]”

我需要类似的东西

model.ExpirationDate = DateTime.Today + $selExpirationPeriod.value


我不知道如何从javascript访问这三个。

摘要:ExpirationDate是模型的属性,在返回服务器后将保留在数据库中。如果可能的话,我宁愿在客户端中处理计算,只是因为我不知道怎么做。看起来应该很简单,我应该学习它。

更新资料
解决。我必须添加隐藏字段,以便可以将值发送回去。仅作为显示,它不会返回。

        <div class="control-group">
            <div class="controls col-md-6">
                @Html.HiddenFor(cm => cm.ExpirationDate, new { id = "ExpirationDate" }) @*hidden input so that POST will send the data back*@
                @Html.LabelFor(cm => cm.ExpirationDate)
                @Html.DisplayFor(cm => cm.ExpirationDate, new { @class = "form-control" })
            </div>
        </div>


然后,我不得不从例程中更新该字段。

    document.getElementById("ExpirationDate").value = expireDate;

最佳答案

我想您会根据用户选择的selExpirationPeriod来计算过期日期,并根据您想要的model.ExpirationDate = DateTime.Today + $selExpirationPeriod.value之类的内容将日期天数添加到日期中

我提供了名为addDaysToDate()的纯JavaScript扩展,以将日期编号添加到DateTime.Now作为示例,您可以对其进行改进,在expBtn中单击[cc]的任何方式都可以通过该Ajax将其传递到服务器。


Date.prototype.addDaysToDate = function(days) {
    var date = new Date(this.valueOf());
    date.setDate(date.getDate() + days);
    return date;
}
var expBtn = document.getElementById('makeExpDate');
expBtn.addEventListener("click",function(e){
   var option = document.getElementById("selExpirationPeriod");
   var selectedDay = option.options[option.selectedIndex].value;
   var date = new Date();
   var expireDate = date.addDaysToDate(selectedDay);
   alert(expireDate);
},false);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="controls col-md-6">
    <label for="selExpirationPeriod">Select the expiration period</label>
    </div>
    <div class="controls col-md-6">
    <select id="selExpirationPeriod" class="form-control">
      <option value=30>30 days</option>
      <option value=90>90 days</option>
      <option value=182>Half year</option>
      <option value=365 selected>Year</option>
     </select>
</div>
<button id='makeExpDate'>Expire Date</button>

关于javascript - 如何根据用户选择更新模型上的属性?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/53999196/

10-12 00:28
查看更多