With the following template content for my list view...
<div class="list-view">
<input type="text" data-bind="value:shoppingList_main" name="shoppingList_main" required="required" validationMessage="required" />
<span data-for="shoppingList_main" class="k-invalid-msg"></span>
<br />
<input data-role="datepicker" type="text" data-bind="value:shoppingList_date" name="shoppingList_date" required="required" validationMessage="required" />
<span data-for="shoppingList_date" class="k-invalid-msg"></span>
<div class="edit-buttons">
<a class="k-button k-button-icontext k-update-button" href="\\"><span class="k-icon k-update"></span>Save</a>
<a class="k-button k-button-icontext k-cancel-button" href="\\"><span class="k-icon k-cancel"></span>Cancel</a>
</div>
</div>
...
I get a date picker on my display and when I edit an item, it sets the display, and it sets the value in my datasource object, but the ajax request to the server doesn't send the date property...
Here is my datasource and list View js....
...
Any idea how to get this working round trip w/ the datePicker? For now I just required the field, and used a date pattern, but date picker would be a much better option
<div class="list-view">
<input type="text" data-bind="value:shoppingList_main" name="shoppingList_main" required="required" validationMessage="required" />
<span data-for="shoppingList_main" class="k-invalid-msg"></span>
<br />
<input data-role="datepicker" type="text" data-bind="value:shoppingList_date" name="shoppingList_date" required="required" validationMessage="required" />
<span data-for="shoppingList_date" class="k-invalid-msg"></span>
<div class="edit-buttons">
<a class="k-button k-button-icontext k-update-button" href="\\"><span class="k-icon k-update"></span>Save</a>
<a class="k-button k-button-icontext k-cancel-button" href="\\"><span class="k-icon k-cancel"></span>Cancel</a>
</div>
</div>
...
I get a date picker on my display and when I edit an item, it sets the display, and it sets the value in my datasource object, but the ajax request to the server doesn't send the date property...
Here is my datasource and list View js....
<script> | |
jQuery(function () { | |
shoppingLists_datasource = new kendo.data.DataSource({ | |
pageSize:4, | |
schema:{ | |
model: { | |
id: 'familyShoppingList_id', | |
fields: { | |
familyShoppingList_id: { editable: false, nullable: true }, | |
shoppingList_main: { editable: true}, | |
shoppingList_date: { editable: true} | |
} | |
} | |
}, | |
transport:{ | |
read:{ | |
url:'/apps/wpd/apps/shopping/index.cfc?method=getShoppingLists', | |
dataType: 'json' | |
}, | |
create:{ | |
url:'/apps/wpd/apps/shopping/index.cfc?method=saveShoppingList', | |
dataType: 'json' | |
}, | |
update:{ | |
url:'/apps/wpd/apps/shopping/index.cfc?method=saveShoppingList', | |
dataType: 'json' | |
}, | |
destroy:{ | |
url:'/apps/wpd/apps/shopping/index.cfc?method=removeShoppingList', | |
dataType: 'json' | |
} | |
} | |
}) | |
}) | |
</script> | |
<script> | |
var shoppingLists_listView; | |
jQuery(function () { | |
shoppingLists_listView = jQuery("#shoppingLists").kendoListView({ | |
dataSource: shoppingLists_datasource, | |
template: kendo.template($("#viewTemplate").html()), | |
editTemplate: kendo.template($("#editTemplate").html()) | |
}) | |
.delegate(".k-edit-button", "click", function(e) { | |
shoppingLists_listView.edit($(this).closest(".list-view")); | |
e.preventDefault(); | |
}) | |
.delegate(".k-delete-button", "click", confirmDel) | |
.delegate(".k-update-button", "click", function(e) { | |
shoppingLists_listView.save(); | |
e.preventDefault(); | |
}) | |
.delegate(".k-cancel-button", "click", function(e) { | |
shoppingLists_listView.cancel(); | |
e.preventDefault(); | |
}) | |
.data("kendoListView") | |
}) | |
</script> |
...
Any idea how to get this working round trip w/ the datePicker? For now I just required the field, and used a date pattern, but date picker would be a much better option