I love Xeditable plugin and using in my Angular Project. When I integrated bsdate and bstime with table, it works very well when my timeoffs json contain hardcode values like below,
$scope.timeoffs=[{"id":1,"name":"Christmas","recurrence":4,"bgdate":new Date(2015, 11, 24, 00, 00),"eddate":new Date(2015, 11, 25, 23, 59),"weekDayStart":0,"weekDayEnd":0},
{"id":2,"name":"New Year","recurrence":4,"bgdate":new Date(2015, 00, 01, 00, 00), "eddate":new Date(2015, 00, 01, 23, 59),"weekDayStart":0,"weekDayEnd":0}];
Table
<form editable-form name="form.holidayForm" id="form.holidayForm" onaftersave="checkTimeOffAfterSave()">
<table id="tableDataOfTimeOffs" class="scroll table table-bordered table-hover table-condensed" width="100%" fixed-header1 rows="userSetup.rowsForTableRender4" style="border: 1">
<thead id="tableHeaderOfTimeOff" style="width: 100%;">
<tr style="font-weight: bold">
<th style="min-width: 75px"><label><b>{{ 'load.static.usersetup.HOLIDAY' | translate }}</b></label></th>
<th style="min-width: 70px"><label><b>{{ 'load.static.usersetup.RECURRENCE' | translate }}</b></label></th>
<th style="min-width: 70px"><label><b>{{ 'load.static.usersetup.BEGINWEEK' | translate }}</b></label></th>
<th style="min-width: 80px"><label><b>{{ 'load.static.usersetup.BEGINDATE' | translate }}</b></label></th>
<th style="min-width: 85px"><label><b>{{ 'load.static.usersetup.BEGINTIME' | translate }}</b></label></th>
<th style="min-width: 70px"><label><b>{{ 'load.static.usersetup.ENDWEEK' | translate }}</b></label></th>
<th style="min-width: 80px"><label><b>{{ 'load.static.usersetup.ENDDATE' | translate }}</b></label></th>
<th style="min-width: 85px"><label><b>{{ 'load.static.usersetup.ENDTIME' | translate }}</b></label></th>
<th style="width: 10px;" ng-show="!usrreadonly"><span ng-show="form.tableform.$visible">{{ 'load.static.usersetup.ACTION' | translate }}</span></th>
</tr>
</thead>
<tbody id="tableBodyOfTimeOff">
<tr ng-repeat="user in timeoffs | filter:filterUser" ng-show="timeoffs.length" style="height: 35px;" id="timeOffRow{{$index}}">
<td title="{{ 'load.static.usersetup.TIMEOFF_HNM_TITLE' | translate }}" style="min-width: 75px">
<span editable-textfixedwith="user.name" e-form="form.holidayForm" onbeforesave="checkDuplicateTimeOff($data, user.id)" ng-readonly="usrreadonly">
{{ user.name || '' }}
</span>
</td>
<td title="{{ 'load.static.usersetup.TIMEOFF_RECC_TITLE' | translate }}" style="min-width: 70px">
<span editable-select="user.recurrence" e-form="form.holidayForm" onshow="loadRecurrences()" e-ng-change="recurrenceSelect($index)" e-ng-options="g.id as g.text for g in recurrences" ng-readonly="usrreadonly" e-id="recurrence{{$index}}">
{{ showRecurrences(user) }}
</span>
</td>
<td title="{{ 'load.static.usersetup.TIMEOFF_DAYS_TITLE' | translate }}" style="min-width: 70px">
<span editable-selectfixedwith="user.weekDayStart" e-form="form.holidayForm" onshow="loadWeekDays()" e-ng-options="g.id as g.text for g in weekDays" ng-readonly="usrreadonly" e-id="weekDayStart{{$index}}"
onbeforesave="checkWeekDaysFilled($data, $index)">
{{ showWeekDaysStart(user) }}
</span>
</td>
<td title="{{ 'load.static.usersetup.TIMEOFF_BDATE_TITLE' | translate }}" style="min-width: 80px">
<span editable-bsdate="user.bgdate" e-show-meridian="false" e-datepicker-popup="dd/MM/yyyy" data-viewformat="dd/MM/yyyy" e-ng-disabled="bgdate{{$index}}" e-id="bgdate{{$index}}" onbeforesave="checkBGDateFilled($data, user.id)" >
{{ (user.bgdate | date:"dd/MM/yyyy") || '' }}
</span>
</td>
<td title="{{ 'load.static.usersetup.TIMEOFF_BTIME_TITLE' | translate }}" style="min-width: 85px">
<span editable-bstime="user.bgdate" e-show-meridian="false" e-minute-step="1" ng-readonly="usrreadonly" onbeforesave="checkBGDateFilled($data, user.id)" >
{{ (user.bgdate | date:"HH:mm") || '' }}
</span>
</td>
<td title="{{ 'load.static.usersetup.TIMEOFF_DAYS_TITLE' | translate }}" style="min-width: 70px">
<span editable-selectfixedwith="user.weekDayEnd" e-form="form.holidayForm" onshow="loadWeekDays()" e-ng-options="g.id as g.text for g in weekDays" ng-readonly="usrreadonly" e-id="weekDayEnd{{$index}}"
onbeforesave="checkWeekDaysFilled($data, $index)">
{{ showWeekDaysEnd(user) }}
</span>
</td>
<td title="{{ 'load.static.usersetup.TIMEOFF_EDATE_TITLE' | translate }}" style="min-width: 80px">
<span editable-bsdate="user.eddate" e-datepicker-popup="dd/MM/yyyy" ng-readonly="usrreadonly" e-id="eddate{{$index}}" e-ng-disabled="eddate{{$index}}" onbeforesave="checkBGDateFilled($data, user.id)">
{{ (user.eddate | date:"dd/MM/yyyy") || '' }}
</span>
</td>
<td title="{{ 'load.static.usersetup.TIMEOFF_ETIME_TITLE' | translate }}" style="min-width: 85px">
<span editable-bstime="user.eddate" e-show-meridian="false" e-minute-step="10" ng-readonly="usrreadonly" onbeforesave="checkBGDateFilled($data, user.id)">
{{ (user.eddate | date:"HH:mm") || '' }}
</span>
</td>
<td title="{{ 'load.static.table.TAB_DEL' | translate }}" ng-show="!usrreadonly" style="min-width: 37px">
<button type="button" ng-show="form.holidayForm.$visible" ng-click="deleteTimeOff($index)" class="deletebutton" ng-disabled="usrreadonly"></button>
</td>
</tr>
</tbody>
</table>
<div class="btn-form" ng-show="!usrreadonly">
<button type="button" id="s4Add" ng-click="addTimeOffs();form.holidayForm.$show();" >{{ 'load.static.usersetup.ADD_TIMEOFF_ROW_BUTTON' | translate }}</button>
</div>
</form>
Now, when I dynamically ads a value to it like below, then it renders date component very well but time portion always show current time instead of time present in date object.
$scope.timeoffs.push({
id: $scope.timeoffs.length+1,
name: timeoffName,
recurrence: $scope.recurrences[recurrenceSelection].id,
bgdate: d1,
eddate: new Date(end_year, end_month, end_date, end_hours, end_minutes),
weekDayStart:filtered[0].weekDayStart,
weekDayEnd:filtered[0].weekDayEnd
});
I tried removing all the elements from json and start putting one by one again but no success. Actually internally JSON is changed and it is correct as well because when I print the same date it is correct but while display only it shows incorrect time (shows current time) like below last entry. .