Refresh columns after reorganization

[ZabelskyParticipant]

Hello,I have a problem.
Me need.that columns refresh after I changed date for columns.
For example :
This initialize grid :
$scope.loadGrid = function ()
{

$scope.settings = getGridDispositionSettings();
$scope.settings.source = new $.jqx.dataAdapter({ localdata: [] });
var s = $scope.settings.source._source.localdata;

$scope.settings.handlekeyboardnavigation = function (event) {
var key = event.charCode ? event.charCode : event.keyCode ? event.keyCode : 0;
var value = $scope.selectedRow;
if (key == 112) { // F1
if (value._IsAssembly && value._IsAssembly != “” && value._OrderId && value._OrderId != “”) {
var link = value._IsAssembly == “Нет” ? “editOrder/” : “editAssemblyOrder/”;
var landingUrl = ‘#/’ + link + value._OrderId;
$window.open(landingUrl, “blank”);
} else {
loggerService.logWarning(‘Отсуствует текущий заказ’, “”, “”, true);
}
return true;
} else if (key == 113) { // F2
if (value._IsAssemblyP && value._IsAssemblyP != “” && value._OrderIdP && value._OrderIdP != “”) {
var link2 = value._IsAssemblyP == “Нет” ? “editOrder/” : “editAssemblyOrder/”;
var landingUrl2 = ‘#/’ + link2 + value._OrderIdP;
$window.open(landingUrl2, “blank”);
} else {
loggerService.logWarning(‘Отсуствует планируемый заказ’, “”, “”, true);
}

return true;
}
};

$scope.settings.source = new $.jqx.dataAdapter({ localdata: s });
$scope.settings.columns = [
{ text: “Напр”, datafield: “_direction”, width: 25, filtertype: ‘checkedlist’,resizable: false, cellsrenderer: asColumnRender, type: “string”, pinned: true },
{ text: “Рег.Номер”, datafield: “_RegistrationNumbers”, width: 90, resizable: false, cellsrenderer: asColumnRender, type: “string”, pinned: true },
{ text: “Экипаж”, datafield: “_Drivers”, width: 90, cellsrenderer: asColumnRender, resizable: false, type: “string”, pinned: true },
{ text: “Приписка”, datafield: “_Registration”, width: 40,filtertype: ‘checkedlist’, cellsrenderer: asColumnRender, type: “string” },
{ text: “Группа”, datafield: “_GroupAvto”, width: 60, filtertype: ‘checkedlist’,cellsrenderer: asColumnRender, type: “string” },
{ text: “Тип прицепа”, datafield: “TrailerType”, width: 60, cellsrenderer: asColumnRender, type: “string” },
{ text: “Разрешения”, datafield: “_GroupPlacement”, width: 60, cellsrenderer: asColumnRender, type: “string” },
{ text: “Визы”, datafield: “_Visa”, width: 100, cellsrenderer: visasRender, cellsformat: ‘dd.MM.yyyy’ },
{ text: “Заказ”, datafield: “_Orders”, width: 260, cellsrenderer: asColumnRenderOrder, type: “string” },
{ text: “Простои(дн)”, datafield: “_DowntimeDays”, cellsrenderer: downtimeDays, width: 50, type: “int” },
{ text: “Неделя”, datafield: “_Week”, width: 70,filtertype: ‘checkedlist’, type: “string” },
{ text: “Инженер”, datafield: “Leading”, width: 90, type: “string” },
{ text: “Клиент”, datafield: “_Clients”, width: 260, cellsrenderer: asColumnRender, type: “string” },
{ text: “Маршрут 1”, datafield: “_RoutesFirst”, width: 50, filtertype: ‘checkedlist’, cellsrenderer: asColumnRender, type: “string”, access: “Administrator,Leading”, accessPermissionType: “AtLeastOne”, },
{ text: “Маршрут 2”, datafield: “_RoutesSecond”, width: 50, filtertype: ‘checkedlist’,cellsrenderer: asColumnRender, type: “string”, access: “Administrator,Leading”, accessPermissionType: “AtLeastOne”, },
{ text: “Экспедитор”, datafield: “_Forwarders”, cellsrenderer: asColumnRender, width: 90, type: “string” },
{ text: “Дата загрузки”, datafield: “_LoadingDates”, cellsrenderer: asColumnRender, width: 90, type: “string”, cellsformat: ‘dd.MM.yyyy’ },
{ text: “Дата растаможки”, datafield: “_CustomClearanceDates”, cellsrenderer: asColumnRender, width: 90, type: “string” },
{ text: “Дата разгрузки”, datafield: “_UploadingDates”, cellsrenderer: asColumnRender, width: 90, type: “string” },
{ text: “Пл. Дата загрузки”, datafield: “_LastLoadingDates”, cellsrenderer: asColumnRender, width: 90, type: “string” },
{ text: “Пл. Дата растаможки”, datafield: “_PlaneCustomClearanceDates”, cellsrenderer: asColumnRender, width: 90, type: “string” },
{ text: “Пл. Дата разгрузки”, datafield: “_LastUploadingDates”, cellsrenderer: asColumnRender, width: 90, type: “string” },
{ text: “Дата авиз”, datafield: “_DateAvizirovaniyas”, cellsrenderer: asColumnRender, width: 90, type: “string” },
{ text: “Разгрузка Тек”, datafield: “_Uploadings”, cellsrenderer: asColumnRender, width: 90, type: “string” },
{ text: “Комментарий заказа”, datafield: “_CommentOrders”, cellsrenderer: asColumnRender, width: 90, type: “string” },
{ text: “Комментарий авто”, datafield: “_TrailerComment”, width: 90, type: “string” },
{ text: “Комментарий механика”, datafield: “_MechanikComment”, width: 90, type: “string” },
];
$scope.settings.columngroups = [
{ text: ‘Календарь’, align: ‘center’, name: ‘Calendar’ }
];

var oneDay = 24 * 60 * 60 * 1000; // hours*minutes*seconds*milliseconds
var firstDate = $scope.calendarStart;
var secondDate = $scope.calendarEnd;
var diffDays = Math.round(Math.abs((firstDate.getTime() – secondDate.getTime()) / (oneDay)));

$scope.datafields = [];
for (var k = 0; k <= diffDays; k++) {
var date = new Date();
date.setDate(firstDate.getDate() + k);

var day = date.getDate();
var month = date.getMonth() + 1;
var datafield = ‘_Date_’ + month + ‘_’ + day;
$scope.settings.columns.push({ text: day + ‘-‘ + getDayOfWeek(date.getDay()), datafield: datafield, columnsreorder: false, width: 80, type: “string”, columngroup: ‘Calendar’ });
$scope.datafields.push(datafield);

}

and at html page have 2 inputs :

от <input type=”date” ng-model=”calendarStart” class=”form-control” style=”display: inline-block; width: 150px !important;” />
до <input type=”date” ng-model=”calendarEnd” class=”form-control” style=”display: inline-block; width: 150px !important;” />

When I changed dates on this inputs – grid success reload,but the next manipulation of the grid , i have a error
This`s text of error – “jqxGrid is not a function”
Reload grid like this :

$scope.refreshGrid = function () {

var data2 = new FormData();
data2.append(“Name”, “calendarStart”);
data2.append(“Value”, $scope.calendarStart);
data2.append(“Show”, true);
dataService.settings_insert(data2);

var data1 = new FormData();
data1.append(“Name”, “calendarEnd”);
data1.append(“Value”, $scope.calendarEnd);
data1.append(“Show”, true);
dataService.settings_insert(data1);
$scope.loadGrid();
}

[HristoParticipant]

Hello AlexeyZabelsky,

You could use ‘refresh’ method of the Grid.
I notice your $scope.refreshGrid function call the “$scope.loadGrid();” that it is not correct because start to create the Grid again.
The first way is to bind to the cellvaluechanged event and after that, you could refresh the Grid.
Another way is to use setcellvalue method in your “$scope.refreshGrid”.

Also, I would like to ask you write topics about Angular in the relevant section.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[ZabelskyParticipant]

Me not need refresh the Grid,Me need refresh of columns,this is my problem.
Thank for desire,Hristo.

[HristoParticipant]

Hello AlexeyZabelsky,

You could try to use this approach: $('#jqxgrid').jqxGrid('updatebounddata', 'cells');

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts