Grid selectable problem

[Faruk]

I have a grid that I bind explicitly with method .data("kendoGrid").dataSource.read();

But the selectable property is not working for the grid. I cannot select the databound columns. I guess this is somewhat due to the fact that I bind the grid explicitly.

Do I have to do something else work selectable to work?

searchGrid = $("#SearchGrid").kendoGrid({

            scrollable: false,

            selectable: "multiple row",

            autoBind: false,

            dataBound: gridDataBound,

            select: rowSelected,

            columns: [

                {

                    field: "Book.Code",

                    title: "Kitap",

                    width: 60

                },

                {

                    field: "No",

                    title: "Poz No",

                    width: 100

                },

                {

                    field: "Description",

                    title: "Tanım"

                },

                {

                    field: "Unit",

                    title: "Birim",

                    width: 60

                },

                {

                    field: "UnitPrice.Value",

                    title: "Birim Fiyat",

                    template: '#= kendo.format("<b>{0:yyyy}</b> : {1:c}", new Date(UnitPrice.Date), UnitPrice.Value) #',

                    width: 120

                }

            ],

            dataSource: new kendo.data.DataSource({

                serverFiltering: true,

                serverPaging: true,

                transport: {

                    read: {

                        url: "/Api/Item",

                        cache: true

                    },

                    parameterMap: function () {

                        var searchText = searchSuggest.data("kendoAutoComplete").value();

                        var bookID = books.data("kendoDropDownList").dataItem().ID;

                        var searchField = searchFields.data("kendoDropDownList").dataItem().Value;

                        var priceYear = priceYears.data("kendoDropDownList").dataItem();

 

                        return {

                            searchText: searchText,

                            bookID: bookID == "" ? "null" : bookID,

                            searchField: searchField,

                            priceYear: priceYear == "Tüm Yıllarda" ? "null" : priceYear

                        };

                    }

                }

            })

        });

[Vladimir Iliev]

Hi Fatuk,

 

I tried to reproduce the problem locally but to no avail – everything is working as expected on our side. Could you please provide more information about your current setup or run-able project where the issue can be reproduced? 

For convenience I prepared a small sample, based on the information that you provided so far and attached it to this thread. Could you please try to reproduce the issue in this example?

Kind Regards,
Vladimir Iliev
the Telerik team

[Ace]

i have this problem too.. i dont know why my grid is not selectable. Here's my sample

$("#itemlist").kendoGrid({
         columns:[
             {
                 field: "FirstName",
                 title: "First Name"
             },
             {
                 field: "LastName",
                 title: "Last Name"
         }],
         dataSource: {
             data: [
                 {
                     FirstName: "Joe",
                     LastName: "Smith"
                 },
                 {
                     FirstName: "Jane",
                     LastName: "Smith"
             }]
         },
         selectable: true
     });

[Ace]

I found the solution to my case: 

Jquery 1.8.1 and 1.8.2 ---> makes the grid selection won't work
Jquery 1.8.0 and below --> make the grid selection work.

[Ziv]

I have the same problem with KendoUi grid and jquery 1.8.2.
The selectable property does not work. Nothing happens when I click on a row.
When changing to jquery 1.7.2, it works fine.

[Mike]

I'm having the same issue and even the attached sample (http://www.telerik.com/forums/grid-selectable-problem?actionMode=replyThread#izdxzPOBIkOcRUPAocpOGA) is not working for me. Please advise.

[Mike]

So I ran the attachment in IE (11) and lo and behold it works. It also works Firefox (41.0.1). This functionality appears to be broken in the latest version of Chrome (46.0.2490.80). Please advise on a work around for Chrome.

[Mike]

So it appears there might be two problems, one of which I have solved. Some old css was making things unselectable in my project. The other problem however is that it still doesn't work in the example from above.

[Konstantin Dikov]

Hi Mike,

I have tested the attached example in the latest Chrome version (46.0.2490.80 m) and the selection is working correctly on my side. You can test the following dojo example on your end and see if any problems will be observed:

• http://dojo.telerik.com/UtIwo

I am looking forward to your reply with the results.


Regards,
Konstantin Dikov
Telerik

 

 

[Mike]

Konstantin,

 I have tested your link on my machine as well as on tw of my colleagues machines and the grid rows are NOT selectable on any of these three machines in Chrome. In my current project that uses the grid it is working however so maybe it is an issue with your example? 

 When I open the debugging tools after loading your example I do not see any error.

 Mike

[Konstantin Dikov]

Hi Mike,

I have once again tested the dojo example from my previous post and rows are selected correctly. Could you please record a short video demonstrating the behavior on your side with the dojo example?


Kind Regards,
Konstantin Dikov
Telerik

 

 

[Rekha]

Hi ,

I have a problem with grid selection--

 I have a main grid company in which I have contacts,projects,history as a link items to open their respective grids. I got stuck with a scenario .

If I click on Contacts link from the main grid it opens a Contact grid(which is child grid).if you see in the picture I clicked on first  contacts link of company ADP Boston . I want to highlight the main grid first coloum(respective columns) after I opened the child grid.

Second Problem is: If i click on projects link in main grid It should open only projects grid but here since i clicked on contacts first it is opening projects grid below the contacts grid. After I click on projects link from main grid I should close already open grids and open new grid.  

[Rekha]

Hi ,
I have a problem with grid selection--
 I have a main grid company in which I have contacts,projects,history as a link items to open their respective grids. I got stuck with a scenario .
If I click on Contacts link from the main grid it opens a Contact grid(which is child grid).if you see in the picture I clicked on first  contacts link of company ADP Boston . I want to highlight the main grid first coloum(respective columns) after I opened the child grid.
Second Problem is: If i click on projects link in main grid It should open only projects grid but here since i clicked on contacts first it is opening projects grid below the contacts grid. After I click on projects link from main grid I should close already open grids and open new grid.  Can you please help me on this .

[Konstantin Dikov]

Hi Rekha,

Before moving to your queries, when you post in the forum, please try to either open new threads or use existing threads that relate to your questions, because currently I see no correlation between the original issue and your requirements.

Now, regarding your questions. For highlighting the clicked column you should handle the click event and manually traverse the cells in the corresponding column and add custom CSS class to them. As for removing the existing grid you could use the "destroy" method and if necessary, clear the wrapping element's content, before initializing the new grid.

If other questions arise, please open a regular support ticket or separate forum thread.


Regards,
Konstantin Dikov
Telerik