This question is locked. New answers and comments are not allowed.
Hi guys!
I have a new problem with the foreign key option, I followed the steps of this page and even so doesn't work and i don't understand what is the problem.
The code:
prueba_grid.php
I have a new problem with the foreign key option, I followed the steps of this page and even so doesn't work and i don't understand what is the problem.
The code:
prueba_grid.php
<! DOCTYPE html><html><head> <title>Pagina de prueba</title><link rel="stylesheet" type="text/css" href="styles/kendo.blueopal.min.css"><link href="styles/kendo.common.min.css" rel="stylesheet" type="text/css"><script type="text/javascript" src="js/jquery.min.js"></script><script type="text/javascript" src="js/kendo.web.min.js"></script><script type="text/javascript" src="js/cultures/kendo.culture.es-ES.min.js"></script><script type="text/javascript"> $(function() { kendo.culture("es-ES"); var categorias = new kendo.data.DataSource({ transport: {read:"categorias_usuarios.php"} }); var datos= new kendo.data.DataSource( {transport: {read: "datos_grid.php",create: {url: "create_data.php",type: "POST"},update:{ url: "update_data.php", type:"POST"}, destroy:{ url: "delete_data.php", type:"POST"}},error: function(e) { alert(e.responseText); },schema: {data: "data",total: function(result) { var data = this.data(result); return data ? data.length : 0 },model: {id: "cod_maestros",fields: {id: {nullable:true,editable:false},nombres_usuarios: {validation: {required: true}},apellidos_usuarios: {validation: {required: true}},cod_nivel_usuario:{field:"cod_nivel_usuario"}}},pageSize: 5,batch: true}} ); var grid = $("#grid").kendoGrid({dataSource:datos ,columns: [{title: "Nombres del Usuario",field: "nombres_usuarios",type: "text"}, {title: "Apellidos del Usuario",field: "apellidos_usuarios",type: "text"}, {title: "Nivel", field: "cod_nivel_usuario",values:categorias}, {command: ["edit", "destroy"],title: " ",width: "210px"}],pageable: {refresh: true,pageSizes: 5},toolbar:[{name:"create",text:"Agregar nuevo registro"}, {template: kendo.template($("#template").html())}],editable: "inline"}); $("#category").keyup(function() { var value = $(this).val(); if (value) { grid.data("kendoGrid").dataSource.filter({logic: "or",filters: [{field: "nombres_usuarios",operator: "contains",value: value}, {field: "apellidos_usuarios",operator: "contains",value: value}]}) } else { grid.data("kendoGrid").dataSource.filter({}) } });});</script></head><body><div id="grid"></div><script type="text/x-kendo-template" id="template"> <div class="toolbar" style="display:inline-block"> <label class="category-label" for="category">Buscar:</label> <input type="text" id="category" style="width: 230px"> </div> </script> </body></html
15 Answers, 1 is accepted
0
Joshua
Top achievements
Rank 2
Iron
Veteran
Iron
Rank 2
Iron
Veteran
Iron
answered on 05 Sep 2012, 10:40 PM
The only way i can get it to work is if i use a static array. I cannot get it to work with a datasource.
0
Hello,
Rosen
the Telerik team
Indeed, the foreign key column does support only binding to a static array, as shown in this online demo. If it is required to use remote data, you should consider retrieving the data prior setting the grid configuration.
Regards,Rosen
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Joshua
Top achievements
Rank 2
Iron
Veteran
Iron
Rank 2
Iron
Veteran
Iron
answered on 10 Sep 2012, 02:43 PM
That is a pretty big limitation to scalability. I would imagine the majority of situations where foreign keys involved require some kind of database connection and you cannot bring back all of the results in the table.
0
Hello Joshua,
Rosen
the Telerik team
Unfortunately, in order to show/match the foreign key value base on the id in the column will require the entire data. Also generally speaking it will be insufficient to do multiple requests to the server for the same data.
Regards,Rosen
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Joshua
Top achievements
Rank 2
Iron
Veteran
Iron
Rank 2
Iron
Veteran
Iron
answered on 11 Sep 2012, 01:21 PM
I do recognize the challenges that you all face from a programmatic perspective. However you should add something to the documentation to say that it is only suitable for small sets of items. Without this kind of notice, people will continue to try and use it in a manner that it is not suited for. Such as when you want to search for items that could number in the thousands and performance considerations would prohibit pulling down 10k records. I also recognize that you should not be using a drop down to perform this task, which should make someone consider a different paradigm all together.
0
Andres
Top achievements
Rank 1
Rank 1
answered on 11 Dec 2012, 02:26 PM
So, after loosing several days of trying to use a remote foreign key I found this post. I agree with Joshua that you need to put in the documentation this limitation.
However I have a question about it .... If you use the MVC wrappers is straight forward to use the foreign key column but if you are using a web api approach doesn't. There is a demo or a tutorial of how to use a foreign key binded to a remote datasource in a grid in similar fashion as it's generated by the MVC wrappers?
Thanks in advance.
However I have a question about it .... If you use the MVC wrappers is straight forward to use the foreign key column but if you are using a web api approach doesn't. There is a demo or a tutorial of how to use a foreign key binded to a remote datasource in a grid in similar fashion as it's generated by the MVC wrappers?
Thanks in advance.
0
Hello Andres,
Rosen
the Telerik team
As I have already mentioned you can use either the built-in foreign key column and retrieve the data prior setting the grid configuration. Or use a custom column editor instead.
All the best,Rosen
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Andres
Top achievements
Rank 1
Rank 1
answered on 13 Dec 2012, 12:03 PM
I tried before with the custom column editor but it lacks of the foreign key filters. Can you show me a demo of how to preload the data?
Thanks in advance.
Thanks in advance.
0
Joshua
Top achievements
Rank 2
Iron
Veteran
Iron
Rank 2
Iron
Veteran
Iron
answered on 13 Dec 2012, 02:04 PM
If you are going to use a custom editor then you are going to need to do your own foreign key calculation.
If you use the built in foreign key calculation, then you should use small data sets.
Overall we are using a great product, but it still has some limitations, which are to be expected.
If you use the built in foreign key calculation, then you should use small data sets.
Overall we are using a great product, but it still has some limitations, which are to be expected.
0
Andres
Top achievements
Rank 1
Rank 1
answered on 13 Dec 2012, 06:07 PM
Yes, I already know how to use the custom editor. It works great but it lacks of column filtering. So, I want to use the built in calculation but I don't know how to be sure that the foreign key datasource is already loaded in order to configure the grid afterwards.
0
Hello Andres,
Rosen
the Telerik team
The easiest way will be to use jQuery to retrieve the "foreign" data and to create the Grid widget within the success callback. Here you can find a small sample which demonstrates this approach.
Greetings,Rosen
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Ibrahim
Top achievements
Rank 1
Rank 1
answered on 18 Dec 2012, 02:37 PM
what if i tried to change the filter menu (dom) control and change it to a remote combobox
var url='',//url to data
g = $('#grid').data('kendoGrid'),
cell = g.thead.find("th:not(.k-hierarchy-cell,.k-group-cell)")[2], //category columns
input = $('input[data-bind]', $(cell).data("kendoColumnMenu").filterMenu.element),
$(input).removeClass('k-textbox').removeAttr('data-role');
$(input[0]).kendoComboBox({
dataTextField: "Name",
dataValueField: "Id",
filter: "contains",
dataSource: {
serverFiltering: true,
transport: {
read: url
}
}
});
$(input[1]).kendoComboBox({
dataTextField: "Name",
dataValueField: "Id",
filter: "contains",
dataSource: {
serverFiltering: true,
transport: {
read: url
}
}
});
var url='',//url to data
g = $('#grid').data('kendoGrid'),
cell = g.thead.find("th:not(.k-hierarchy-cell,.k-group-cell)")[2], //category columns
input = $('input[data-bind]', $(cell).data("kendoColumnMenu").filterMenu.element),
$(input).removeClass('k-textbox').removeAttr('data-role');
$(input[0]).kendoComboBox({
dataTextField: "Name",
dataValueField: "Id",
filter: "contains",
dataSource: {
serverFiltering: true,
transport: {
read: url
}
}
});
$(input[1]).kendoComboBox({
dataTextField: "Name",
dataValueField: "Id",
filter: "contains",
dataSource: {
serverFiltering: true,
transport: {
read: url
}
}
});
0
Bob
Top achievements
Rank 1
Rank 1
answered on 18 Dec 2012, 04:11 PM
We have run into similar issues. I think the brain block is thinking that the column should contain the foreign key rather than the actual display value. If your datasource includes the value rather than the key then you don't need to pre-populate a selection datasource and you can use an autocomplete type editor template.
And yes, in your post action you would have to do a lookup to find the key value to store in your table.
Currently, the only way to do this is manually. However, it would be nice if there were some type of column that allowed for this use case, since I agree, it is very common.
The better option may even be to not edit in the grid... use a pop-up editor mode or a link to an edit for where an autocomplete control can be used. As you say, bringing back thousands of possible values for a lookup isn't an option. We tend to as a rule only use a dropdownList if the set of choices is 100 or less.
And yes, in your post action you would have to do a lookup to find the key value to store in your table.
Currently, the only way to do this is manually. However, it would be nice if there were some type of column that allowed for this use case, since I agree, it is very common.
The better option may even be to not edit in the grid... use a pop-up editor mode or a link to an edit for where an autocomplete control can be used. As you say, bringing back thousands of possible values for a lookup isn't an option. We tend to as a rule only use a dropdownList if the set of choices is 100 or less.
0
JCSCo
Top achievements
Rank 1
Rank 1
answered on 25 Jun 2014, 03:33 PM
Is there a way to use this with more than one drop down list? I have 3 drop downs in a grid.
0
Hello Chris,
Are you referring to the approach shown in the sample from my previous message? If yes then indeed it can be used to load values for multiple foreign key column. However, you will need to wait for all of the requests to complete before assigning the result to the grid. Here you can find a modified version of the sample.
On a side note, as the thread is quite old now and the discussion diverge from the original question I would like to ask you to open a separate support query if additional questions arise.
Regards,
Rosen
Telerik
Are you referring to the approach shown in the sample from my previous message? If yes then indeed it can be used to load values for multiple foreign key column. However, you will need to wait for all of the requests to complete before assigning the result to the grid. Here you can find a modified version of the sample.
On a side note, as the thread is quite old now and the discussion diverge from the original question I would like to ask you to open a separate support query if additional questions arise.
Regards,
Rosen
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!