Hello,
The angular DatePicker is not giving me "dateString"and "dateObject values when my file is .cshtml. The change event is also not raised.
However, when the file is pure .html then things work properly. Also, the jquery version of datepicker works properly.
I am not getting what is missed? Please let me know.
Also, How do I initialise Kendo date picker with a value from a controller method, like date picker and text box, check box etc. Basically I should get value from a MVC controller method as initial value. I am not able to do it.... Please let me know this also..
Following is the code portion...
@{
ViewBag.Title = "Edit Product";
Layout = "~/Views/Shared/_Layout.cshtml";
}
@section HeaderSection {
<link href="../../styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="../../styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<link href="../../styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="../../styles/kendo.dataviz.default.min.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery.min.js" type="text/javascript"></script>
<script src="../../Scripts/angular.min.js" type="text/javascript"></script>
<script src="../../Scripts/kendo.all.min.js" type="text/javascript"></script>
<script src="../../Scripts/kendo.angular.min.js" type="text/javascript"></script>
}
<div id="example" ng-app="KendoDemos">
<div class="demo-section k-content" ng-controller="MyCtrl">
<div class="details">
<h5>Product Name </h5>
<input kendo-masked-text-box style="width: 300px"
k-mask="''"
k-options="productNameOptions"
ng-model="initName"/>
<h5> Price</h5>
<input kendo-numeric-text-box k-min="0", k-max="99999"
k-options ="priceOptions"
ng-model="initPrice"/>
<h5> Select</h5>
<input type ="checkbox" id="checkbox1" ng-model="initValue"/>
<h5> Choose Date</h5>
<input kendo-date-picker k-format="'dd MMMM yyyy'" ng-model="dateString" k-ng-model="dateObject"/>
<pre>
dateString: {{ dateString }}
dateObject: {{ dateObject | date:"EEEE, MMMM d, yyyy" }}
@*typeof dateObject: {{ getType(dateObject) }}
dateObject instanceof Date: {{ isDate(dateObject) }}*@
</pre>
<input id="datepicker" value style="width: 300px;"/>
<h5>Categories </h5>
<select id="categories1"
kendo-drop-down-list style="width: 300px"
k-options="customOptions"></select>
<h5>Save Details </h5>
<kendo-button on-click="onSave()"> Save</kendo-button>
</div>
</div>
</div>
The angular DatePicker is not giving me "dateString"and "dateObject values when my file is .cshtml. The change event is also not raised.
However, when the file is pure .html then things work properly. Also, the jquery version of datepicker works properly.
I am not getting what is missed? Please let me know.
Also, How do I initialise Kendo date picker with a value from a controller method, like date picker and text box, check box etc. Basically I should get value from a MVC controller method as initial value. I am not able to do it.... Please let me know this also..
Following is the code portion...
@{
ViewBag.Title = "Edit Product";
Layout = "~/Views/Shared/_Layout.cshtml";
}
@section HeaderSection {
<link href="../../styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="../../styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<link href="../../styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="../../styles/kendo.dataviz.default.min.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery.min.js" type="text/javascript"></script>
<script src="../../Scripts/angular.min.js" type="text/javascript"></script>
<script src="../../Scripts/kendo.all.min.js" type="text/javascript"></script>
<script src="../../Scripts/kendo.angular.min.js" type="text/javascript"></script>
}
<div id="example" ng-app="KendoDemos">
<div class="demo-section k-content" ng-controller="MyCtrl">
<div class="details">
<h5>Product Name </h5>
<input kendo-masked-text-box style="width: 300px"
k-mask="''"
k-options="productNameOptions"
ng-model="initName"/>
<h5> Price</h5>
<input kendo-numeric-text-box k-min="0", k-max="99999"
k-options ="priceOptions"
ng-model="initPrice"/>
<h5> Select</h5>
<input type ="checkbox" id="checkbox1" ng-model="initValue"/>
<h5> Choose Date</h5>
<input kendo-date-picker k-format="'dd MMMM yyyy'" ng-model="dateString" k-ng-model="dateObject"/>
<pre>
dateString: {{ dateString }}
dateObject: {{ dateObject | date:"EEEE, MMMM d, yyyy" }}
@*typeof dateObject: {{ getType(dateObject) }}
dateObject instanceof Date: {{ isDate(dateObject) }}*@
</pre>
<input id="datepicker" value style="width: 300px;"/>
<h5>Categories </h5>
<select id="categories1"
kendo-drop-down-list style="width: 300px"
k-options="customOptions"></select>
<h5>Save Details </h5>
<kendo-button on-click="onSave()"> Save</kendo-button>
</div>
</div>
</div>