How to clear Kendo grid rows without invoking databound method? - asp.net-mvc-4

I have a grid with databound method which shows the message 'No Data Found for the search' in case no data gets retrieved after performing search. Now i have added a radio buttons which when clicked needs to clear the old data from the grid. The issue is i am using the code $(grid).data("kendoGrid").dataSource.data([]); which does clear the grid but it also shows 'No Data Found for the search' message. Since user didn't perform any search but only changed the radio button it doesn't seem right to display that message in the grid. So, i was wondering if there was a way to clear the grid without invoking the databound method.
Grid code that calls databound function:
#(Html.Kendo().Grid<SearchModel>()
.Events(events => events.DataBound("gridDataBound"))
Databound code:
function gridDataBound(e) {
var grid = e.sender;
var gridName = "#" + grid.table.context.id;
if (grid.dataSource.total() == 0) {
var colCount = grid.columns.length;
$(e.sender.wrapper)
.find('tbody')
.append('<tr class="kendo-data-row"><td colspan="' + colCount + '" class="no-data">No Records Meet Your Search Criteria.</td></tr>');
}
$(gridName).find(".k-pager-wrap").hide();
};
Thanks.

As far as i know there is no way of doing this without putting an e.preventDefault() in the dataBound function. What you can do is maybe make a boolean that your dataBound function uses to check whether it should display the message or not?

Related

Modifying column header names in Master-Detail grid in Devexpress

I have a Master-Detail set up with 2 grids. On the master grid, I have the ShowOnlyPredefinedDetails option set to false.
This means that I see a little + sign that allows me to expand the details of the detail grid (in the master grid). I would like to rename
some columns in that section as well as hide certain columns. I'm using VB.NET How do I go about this. See image.
You can accomplish this by using the grid control ViewRegistered event, from there you can modify the columns in that grid view that have columns within them that you want to modify, rename, or remove. Here is an example, I hope that it helps:
private void myGridControl_ViewRegistered(object sender, DevExpress.XtraGrid.ViewOperationEventArgs e)
{
if (e != null)
{
if (e.View != null)
{
//Inside of this statement you can adjust, add, and modify all of the columns inside of that grid that appears when you click on the +
(e.View as GridView).Columns["myHiddenColumn"].Visible = false;
(e.View as GridView).Columns.Add(new GridColumn() { Name = "AddColumn", Caption = "Name To Display", Visible = true, FieldName = "DataField"});
(e.View as GridView).Columns["DataField"].OptionsColumn.AllowEdit = false;
(e.View as GridView).Columns["DataField"].OptionsColumn.AllowFocus = false;
(e.View as GridView).Columns["DataField"].OptionsColumn.ReadOnly = true;
}
}
}
I think all you need to do is create a second grid view for your details. If you haven't already done this, do the following:
In your grid designer, click "Retrieve Details" if you have not already done so. This will cause the designer to recognize that you have a second level in your bound object:
Once you see the second layer, now you need a new grid view for it. Click on "Click here to change view" and select "Create a new view" and pick "GridView."
Now you will see both grid views from the designer, and clicking on one or the other will change the context of the menus to the left:
For example, if you have gridView2 selected, when you click on the "Layout" menu, it will show the current layout for your detail grid rather than the master grid. From here, you can remove or add columns as you see fit. Likewise, from the "Columns" menu you will see the new columns (you may have to add them to the view by dragging them over), and you can change the Caption property to change the text of the title.
I suggest you use the Data Annotation attributes with properties of your data-classes to declare how you data should be displayed in GridControl:
To skip column generation for the specific property you can mark this property with the <DisplayAttribute(AutoGenerateField := false)> declaration.
To prevent column from displaying you can mark this property with the <DisplayAttribute(Order := -1)> declaration. Later, user can show this column via Column Chooser UI.
To specify the column caption use the <DisplayAttribute(Name := "YOUR CAPTION")> declaration.
You can also control filtering/editing/formatting and validation capabilities.
Related Links:
Tutorial: Create and Manage Data in Code and Apply Data Annotation Attributes
Video Tutorial: Create and Manage Data in Code and Apply Data Annotation Attributes

Kendo UI Combo Box Reset Value

I'm using the Kendo UI ComboBoxes in cascade mode to build up a filter that I wish to apply.
How do I clear/reset the value of a Kendo UI ComboBox?
I've tried:
$("#comboBox").data("kendoComboBox").val('');
$("#comboBox").data("kendoComboBox").select('');
$("#comboBox").data("kendoComboBox").select(null);
all to no avail. The project is an MVC4 app using the Razor engine and the code is basically the same as the Kendo UI example.
If you want to use select the you need to provide the index of the option. Otherwise use text
$("#comboBox").data("kendoComboBox").text('');
Example: http://jsfiddle.net/OnaBai/4aHbH/
I had to create my custom clear function extending involved Kendo UI controls like the following:
kendo.ui.ComboBox.fn.clear = kendo.ui.AutoComplete.fn.clear = function () {
if (!!this.text) {
this.text("");
}
if (!!this.value) {
this.value(null);
}
this._prev = this.oldIndex = this._old = this._last = undefined;
};
Then you can call $("mycontrol").data("kendoAutoComplete").clear(); to clear the control and have the change handler invoked when doing the following: select an item, clear and select again the previous item.
This also works:
$("#comboBox").data("kendoComboBox").value(null);
I've found these options below seem to work to reset the kendo combo box. You can run $("#comboBox").data("kendoComboBox").select() after trying two below and you should see a value returned of -1, indicating its reset.
$("#comboBox").data("kendoComboBox").value('')
$('#comboBox').data().kendoComboBox.value('')
$("#comboBox").data("kendoComboBox").select(-1)
$('#comboBox').data().kendoComboBox.select(-1)

Dojo EnhancedGrid and programmatic selection

Here's my problem: in my application I have a Dojo EnhancedGrid, backed up by an ItemFileReadStore. The page flow looks like this:
The user selects a value from a selection list.
The item from the list is posted on a server and then the grid is updated with data from the server (don't ask why, this is how it's supposed to work)
The new item is highlighted in the grid.
Now, the first two steps work like a charm; however, the third step gave me some headaches. After the data is successfully POSTed to the server (via dojo.xhrPost() ) the following code runs:
myGrid.store.close();
myGrid._refresh();
myGrid.store.fetch({
onComplete : function(items) {
for ( var i = 0; i < items.length; i++) {
if (items[i].documentType[0].id == documentTypeId) {
var newItemIndex = myGrid.getItemIndex(items[i]);
exportMappingGrid.selection.deselectAll();
exportMappingGrid.selection.addToSelection(newItemIndex);
}
}
}
});
Now, the selection of the grid is updated (i.e. the selection object has a selectedIndex > 0), but visually there's no response, unless I hover the mouse over the "selected" row. If I remove the .deselectAll() line (which I suspected as the culprit) then I sometimes end up with two items selected at once, although the grid selectionMode attribute is set to single.
Any thoughts on this one?
Thanks a lot.
You need to use setSelected(), like so
exportMappingGrid.selection.setSelected(newItemIndex, true);
The second parameter is true to select the row, false to unselect it.
This is what works for me:
grid.selection.clear();
grid.selection.addToSelection(newItemIndex);
grid.selection.getFirstSelected();
Jon

Caliburn.micro propertychanged problem in a view

I use Caliburn.Micro for my Silverlight application.
I have a view/viewmodel to create a new Item.
On the view there is one combobox.
The first time I open the view , fill in all fields, the Item is saved correctly.
The second time I open the view, fill in all fields, all teh values of them are changed in the object, except the value of the combobox, this property of Item stays 0 (it's an integer).
Any ideas why this is? I think the Caliburn framework is doing something weird.
thanks,
Filip
The code to open the view was:
EventAggreg.EventAgg.Publish(new ObjectDetailEvent() { ObjectDetail = new ObjectDTO() });
I replaced it with:
EventAggreg.EventAgg.Publish(new ObjectDetailEvent() { ObjectDetail = new ObjectDTO { LandId = 0 } });
LandId is the property bound to the combobox.
So when this is filled in by default, teh notify works perfect every time.

How to filter flex datagrid with three check boxes.?

I am new to flex.
I need your help. Can anyone help me please.
My Requirement:
Flex Datagrid should be filter based on 3 checkboxes.(Checkboxes can be checked with several combinations).
My Code:
Checkboxes:
Data Provider:
MXML code:
Here i have to filter the datagrid when i check the different combinations of 3 checkboxes.
The checkbox values are from Staus column of arraycollection.
When i select 'completed' checkbox and 'onhold' check box, datagrid should display only those records which have Status as "Completed" & "On Hold".
Similarly for all combinations of c
Can anyone give simple solution please ?
Thanks,
Anand.k
Use an ArrayCollection as your dataProvider and assign a filtering function to its filterFunction property :
var provider:ArrayCollection;
At the part where you instantiate your array, give it a filterFunction :
provider.filterFunction = myFilteringFunction;
With the code of the filterFunction like this :
private function myFilteringFunction(item:ObjectTypeInYourArray) : Boolean {
var show:Boolean;
if(item.completed == checkBox1.checked &&
item.onHold == checkBox2.checked){
show = true;
}
return show;
}
It's an example with two checkboxes. The type of value assigned to the completed and onHold attributes of your object may not be boolean so you'll have to convert them somehow before comparing them to the state of the checkboxes but I think you get the idea.
Basically the filterFunction that you pass to your arraycollection is applied to each of the items inside and return true or false depending on you code inside (e.g check if the object has the right values for its properties). When true the values are showed
At the change events of your checkboxes, you refresh the dataProvider :
provider.refresh();
Hope that helps