我需要根据用户的操作来更新到期日期。我想在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/