I have a search criteria where there is a dropdownlist with 4 options and a text box for search text.. Now on click of search button, I need to show four different kendo grids but only one at a time based on which value is selected from dropdownlist..
So, what I am following is :
I have a div with below tag:
<div id='mygrid'> </div>
I want to keep only this div but I want to render 4 different grids here. This is because for one option of dropdown, we need to show grid which have 3 columns but for other options there are number of columns differentiating.
So in script tag:
<script>
Here i have created 4 different data sources which are working fine . on click of search button, I check the value of drop down, if it is blah blah, I call a function which contains different grid loads method.
So in this technique ,the new grid is not getting rendered in the same div.. Any ideas or suggestions that I can use to achieve this </script>
As I have posted the question from phone, the code is not showing.
Related
Here's my situation. I have a main grid, where each row expands to show 2 tabs. The first tab has another grid, with dynamically columns. One of the columns needs to display a template with a modified Kendo Menu (in order for it to look like a dropdown).
When the column is rendered in the main grid, it works just fine. However, when I move that column to the sub-grid, I just see the list, without the kendo menu applied to it.
Two workarounds I tried:
http://dojo.telerik.com/OmiBu/3
Visuals:
Good and Bad
I am using a kendo grid to display my data. I want to show another kendo grid inside one cell of my kendo grid. Is there anyway I can achieve this?
There is a 'way' (using the "template" option of the corresponding Grid column), however I would suggest to instead use Grid hierarchy to show details about current row:
Grid: hierarchy demo
Nesting another Grid inside cells of current Grid is not a good idea as it will not be usable, it will reduce the page performance etc.
I have a dynamic Kendo grid, for which I get the data every time from the server with the column configuration. The grids renders the data as expected, but sometimes the grid does not render the data at all and only renders the column headers. The grid does not even recognize the column configuration, which mentions whether the column is hidden or not, column title etc.
When I refresh(ctrl+f5) the browser page the grids starts displaying normally.
When I checked the html generated in both cases I saw following difference
1- The Grid which displays correctly
Has a thead and tbody inside a single table
2- The Grid which does not display the data
Has two different divs for header and content
Please see the following image for Good Grid
And following image for Bad Grid
I am not sure why the same grid has two different htmls? Can anyone please help?
EDIT
One more thing that might be helpful.
The kendo grid definition is in a content.html file. And this file is used as a content URL for kendo tabstrip control. There are around 7 tabs and all the tabs are refering to the same content file.
I am developing a kendo grid in my HTML page (not MVC app) and it gets about 500+ records from the backend service. I have 4 Kendo dropdown lists in each row and 2 are getting values from local variables and other 2 are getting data from ajax calls.
When I try to edit any dropdown list, it goes to the editor function of the column, but takes long time to show the values in dropdown list and sometimes the IE page crashes. I am using IE11.
Do you have any best practices to work with Kendo dropdown list type if the grid has more records say > 200 records.
When I need to show that many results in a dropdown list I usually create an autocomplete combobox instead. You can show, for example, 10 results and have the server return more results as the user types.
I have a grid control displaying data about a Company. I want one column to be "Employee". On click on the any cell of "Employee" column I want to pop up the one Form called "Employee Details" and would like to feel the data.
How can I do this?
As I understand the modal form on click of a jqgrid cell deals with data only related to that row. I want to show different data on the pop up form, i.e. other than the grid data.
Pl help.
Shivali
Probably you can use unobtrusive links in the column (see this and this answers). The advantage of this technique is that instead of typical links you can define any custom action on click on the link. The look of the link can be defined by CSS, but it seems to the that the link can show the user better as other HTML elements, that the user can click on it.
Alternative you can use a button in the column with respect of the custom formatter, but with the same technique as described before you can free define which action will be done on the click.
Inside of the click event with the parameter 'e' you have e.currentTarget as the DOM element of <a> for the link or <input> or <button> if you use buttons in the grid column. To find the row id you can use var row = $(e.currentTarget).closest("tr.jqgrow") or var row = $(e.target).closest("tr.jqgrow") to find the <tr> element. The row id will be row[0].id.