I'm new in angular. We are using UI-grid for data presentation is is possible to customize filter process. I want to customize it in that way, that filtering is peformmed on button click, not on keydown?
This is idea
$scope.search = function (){
$scope.personCardGrid.useExternalFiltering = false; $scope.grid1Api.core.notifyDataChange(uiGridConstants.dataChange.ALL);
$scope.gridApi.core.refresh() $scope.personCardGrid.useExternalFiltering = true;
$scope.grid1Api.core.notifyDataChange(uiGridConstants.dataChange.ALL);
$scope.gridApi.core.refresh() }
Regards
You need to define your own headerCellTemplate for the column. In the template, add a input text box and a button too. Then, define a function in the controller and call it using the external scope which will filter the records.
Related
I just saw this link which is a great explanation by onabai, but i´m trying to also set a template for the temporary popup and i can´t make it work:
$(".k-grid-popup", grid.element).on("click", function () {
// Temporarily set editable to "popup"
grid.options.editable = "popup";
// Insert row
grid.addRow();
// Revert editable to inline
grid.options.editable = "inline";
});
How do you set the template of the popup?
Regards.
While you can access the grid options directly, any change to the options should be made using the setOptions method. This function will notify the grid of any options change and it will be able to make all the internal change the handle the event according the the new options.
$(".k-grid-popup", grid.element).on("click", function () {
grid.setOptions({editable: "popup"});
grid.addRow();
grid.setOptions({editable: "inline"});
});
I don't have any working example of your code so I can't tell if you need to change something else in your code.
how can add new control from controller
// create a simple Input field
var oInput1 = new sap.m.Text('input1');
oInput1.setText("Some Text ");
oInput1.setTooltip("This is a tooltip ");
// attach it to some element in the page
oInput1.placeAt("sample1");
in view I add holder
try to add text from controller but it not display on screen.
var oLayout = this.getView().byId("idholder");
oLayout.addContent(oInput1);
is Run-time add new control is not possible. we have always render control in view and then update it is this good practice we have to follow ?
The placeAt() method is normally only used to place a View or App into the HTML.
If you want to add a UI5 control on your view, you can do it this way from the controller:
this.getView().addContent(oInput1);
But most likely you won't add controls directly to the view, but rather inside a layout or something inside your view. In that case, do it like this:
var oLayout = this.getView().byId("idOfYourSpecificLayoutFrame");
oLayout.addContent(oInput1);
I am using kendo grid and its build-in functionality for creating and updating items.
I'm looking for a way to change Editor labels (title and buttons Update/Cancel).
I found an answer here (Change Button text in Kendo Ui Grid Popup Window) where OnaBei explains how to change title.
However, I still cannot figure out the way to change button names based on whether item is being added or being edited. The same with title, is it a way to change it based on "create"/"update" state?
I assume that it can be done with javascript, but it will probably be a hack and dirty solution.
This can be done in the edit event of the grid. The model event argument has a isNew method which will return true in "create" state. Here is some sample code:
edit: function(e) {
var title = "Edit mode";
if (e.model.isNew()) {
title = "Insert mode";
}
var wnd = e.container.data("kendoWindow");
wnd.title(title);
}
And a live demo: http://jsbin.com/USUpAZUT/1/edit
I am using MVVM framework(view/viewmodel). I have a hyperlinked field on one of the kendo grid columns. My requirement is that on clicking the hyperlink on the grid, viewmodel function should call. I am trying to achieve this but not able to call. Please suggest any approach for this.
Define a template as:
template: 'Click-me',
And then define SayHello function as:
function SayHello(me) {
alert("hello");
var item = $("#grid").data("kendoGrid").dataItem($(me).closest("tr"));
console.log("item", item);
item.sayGoodbye();
}
NOTE: That SayHello needs to be global.
Where sayGoodbye is defined in your model.
Example here http://jsfiddle.net/OnaBai/2p3yH/
Is it possible to identify on a kendo UI grid which field was altered on a row edit?
Right now I am sending the entire row to the server that was changed. I would like to send
the request to the server to also include a variable holding the name
of the field that was edited.
Is something like that supported by kendo or
is there a work around for that?
This is not supported out of the box. However the grid API should allow this to be implemented. Check the edit and save events. In there you can listen to changes of the model instance which is currently being edit. Here is a quick example:
$("#grid").kendoGrid({
edit: function(e) {
e.model.unbind("change", model_change).bind("change", model_change);
}
});
function model_change(e) {
var model = this;
var field = e.field;
// store somewhere the field and model
}