我有一个剃刀EditorFor
用于Date类型的字段:
@Html.EditorFor(model => model.AvailableEndDateTimeUtc)
我想设置一个"更改"生成的datepicker上的事件,但是当手动更改输入中的值或使用日历时,我找不到获取事件的解决方案。
我尝试使用JavaScript侦听器:
$("#AvailableEndDateTimeUtc").on("change", function () {
alert("ok");
});
它可以手动更改输入,但不能使用日历。
我尝试添加" onchange"事件
@Html.EditorFor(model => model.AvailableEndDateTimeUtc, new { onchange = "myFunction" })
或
@Html.EditorFor(model => model.AvailableEndDateTimeUtc, new { onchange = "myFunction()" })
但它根本不起作用。
以下是生成的HTML代码:
<div class="input-append date" id="AvailableEndDateTimeUtc-parent" data-date="">
<input class="span2 valid" data-val="true" data-val-date="The field 'Date de fin de disponibilité' must be a date." id="AvailableEndDateTimeUtc" name="AvailableEndDateTimeUtc" type="text" value="" aria-describedby="AvailableEndDateTimeUtc-error" aria-invalid="false">
<span class="add-on"><i class="fa fa-calendar"></i></span>
</div>
编辑1
使用此语法时会生成此代码:
@Html.EditorFor(model => model.AvailableEndDateTimeUtc, new { onchange = "OnChangeEvent()" })
$(function () {
var c = Globalize.culture().calendars.standard;
var fmt = c.patterns["d"];
$("#AvailableEndDateTimeUtc-parent").datetimepicker({
language: 'glob',
format: fmt,
pickDate: true,
pickTime: false,
pickSeconds: false,
pick12HourFormat: false,
maskInput: true,
collapse: true });
});
编辑2
我尝试添加该代码:
$('#AvailableEndDateTimeUtc-parent').change(function () {
alert("Select change");
});
但只有当我在输入中进行手动更改时才会触发它。
我试图获取日期选择器并在其上添加事件(我在文档中看到它有一个&#39; onSelect&#39;事件)但是它会破坏生成的组件。
此次修改的最后一次尝试:获取现有的datepicker选项并添加我的事件
$("#AvailableEndDateTimeUtc-parent").data("datetimepicker").options.OnChangeDate = function() {
alert("Select change");
}
我将该代码放在document.ready
但$("#AvailableEndDateTimeUtc-parent").data("datetimepicker")
返回&#34;未定义&#34;。但是如果我在控制台中执行相同的操作,它将返回组件。
答案 0 :(得分:0)
也许onChangeDateTime
设置允许您调用OnChangeEvent()。
@Html.EditorFor(model => model.AvailableEndDateTimeUtc)
<script type="text/javascript">
$('#AvailableEndDateTimeUtc').change(function(){
OnChangeEvent();
});
$(function () {
var c = Globalize.culture().calendars.standard;
var fmt = c.patterns["d"];
$("#AvailableEndDateTimeUtc-parent").datetimepicker({
onChangeDateTime: OnChangeEvent, /* Add onChangeDateTime event */
language: 'glob',
format: fmt,
pickDate: true,
pickTime: false,
pickSeconds: false,
pick12HourFormat: false,
maskInput: true,
collapse: true });
});
function OnChangeEvent(){
alert('Changed!');
}
</script>
答案 1 :(得分:0)
试试这个。您似乎在为state_id
函数使用了错误的ID。
而不是使用prefix_sum[state_id]
onchange
#AvailableEndDateTimeUtc-parent