Fixed date picker on new entry fields.

This commit is contained in:
Alexis Lahouze 2013-01-24 21:19:07 +01:00
parent 9e0a5a2ea1
commit 4dfa6ec279
2 changed files with 31 additions and 4 deletions

View File

@ -149,6 +149,23 @@
</tr> </tr>
</script> </script>
<script id="newTmpl" type="text/html">
<tr>
<td><div class="date"><input type="text" class="input-small" data-bind="value: value_date" data-date-format="yyyy-mm-dd" id="new_value_date"></input></div></td>
<td><div class="input-append date"><input type="text" class="input-small" data-bind="value: operation_date" data-date-format="yyyy-mm-dd" id="new_operation_date"></input><button class="btn" type="button" data-bind="click: function(item) { item.operation_date(null)}"><i class="icon-remove"></i></button></div></td>
<td><input type="text" class="input-xxlarge" data-bind="value: label"/></td>
<td><input type="text" class="input-mini" data-bind="value: value"/></td>
<td></td>
<td></td>
<td><input type="text" class="input-small" data-bind="value: category"/></td>
<td class="buttons">
<a class="btn btn-mini btn-success" data-bind="click: $root.save" href="#" title="save"><i class="icon-plus"></i></a>
<a class="btn btn-mini" data-bind="click: $root.cancel" href="#" title="cancel"><i class="icon-remove"></i></a>
</td>
</tr>
</script>
<script id="editTmpl" type="text/html"> <script id="editTmpl" type="text/html">
<tr data-bind="css: { 'error': sold() < 0 }"> <tr data-bind="css: { 'error': sold() < 0 }">
<td><div class="date"><input type="text" class="input-small" data-bind="value: value_date" data-date-format="yyyy-mm-dd" id="value_date"></input></div></td> <td><div class="date"><input type="text" class="input-small" data-bind="value: value_date" data-date-format="yyyy-mm-dd" id="value_date"></input></div></td>
@ -159,8 +176,8 @@
<td data-bind="text: pointedsold"></td> <td data-bind="text: pointedsold"></td>
<td><input type="text" class="input-small" data-bind="value: category"/></td> <td><input type="text" class="input-small" data-bind="value: category"/></td>
<td class="buttons"> <td class="buttons">
<a class="btn btn-mini btn-success" data-bind="click: $root.save" href="#" title="save"><i data-bind="css: {'icon-plus': $root.newEntry() === $data, 'icon-ok': $root.newEntry() != $data }"></i></a> <a class="btn btn-mini btn-success" data-bind="click: $root.save" href="#" title="save"><i class="icon-ok"></i></a>
<a class="btn btn-mini" data-bind="click: $root.cancel" href="#" title="cancel"><i data-bind="css: {'icon-remove': $root.newEntry() === $data, 'icon-ban-circle': $root.newEntry() != $data }"></i></a> <a class="btn btn-mini" data-bind="click: $root.cancel" href="#" title="cancel"><i class="icon-ban-circle"></i></a>
</td> </td>
</tr> </tr>
</script> </script>

View File

@ -214,6 +214,16 @@ var ListViewModel = function() {
var entries = [self.newEntry()].concat(ko.utils.arrayMap($.parseJSON(data), ko.mapping.fromJS)); var entries = [self.newEntry()].concat(ko.utils.arrayMap($.parseJSON(data), ko.mapping.fromJS));
self.entries(entries); self.entries(entries);
// Initialize date picker for value date column.
$("#new_value_date").datepicker().on('changeDate', function(ev){
self.newEntry().value_date(ev.date.format(ev.currentTarget.dataset.dateFormat));
});
// Initialize date picker for operation date column.
$("#new_operation_date").datepicker().on('changeDate', function(ev){
self.newEntry().operation_date(ev.date.format(ev.currentTarget.dataset.dateFormat));
});
}); });
} else { } else {
// If no month, just remove all entries. // If no month, just remove all entries.
@ -293,7 +303,7 @@ var ListViewModel = function() {
// Function to select template in function of selected item. // Function to select template in function of selected item.
self.templateToUse = function (item) { self.templateToUse = function (item) {
return self.selectedItem() === item || self.newEntry() === item ? 'editTmpl' : 'itemsTmpl'; return self.newEntry() === item ? 'newTmpl' : self.selectedItem() === item ? 'editTmpl' : 'itemsTmpl';
}; };
// Function to edit an item // Function to edit an item