Questions on Kendo UI for jQuery Forum

3 answers

537 views

Kendo Editable Grid with custom editable cell templates in angular js

Hi,

I have a requirement to build a Kendo Editable Grid for bulk records update in my Angular project

my requiremnts are

1)Custom editor controls for each cell based on types, all custom controls defined as angular directives

when user clicks on the cell based on the type i need to load a custom directive

2) each row should be in a same scope and should react with the data changes in other cell
for example if user Edit/change the selection of column A, the Column B should run some business rules to display a mask(hide) on it or it should load new data(in case of drop downs)

Please help me with any example or the approach how to achieve this scenario.

Thanks in Advance

Grid

answered on 21 Apr 2016

1 answer

128 views

Retaining dropdown state while changing it's position on web page

After opening dropdownlist, if due to some reason my dropdownlist position change on my web page, can i retain it's open state (whatever state dropdown is in before it's position change) while dropdown position is changing. Is this natively supported by control.

Please help me on this.

Thanks,

Gaurav Prajapati

DropDownList

answered on 21 Apr 2016

2 answers

106 views

"Can not type" error state

Do these steps on en empty editor and you come to a state, where can not type any character:

add a bullet and add some text
add another bullet
press backspace(the second bullet is removed and a paragraph is added instead)
press backspace(the paragraph is gone and it looks like you have press SHIFT + ENTER(for softbreak) on a bullet, but you can not type anymore

I think this is an error. In my opinion, the second time I press backspace the paragraph should be gone(as ist is) and the cursor should be at the end of line of the bullet and not beneath.

This is not critical and I don't know if the forum is the best way to report an error, but I did not find a place to do so.

Editor

answered on 21 Apr 2016

2 answers

1.2K+ views

Pie chart labels getting cut off

When the chart's width is constrained it does not scale to fit and the labels get cut off. I found this post but do not see any of these settings in the Html/Javascript version of the pie chart

http://www.telerik.com/forums/pie-chart-labels-are-being-cut-off

Changing the margins/paddings is not an ideal solution as we have dynamic data populating the pie charts so one setting that may work might not work for another dataset.

Charts

answered on 20 Apr 2016

2 answers

642 views

AngularJS not working in a column template inside the detail grid template

I am using Angular and Kendo, and have set up a simple grid with a detail template. Everything works fine, until I try to use Angular inside a column template in the detail grid.

I am using these two templates:

<script id="order-checked-template" type="text/x-kendo-template">

<input type="checkbox" #: Checked ? 'checked="checked"' : '' # ng-click="ctrl.toggleLines($event)" />

</script>

<script id="line-checked-template" type="text/x-kendo-template">

<input type="checkbox" #: Checked ? 'checked="checked"' : '' # ng-click="ctrl.toggleOrder($event)" />

</script>

The first template order-checked-template is a column template for the main grid. It creates a checkbox for a boolean field and triggers the toggleLines function on the angular controller. This part works!

The second template, line-checked-template, is a column template for the detail grid. It also creates a checkbox for a boolean field, and should trigger the toggleOrder function on the angular controller. However, it seems that the ng-click directive is not parsed when the detail grid is generated and the template is parsed.

Following the tutorial on a hierarchy grid, I configured the grid like this:

01.vm.gridOptions = {

02. columns: [

03. { field: 'Checked', template: kendo.template($("#order-checked-template").html()) }

04. // other columns

05. ],

06. dataSource: {

07. schema: {

08. model: {

09. id: 'VO_URID',

10. fields: {

11. Checked: { type: 'boolean' }

12. // other fields

13. }

14. }

15. }

16. },

17. detailInit: detailInit,

18.};

Where detailInit is:

01.function detailInit(e) {

02. $("<div class=\"detailGrid\"/>").appendTo(e.detailCell).kendoGrid({

03. columns: [

04. { field: 'Checked', template: kendo.template($("#regel-checked-template").html()) }

05. // other columns

06. ],

07. dataSource: {

08. schema: {

09. model: {

10. id: 'VOR_URID',

11. fields: {

12. Checked: { type: 'boolean' }

13. // other fields

14. }

15. }

16. }

17. }

18. });

19.}

And the grid is created like this in the HTML template:

<div id="grid-vo" kendo-grid k-options="ctrl.gridOptions"></div>

Grid

answered on 20 Apr 2016

3 answers

250 views

Preselect items on load example - not working .

I tried to run the dojo. However, I don't see " Not loaded 1" and "Not loaded 2" appear in the example .

http://docs.telerik.com/kendo-ui/controls/editors/multiselect/how-to/AngularJS/pre-select-items

Please advice.

MultiSelect

answered on 20 Apr 2016

1 answer

682 views

Kendo MVC Grid Uncaught Error: Invalid template

Hi, I'm trying to create a MVC Grid on Razor, but by the time I enter to my view page I get an error on the debugger console:

<div class="k-tabstrip-wrapper"><div class="k-widget k-tabstrip k-header" id="tabStrip_#=IdAlumno#"><ul class="k-reset k-tabstrip-items"><li class="k-item k-state-default k-state-active"><a class="k-link" href="\#tabStrip_#=IdAlumno#-1">Notas de conducta</a></li></ul><div class="k-content k-state-active" id="tabStrip_#=IdAlumno#-1" style="display:block">

<div class="k-widget k-grid" id="gridAlumnos_#=IdAlumno#"><table><colgroup><col style="width:56px" /><col style="width:150px" /><col style="width:350px" /><col style="width:100px" /></colgroup><thead class="k-grid-header"><tr><th class="k-header k-filterable" data-field="IdConductaGeneral" data-index="0" data-title="Id" scope="col"><a class="k-grid-filter" href="javascript:void(0)"><span class="k-icon k-filter"></span></a><a class="k-link" href=

"/Conducta/ObtenerNotasConductaGeneral?matricula=%23%3DMatricula%23&gridAlumnos_%23%3DIdAlumno%23-sort=IdConductaGeneral-asc"

>Id</a></th><th class="k-header k-filterable" data-field="Fecha" data-index="1" data-title="Fecha" scope="col"><a class="k-grid-filter" href="javascript:void(0)"><span class="k-icon k-filter"></span></a><a class="k-link" href="/Conducta/ObtenerNotasConductaGeneral?matricula=%23%3DMatricula%23&gridAlumnos_%23%3DIdAlumno%23-sort=Fecha-asc">Fecha</a></th><th class="k-header k-filterable" data-field="Observaciones" data-index="2" data-title="Observaciones" scope="col"><a class="k-grid-filter" href="javascript:void(0)"><span class="k-icon k-filter"></span></a><a class="k-link" href=

"/Conducta/ObtenerNotasConductaGeneral?matricula=%23%3DMatricula%23&gridAlumnos_%23%3DIdAlumno%23-sort=Observaciones-asc"

>Observaciones</a></th><th class="k-header k-filterable" data-field="Conducta" data-index="3" data-title="Conducta" scope="col"><a class="k-grid-filter" href="javascript:void(0)"><span class="k-icon k-filter"></span></a><a class="k-link" href="/Conducta/ObtenerNotasConductaGeneral?matricula=%23%3DMatricula%23&gridAlumnos_%23%3DIdAlumno%23-sort=Conducta-asc">Conducta</a></th></tr></thead><tbody><tr class="k-no-data"><td colspan="4"></td></tr></tbody></table><div class="k-pager-wrap k-grid-pager"><a class="k-link k-pager-nav k-state-disabled k-pager-first" data-page="1" href="\#" title="Ir a la primera página"><span class="k-icon k-i-seek-w">seek-w</span></a><a class="k-link k-pager-nav k-state-disabled" data-page="0" href="\#" title="Ir a la página anterior"><span class="k-icon k-i-arrow-w">arrow-w</span></a><ul class="k-pager-numbers k-reset"><li><span class="k-state-selected" data-page="1">1</span></li></ul><a class="k-link k-pager-nav k-state-disabled" data-page="2" href="\#" title="Ir a la página siguiente"><span class="k-icon k-i-arrow-e">arrow-e</span></a><a class="k-link k-pager-nav k-state-disabled k-pager-last" data-page="1" href="\#" title="Ir a la última página"><span class="k-icon k-i-seek-e">seek-e</span></a><span class="k-pager-info k-label">No hay datos.</span></div></div><script>

jQuery(function(){jQuery("\#gridAlumnos_#=IdAlumno#").kendoGrid({"columns":[{"title":"Id","headerAttributes":{"data-field":"IdConductaGeneral","data-title":"Id"},"width":"56px","field":"IdConductaGeneral","filterable":{"messages":{"info":"Mostrar filas con valor que","isTrue":"Si","isFalse":"No","filter":"Filtrar","clear":"Limpiar filtro","and":"Y","operator":"Operador","value":"Valor","cancel":"Cancelar"},"operators":{"string":{"eq":"Es igual a","neq":"No es igual a","startswith":"Comienza con","endswith":"Termina en","contains":"Contiene","doesnotcontain":"No contiene","isnull":"Is null","isnotnull":"Is not null","isempty":"Is empty","isnotempty":"Is not empty"},"number":{"eq":"Es igual a","neq":"No es igual a","gte":"Es mayor o igual que","gt":"Es mayor que","lte":"Es menor o igual que","lt":"Es menor que","isnull":"Is null","isnotnull":"Is not null"},"date":{"eq":"Es igual a","neq":"No es igual a","gte":"Es posterior o igual a","gt":"Es posterior","lte":"Es anterior o igual a","lt":"Es anterior","isnull":"Is null","isnotnull":"Is not null"},"enums":{"eq":"Es igual a","neq":"No es igual a","isnull":"Is null","isnotnull":"Is not null"}}},"encoded":true},{"title":"Fecha","headerAttributes":{"data-field":"Fecha","data-title":"Fecha"},"width":"150px","template":"#= kendo.toString(FechaInicio, \"MM/dd/yyyy \") #","field":"Fecha","filterable":{"messages":{"info":"Mostrar filas con valor que","isTrue":"Si","isFalse":"No","filter":"Filtrar","clear":"Limpiar filtro","and":"Y","operator":"Operador","value":"Valor","cancel":"Cancelar"},"operators":{"string":{"eq":"Es igual a","neq":"No es igual a","startswith":"Comienza con","endswith":"Termina en","contains":"Contiene","doesnotcontain":"No contiene","isnull":"Is null","isnotnull":"Is not null","isempty":"Is empty","isnotempty":"Is not empty"},"number":{"eq":"Es igual a","neq":"No es igual a","gte":"Es mayor o igual que","gt":"Es mayor que","lte":"Es menor o igual que","lt":"Es menor que","isnull":"Is null","isnotnull":"Is not null"},"date":{"eq":"Es igual a","neq":"No es igual a","gte":"Es posterior o igual a","gt":"Es posterior","lte":"Es anterior o igual a","lt":"Es anterior","isnull":"Is null","isnotnull":"Is not null"},"enums":{"eq":"Es igual a","neq":"No es igual a","isnull":"Is null","isnotnull":"Is not null"}}},"encoded":true},{"title":"Observaciones","headerAttributes":{"data-field":"Observaciones","data-title":"Observaciones"},"width":"350px","field":"Observaciones","filterable":{"messages":{"info":"Mostrar filas con valor que","isTrue":"Si","isFalse":"No","filter":"Filtrar","clear":"Limpiar filtro","and":"Y","operator":"Operador","value":"Valor","cancel":"Cancelar"},"operators":{"string":{"eq":"Es igual a","neq":"No es igual a","startswith":"Comienza con","endswith":"Termina en","contains":"Contiene","doesnotcontain":"No contiene","isnull":"Is null","isnotnull":"Is not null","isempty":"Is empty","isnotempty":"Is not empty"},"number":{"eq":"Es igual a","neq":"No es igual a","gte":"Es mayor o igual que","gt":"Es mayor que","lte":"Es menor o igual que","lt":"Es menor que","isnull":"Is null","isnotnull":"Is not null"},"date":{"eq":"Es igual a","neq":"No es igual a","gte":"Es posterior o igual a","gt":"Es posterior","lte":"Es anterior o igual a","lt":"Es anterior","isnull":"Is null","isnotnull":"Is not null"},"enums":{"eq":"Es igual a","neq":"No es igual a","isnull":"Is null","isnotnull":"Is not null"}}},"encoded":true},{"title":"Conducta","headerAttributes":{"data-field":"Conducta","data-title":"Conducta"},"width":"100px","field":"Conducta","filterable":{"messages":{"info":"Mostrar filas con valor que","isTrue":"Si","isFalse":"No","filter":"Filtrar","clear":"Limpiar filtro","and":"Y","operator":"Operador","value":"Valor","cancel":"Cancelar"},"operators":{"string":{"eq":"Es igual a","neq":"No es igual a","startswith":"Comienza con","endswith":"Termina en","contains":"Contiene","doesnotcontain":"No contiene","isnull":"Is null","isnotnull":"Is not null","isempty":"Is empty","isnotempty":"Is not empty"},"number":{"eq":"Es igual a","neq":"No es igual a","gte":"Es mayor o igual que","gt":"Es mayor que","lte":"Es menor o igual que","lt":"Es menor que","isnull":"Is null","isnotnull":"Is not null"},"date":{"eq":"Es igual a","neq":"No es igual a","gte":"Es posterior o igual a","gt":"Es posterior","lte":"Es anterior o igual a","lt":"Es anterior","isnull":"Is null","isnotnull":"Is not null"},"enums":{"eq":"Es igual a","neq":"No es igual a","isnull":"Is null","isnotnull":"Is not null"}}},"encoded":true}],"pageable":{"buttonCount":10,"messages":{"display":"Elementos mostrados  {0} - {1} de {2}","empty":"No hay datos.","page":"Página","of":"de {0}","itemsPerPage":"artículos por página","first":"Ir a la primera página","previous":"Ir a la página anterior","next":"Ir a la página siguiente","last":"Ir a la última página","refresh":"Actualizar","morePages":"Mas paginas"}},"sortable":true,"filterable":{"extra":false,"messages":{"info":"Mostrar filas con valor que","isTrue":"Si","isFalse":"No","filter":"Filtrar","clear":"Limpiar filtro","and":"Y","operator":"Operador","value":"Valor","cancel":"Cancelar"},"operators":{"string":{"eq":"Es igual a","neq":"No es igual a","startswith":"Comienza con","endswith":"Termina en","contains":"Contiene","doesnotcontain":"No contiene","isnull":"Is null","isnotnull":"Is not null","isempty":"Is empty","isnotempty":"Is not empty"},"number":{"eq":"Es igual a","neq":"No es igual a","gte":"Es mayor o igual que","gt":"Es mayor que","lte":"Es menor o igual que","lt":"Es menor que","isnull":"Is null","isnotnull":"Is not null"},"date":{"eq":"Es igual a","neq":"No es igual a","gte":"Es posterior o igual a","gt":"Es posterior","lte":"Es anterior o igual a","lt":"Es anterior","isnull":"Is null","isnotnull":"Is not null"},"enums":{"eq":"Es igual a","neq":"No es igual a","isnull":"Is null","isnotnull":"Is not null"}}},"scrollable":false,"messages":{"noRecords":"No records available."},"dataSource":{"type":(function(){if(kendo.data.transports['aspnetmvc-ajax']){return 'aspnetmvc-ajax';} else{throw new Error('The kendo.aspnetmvc.min.js script is not included.');}})(),"transport":{"read":{"url":"/Conducta/ObtenerNotasConductaGeneral?matricula=#=Matricula#"},"prefix":""},"pageSize":5,"page":1,"total":0,"serverPaging":true,"serverSorting":true,"serverFiltering":true,"serverGrouping":true,"serverAggregates":true,"filter":[],"schema":{"data":"Data","total":"Total","errors":"Errors","model":{"fields":{"IdConductaGeneral":{"type":"number"},"Matricula":{"type":"number"},"Fecha":{"type":"date"},"Conducta":{"type":"string"},"IdUsuario":{"type":"number"},"Observaciones":{"type":"string"},"Status":{"type":"number"}}}}}});});

<\/script>

</div></div></div><script>

jQuery(function(){jQuery("\#tabStrip_#=IdAlumno#").kendoTabStrip({"animation":{"open":{"effects":"fade:in","duration":400}}});});

<\/script>

' Generated code:'var $kendoOutput, $kendoHtmlEncode = kendo.htmlEncode;with(data){$kendoOutput='\n <div class="k-tabstrip-wrapper"><div class="k-widget k-tabstrip k-header" id="tabStrip_'+(IdAlumno)+'"><ul class="k-reset k-tabstrip-items"><li class="k-item k-state-default k-state-active"><a class="k-link" href="#tabStrip_'+(IdAlumno)+'-1">Notas de conducta</a></li></ul><div class="k-content k-state-active" id="tabStrip_'+(IdAlumno)+'-1" style="display:block">\n<div class="k-widget k-grid" id="gridAlumnos_'+(IdAlumno)+'"><table><colgroup><col style="width:56px" /><col style="width:150px" /><col style="width:350px" /><col style="width:100px" /></colgroup><thead class="k-grid-header"><tr><th class="k-header k-filterable" data-field="IdConductaGeneral" data-index="0" data-title="Id" scope="col"><a class="k-grid-filter" href="javascript:void(0)"><span class="k-icon k-filter"></span></a><a class="k-link" href=

"/Conducta/ObtenerNotasConductaGeneral?matricula=%23%3DMatricula%23&gridAlumnos_%23%3DIdAlumno%23-sort=IdConductaGeneral-asc"

>Id</a></th><th class="k-header k-filterable" data-field="Fecha" data-index="1" data-title="Fecha" scope="col"><a class="k-grid-filter" href="javascript:void(0)"><span class="k-icon k-filter"></span></a><a class="k-link" href="/Conducta/ObtenerNotasConductaGeneral?matricula=%23%3DMatricula%23&gridAlumnos_%23%3DIdAlumno%23-sort=Fecha-asc">Fecha</a></th><th class="k-header k-filterable" data-field="Observaciones" data-index="2" data-title="Observaciones" scope="col"><a class="k-grid-filter" href="javascript:void(0)"><span class="k-icon k-filter"></span></a><a class="k-link" href=

"/Conducta/ObtenerNotasConductaGeneral?matricula=%23%3DMatricula%23&gridAlumnos_%23%3DIdAlumno%23-sort=Observaciones-asc"

>Observaciones</a></th><th class="k-header k-filterable" data-field="Conducta" data-index="3" data-title="Conducta" scope="col"><a class="k-grid-filter" href="javascript:void(0)"><span class="k-icon k-filter"></span></a><a class="k-link" href="/Conducta/ObtenerNotasConductaGeneral?matricula=%23%3DMatricula%23&gridAlumnos_%23%3DIdAlumno%23-sort=Conducta-asc">Conducta</a></th></tr></thead><tbody><tr class="k-no-data"><td colspan="4"></td></tr></tbody></table><div class="k-pager-wrap k-grid-pager"><a class="k-link k-pager-nav k-state-disabled k-pager-first" data-page="1" href="#" title="Ir a la primera página"><span class="k-icon k-i-seek-w">seek-w</span></a><a class="k-link k-pager-nav k-state-disabled" data-page="0" href="#" title="Ir a la página anterior"><span class="k-icon k-i-arrow-w">arrow-w</span></a><ul class="k-pager-numbers k-reset"><li><span class="k-state-selected" data-page="1">1</span></li></ul><a class="k-link k-pager-nav k-state-disabled" data-page="2" href="#" title="Ir a la página siguiente"><span class="k-icon k-i-arrow-e">arrow-e</span></a><a class="k-link k-pager-nav k-state-disabled k-pager-last" data-page="1" href="#" title="Ir a la última página"><span class="k-icon k-i-seek-e">seek-e</span></a><span class="k-pager-info k-label">No hay datos.</span></div></div><script

>\n\tjQuery(function(){jQuery("#gridAlumnos_'+(IdAlumno)+'").kendoGrid({"columns":[{"title":"Id","headerAttributes":{"data-field":"IdConductaGeneral","data-title":"Id"},"width":"56px","field":"IdConductaGeneral","filterable":{"messages":{"info":"Mostrar filas con valor que","isTrue":"Si","isFalse":"No","filter":"Filtrar","clear":"Limpiar filtro","and":"Y","operator":"Operador","value":"Valor","cancel":"Cancelar"},"operators":{"string":{"eq":"Es igual a","neq":"No es igual a","startswith":"Comienza con","endswith":"Termina en","contains":"Contiene","doesnotcontain":"No contiene","isnull":"Is null","isnotnull":"Is not null","isempty":"Is empty","isnotempty":"Is not empty"},"number":{"eq":"Es igual a","neq":"No es igual a","gte":"Es mayor o igual que","gt":"Es mayor que","lte":"Es menor o igual que","lt":"Es menor que","isnull":"Is null","isnotnull":"Is not null"},"date":{"eq":"Es igual a","neq":"No es igual a","gte":"Es posterior o igual a","gt":"Es posterior","lte":"Es anterior o igual a","lt":"Es anterior","isnull":"Is null","isnotnull":"Is not null"},"enums":{"eq":"Es igual a","neq":"No es igual a","isnull":"Is null","isnotnull":"Is not null"}}},"encoded":true},{"title":"Fecha","headerAttributes":{"data-field":"Fecha","data-title":"Fecha"},"width":"150px","template":"'+( kendo.toString(FechaInicio, \"MM/dd/yyyy \") )+'","field":"Fecha","filterable":{"messages":{"info":"Mostrar filas con valor que","isTrue":"Si","isFalse":"No","filter":"Filtrar","clear":"Limpiar filtro","and":"Y","operator":"Operador","value":"Valor","cancel":"Cancelar"},"operators":{"string":{"eq":"Es igual a","neq":"No es igual a","startswith":"Comienza con","endswith":"Termina en","contains":"Contiene","doesnotcontain":"No contiene","isnull":"Is null","isnotnull":"Is not null","isempty":"Is empty","isnotempty":"Is not empty"},"number":{"eq":"Es igual a","neq":"No es igual a","gte":"Es mayor o igual que","gt":"Es mayor que","lte":"Es menor o igual que","lt":"Es menor que","isnull":"Is null","isnotnull":"Is not null"},"date":{"eq":"Es igual a","neq":"No es igual a","gte":"Es posterior o igual a","gt":"Es posterior","lte":"Es anterior o igual a","lt":"Es anterior","isnull":"Is null","isnotnull":"Is not null"},"enums":{"eq":"Es igual a","neq":"No es igual a","isnull":"Is null","isnotnull":"Is not null"}}},"encoded":true},{"title":"Observaciones","headerAttributes":{"data-field":"Observaciones","data-title":"Observaciones"},"width":"350px","field":"Observaciones","filterable":{"messages":{"info":"Mostrar filas con valor que","isTrue":"Si","isFalse":"No","filter":"Filtrar","clear":"Limpiar filtro","and":"Y","operator":"Operador","value":"Valor","cancel":"Cancelar"},"operators":{"string":{"eq":"Es igual a","neq":"No es igual a","startswith":"Comienza con","endswith":"Termina en","contains":"Contiene","doesnotcontain":"No contiene","isnull":"Is null","isnotnull":"Is not null","isempty":"Is empty","isnotempty":"Is not empty"},"number":{"eq":"Es igual a","neq":"No es igual a","gte":"Es mayor o igual que","gt":"Es mayor que","lte":"Es menor o igual que","lt":"Es menor que","isnull":"Is null","isnotnull":"Is not null"},"date":{"eq":"Es igual a","neq":"No es igual a","gte":"Es posterior o igual a","gt":"Es posterior","lte":"Es anterior o igual a","lt":"Es anterior","isnull":"Is null","isnotnull":"Is not null"},"enums":{"eq":"Es igual a","neq":"No es igual a","isnull":"Is null","isnotnull":"Is not null"}}},"encoded":true},{"title":"Conducta","headerAttributes":{"data-field":"Conducta","data-title":"Conducta"},"width":"100px","field":"Conducta","filterable":{"messages":{"info":"Mostrar filas con valor que","isTrue":"Si","isFalse":"No","filter":"Filtrar","clear":"Limpiar filtro","and":"Y","operator":"Operador","value":"Valor","cancel":"Cancelar"},"operators":{"string":{"eq":"Es igual a","neq":"No es igual a","startswith":"Comienza con","endswith":"Termina en","contains":"Contiene","doesnotcontain":"No contiene","isnull":"Is null","isnotnull":"Is not null","isempty":"Is empty","isnotempty":"Is not empty"},"number":{"eq":"Es igual a","neq":"No es igual a","gte":"Es mayor o igual que","gt":"Es mayor que","lte":"Es menor o igual que","lt":"Es menor que","isnull":"Is null","isnotnull":"Is not null"},"date":{"eq":"Es igual a","neq":"No es igual a","gte":"Es posterior o igual a","gt":"Es posterior","lte":"Es anterior o igual a","lt":"Es anterior","isnull":"Is null","isnotnull":"Is not null"},"enums":{"eq":"Es igual a","neq":"No es igual a","isnull":"Is null","isnotnull":"Is not null"}}},"encoded":true}],"pageable":{"buttonCount":10,"messages":{"display":"Elementos mostrados  {0} - {1} de {2}","empty":"No hay datos.","page":"Página","of":"de {0}","itemsPerPage":"artículos por página","first":"Ir a la primera página","previous":"Ir a la página anterior","next":"Ir a la página siguiente","last":"Ir a la última página","refresh":"Actualizar","morePages":"Mas paginas"}},"sortable":true,"filterable":{"extra":false,"messages":{"info":"Mostrar filas con valor que","isTrue":"Si","isFalse":"No","filter":"Filtrar","clear":"Limpiar filtro","and":"Y","operator":"Operador","value":"Valor","cancel":"Cancelar"},"operators":{"string":{"eq":"Es igual a","neq":"No es igual a","startswith":"Comienza con","endswith":"Termina en","contains":"Contiene","doesnotcontain":"No contiene","isnull":"Is null","isnotnull":"Is not null","isempty":"Is empty","isnotempty":"Is not empty"},"number":{"eq":"Es igual a","neq":"No es igual a","gte":"Es mayor o igual que","gt":"Es mayor que","lte":"Es menor o igual que","lt":"Es menor que","isnull":"Is null","isnotnull":"Is not null"},"date":{"eq":"Es igual a","neq":"No es igual a","gte":"Es posterior o igual a","gt":"Es posterior","lte":"Es anterior o igual a","lt":"Es anterior","isnull":"Is null","isnotnull":"Is not null"},"enums":{"eq":"Es igual a","neq":"No es igual a","isnull":"Is null","isnotnull":"Is not null"}}},"scrollable":false,"messages":{"noRecords":"No records available."},"dataSource":{"type":(function(){if(kendo.data.transports[\'aspnetmvc-ajax\']){return \'aspnetmvc-ajax\';} else{throw new Error(\'The kendo.aspnetmvc.min.js script is not included.\');}})(),"transport":{"read":{"url":"/Conducta/ObtenerNotasConductaGeneral?matricula='+(Matricula)+'"},"prefix":""},"pageSize":5,"page":1,"total":0,"serverPaging":true,"serverSorting":true,"serverFiltering":true,"serverGrouping":true,"serverAggregates":true,"filter":[],"schema":{"data":"Data","total":"Total","errors":"Errors","model":{"fields":{"IdConductaGeneral":{"type":"number"},"Matricula":{"type":"number"},"Fecha":{"type":"date"},"Conducta":{"type":"string"},"IdUsuario":{"type":"number"},"Observaciones":{"type":"string"},"Status":{"type":"number"}}}}}});});\n<\/script>\n                \n</

div></div></div><script

>\n\tjQuery(function(){jQuery("#tabStrip_'+(IdAlumno)+'").kendoTabStrip({"animation":{"open":{"effects":"fade:in","duration":400}}});});\n<\/script>\n';}return $kendoOutput;'

I know there's an error on my code but I can't find it, i appreciate the help. Thanks.

Code:

@(Html.Kendo().Grid<SIEV.Modelos.Alumno>()

.Name("gridAlumnos")

.Columns(columns =>

{

columns.Bound(c => c.Matricula).Title("Matricula").Width(100);

columns.Template(@<text>@item.Nombre @item.Paterno @item.Materno</text>)

.ClientTemplate("#=Nombre# #=Paterno# #=Materno#")

.Title("Nombre");

columns.Template(@<text>@item.Calle @item.Colonia @(item.NumInt == "null" ? "" : item.NumInt) @item.NumExt</text>)

.ClientTemplate("#=Calle# #=Colonia# #=NumInt# #=NumExt#")

.Title("Direccion");

})

.Sortable()

.Pageable()

.Scrollable()

.Filterable(f => f.Extra(false))

.ClientDetailTemplateId("template")

.HtmlAttributes(new { style = "height: 100%; width: 100%; -webkit-align-content: center;", id = "gridAlumnos" })

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(10)

.Model(model => model.Id(p => p.IdAlumno))

.Read(read => read.Action("Alumno_Read", "Alumno"))

)

.Events(events => events.DataBound("dataBound"))

)

<script id="template" type="text/kendo-tmpl">

@(Html.Kendo().TabStrip()

.Name("tabStrip_#=IdAlumno#")

.SelectedIndex(0)

.Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))

.Items(items =>

{

items.Add().Text("Notas de conducta").Content(@<text>

@(Html.Kendo().Grid<SIEV.Modelos.ConductaGeneral>()

.Name("gridAlumnos_#=IdAlumno#")

.Columns(columns =>

{

columns.Bound(c => c.IdConductaGeneral).Title("Id").Width(56);

columns.Bound(c => c.Fecha).Width(150).ClientTemplate("#= kendo.toString(FechaInicio, \"MM/dd/yyyy \") #");

columns.Bound(c => c.Observaciones).Width(350).Title("Observaciones");

columns.Bound(c => c.Conducta).Width(100).Title("Conducta");

})

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(5)

.Read(read => read.Action("ObtenerNotasConductaGeneral", "Conducta", new { idalumno = "#=IdAlumno#" }))

)

.Pageable()

.Sortable()

.Filterable(f => f.Extra(false))

.ToClientTemplate())

</text>

);

})

.ToClientTemplate())

</script>

<script>

function dataBound() {

this.expandRow(this.tbody.find("tr.k-master-row").first());

}

</script>

<style>

.k-detail-cell .k-tabstrip .k-content {

padding: 0.2em;

}

.employee-details ul {

list-style: none;

font-style: italic;

margin: 15px;

padding: 0;

}

.employee-details ul li {

margin: 0;

line-height: 1.7em;

}

.employee-details label {

display: inline-block;

width: 90px;

padding-right: 10px;

text-align: right;

font-style: normal;

font-weight: bold;

}

</style>

Grid

answered on 20 Apr 2016

1 answer

192 views

Kendo tree list two way data binding angular js

I have to create the kendo ui tree list with two way data binding. I have try with the kendo grid which is working but for kendo tree list it is not working. Please let me know if i am missing anything.
Kendo grid example :- http://dojo.telerik.com/OvUxU/2
Kendo tree list example :- http://dojo.telerik.com/@vinay/arAwo

TreeList

answered on 20 Apr 2016

3 answers

462 views

Locked grid rendering problem in Kendo Window

Hi Kendo,

I'm having rendering problem for Kendo grid with locked columns inside of Kendo window - the grid columns looks squashed together. See this plunk for problem demo.

In addition, on Kendo window restore, the grid gets squashed again - although I'm unable to reproduce it in the plunk. In my system, when I put a break point on the resize event function, I can see that when the kendo window is restored, my window content seems to be gone, and the window has a very tiny size.

help please!

ps. There are maximize, minimize event, but how come there's no event on restoring?

Ama

Window

answered on 20 Apr 2016

1 answer

295 views

Saving Kendo CheckBoxFor checked values separated by comma

I have three checkboxes defined as below in my cshtml file:

@(Html.Kendo().CheckBoxFor(e => e.Fruit)
.Name("FruitApple")
.Label("Apple"))
<br />
@(Html.Kendo().CheckBoxFor(e => e.Fruit)
.Name("FruitBanana")
.Label("Banana"))
<br />
@(Html.Kendo().CheckBoxFor(e => e.Fruit)
.Name("FruitCherry")
.Label("Cherry"))

Where Fruit is the property which is defined in my model class as below:

public string Fruit { get; set; }

I want all the checked checkboxes label text to be separated by comma and assigned as string value to my property 'Fruit'.
For eg: If checkbox for Apple and Cherry is checked. I want to assign Fruit as Apple, Cherry.

But when I run my code, property Fruit is empty.

How can I get this behavior?

Thanks!

General Discussions

answered on 20 Apr 2016