Questions on Kendo UI for jQuery Forum

1 answer

196 views

I have a Web API that is being hosted on one server. The actual website using kendo is hosted on a different server. Looking at samples, for the grid I have to provide a model like this:

@(Html.Kendo().Grid(Something.Account)
.Name("grid")
...

However, the model is on the other server. I guess I could copy over the dll with the model but that does not sound like a good approach. Isn't there somehow a way to do this dynamically by accessing the WebApi, discover the columns and then render them or something like that, hence the model would not be required.

Data Source

answered on 21 Oct 2014

1 answer

173 views

Chart Binding to shared DataSource

I am confused about chart behavior when the chart is bound to a datasource that is shared by multiple widgets.

Specifically, I have a chart and a grid that share a datasource. When I page through the data via the grid, the datasource is firing off change events but the chart seems to remain oblivious. So I had to write an extra function:

01.var statsByUserDataChange = function(e) {

02. var chart = $("#x-by-user").data("kendoChart");

03.

04. if( chart.dataSource.page() !== e.sender.page() ) {

05. chart.dataSource.page(e.sender.page());

06. }

07.

08. if( chart.dataSource.sort() !== e.sender.sort() ) {

09. chart.dataSource.sort(e.sender.sort());

10. }

11.

12. chart.refresh();

13.};

This function is used as the dataSource change event handler. If I just try chart.refresh() its as if the dataSource hasnt been changed even though it clearly has.

Questions:
Why is it that when the grid manipulates the dataSource and the refresh method on the chart is called, the chart data remains the same?
Is the above method the best way to tell the chart to change?

Charts

answered on 21 Oct 2014

2 answers

4.1K+ views

How to change input to textarea in popup editor

I am using popup editing in my grid. By default the popup editor renders input type=text elements. Is it possible to change that so it would render textarea elements instead?

Grid

answered on 21 Oct 2014

2 answers

145 views

Grid fails with 19 columns?

I'm trying to pass information through the model coming back from ajax call (json format) that is not displayed in the grid. This works fine for up to 18 columns (9 visible and used).

The second I add a 19th, everything stops working, the grid comes up with a very brief spinner, column headers and filters as programmed, but no rows displayed.

I know this isn't very specific, but does anyone have an idea where I'm going wrong?

I have had columns listed in the "columns" with the hidden attribute, I've also had fields passed in the data that are never referenced in the grid definition but are there when I populate my popup editor.

All of this works fine, until I return 19 data fields from my ajax web service.

Thanks, Bob

Grid

answered on 20 Oct 2014

2 answers

973 views

Update Footer Template of Column with ClientTemplate

<% this.Html.Kendo().Grid<EditablePlanejamentoDescarga>()

.Name("GridPlanejamento")

.Columns(columns =>

{

columns.Bound(c => c.TransportadorNome)

.Width(500)

.HeaderHtmlAttributes(new { style = "text-align: center; font-weight: bold" })

.ClientFooterTemplate(" TOTAIS :")

.FooterHtmlAttributes(new { style = "background-color:lightgray; text-align: right; font-weight :bold" });

columns.Bound(c => c.Domingo)

.Width(175)

.HtmlAttributes(new { style = "text-align: center" })

.HeaderHtmlAttributes(new { style = "text-align: center; font-weight: bold" })

.ClientTemplate("#= Domingo.QuantidadeFardos >0 ? Domingo.QuantidadeFardos :'' #")

.ClientFooterTemplate("#=sum#")

.FooterHtmlAttributes(new { style = "background-color:lightgray; text-align: right; font-weight :bold" });

columns.Bound(c => c.SegundaFeira)

.Width(175)

.HtmlAttributes(new { style = "text-align: center" })

.HeaderHtmlAttributes(new { style = "text-align: center; font-weight: bold" })

.ClientTemplate("#= SegundaFeira.QuantidadeFardos >0 ? SegundaFeira.QuantidadeFardos :'' #")

.ClientFooterTemplate("#=sum#")

.FooterHtmlAttributes(new { style = "background-color:lightgray; text-align: right; font-weight :bold" });

columns.Bound(c => c.TotalTransportador)

.HtmlAttributes(new { style = "background-color:lightgray; text-align: right; font-weight :bold" })

.HeaderHtmlAttributes(new { style = "text-align: center; font-weight: bold" })

.ClientTemplate("#= TransportadorNome == '' ? '' : TotalTransportador #")

.ClientFooterTemplate("#=sum#")

.FooterHtmlAttributes(new { id = "footerTotal", style = "background-color:lightgray; text-align: right; font-weight :bold" });

})

.DataSource(dataSource =>

{

dataSource.Ajax().Batch(true).ServerOperation(false);

dataSource.Ajax().Model(m =>

{

m.Id(i => i.TransportadorNome);

m.Field(f => f.TransportadorNome).Editable(false);

m.Field(f => f.TotalTransportador).Editable(false);

});

dataSource.Ajax().Aggregates(agg =>

{

agg.Add(a => a.Domingo.QuantidadeFardos).Sum();

agg.Add(a => a.SegundaFeira.QuantidadeFardos).Sum();

agg.Add(a => a.TotalTransportador).Sum();

});

})

.ToolBar(toolbar =>

{

toolbar.Save();

})

.Editable(e => e.Mode(Kendo.Mvc.UI.GridEditMode.InCell))

.Navigatable(n => n.Enabled(true))

.Events(e => e.DataBound("onDataBound").Edit("onEdit").Save("onSave"))

.Render();

%>

For columns c.Domingo and c.SegundaFeira the agg.Add(a => a.Domingo.QuantidadeFardos).Sum() and agg.Add(a => a.SegundaFeira.QuantidadeFardos).Sum() don't works.
I'm using a .ClientTemplate("#= SegundaFeira.QuantidadeFardos >0 ? SegundaFeira.QuantidadeFardos :'' #") to show cell value.
JavaScritp erro occours ' sum' is undefined.

But for the c.TotalTransportador columns works correctly.

Thanks,

Tiago.

Grid

answered on 20 Oct 2014

1 answer

141 views

[Solved] Grid doesn't look at column sizes when loaded but does when hiding/showing a column.

When all columns have set widths on a grid the first time it
loads if the combined width is less than the grid has available the columns
will be resized to fill the space. When a column is shown or hidden the columns
are resized to use their widths that are set from the beginning. I have come up
with a solution to the problem but I was curious of why this happens. When
showing/hiding a column a static width gets set to the table elements of the
combined width of the columns that are shown.

Why does the width get set if it doesn’t happen the first
time the grid loads?

My fix for this is to remove the table widths and allow it
to determine how large it needs to grow inside of its container.

I find that the results of removing the width on the table
has a better feel to the grid then adding it. Here is an example of this
behavior ( http://dojo.telerik.com/UKiF
) uncomment the $('#grid').find('[role="grid"]').css('width', ''); to
see my fix.

Grid

answered on 20 Oct 2014

1 answer

150 views

[Solved] Use ObservableArray with kendo-panel-bar

I've a kendo-panel-bar (using the AngularJs directive) which I would like to bind to a datasource. Unfortunately it seems like the panel bar cannot bind to a kendo.data.ObservableArray. Setting the datasource to an array works fine, setting it to an ObservableArray results in a "Cannot read property 'length' of undefined" exception.

I'm aware of the solution with k-rebind (provided here: https://github.com/kendo-labs/angular-kendo/issues/269) Since I want to use the panel bar bound to a Breeze datasource (which internally uses a ObservableArray), this is unfortunately not a solution for me.

Are there any other possibilities to have a panel bar bound to an ObservableArray?

PanelBar

answered on 20 Oct 2014

1 answer

211 views

Expand All/ Collapse All

Hello,

Is there a better way to set all parent tasks to have expanded set to true?
Currently, I'm clearing the content of my div and rebinding everything again with the expanded property to true.

Greatly appreciated.

Gantt

answered on 20 Oct 2014

2 answers

100 views

[Solved] Grid and sortable integration not working ok

You can see it in http://dojo.telerik.com/aTaM, which is one of the demos. You can reproduce the bug this way:
1.-Make that grid editable
2.-Edit column unit price, and modify the value
3.-Click on the same row, on column ProductName
4.-As you can see, the unit price column doesn´t keep the value you just entered.

If that grid wasn´t integrated with sortable, the behaviour would be as expected.
Thanks.

Grid

answered on 20 Oct 2014

7 answers

157 views

[Solved] kando-grid, angularjs, odata: requestEnd does not fire properly when filterable row

Hi,

when using dataSource odata with filterable: { mode: "row" } option, the requestEnd event does fire only the first time. If I set filterable: true the event is fired properly.

I'm using: AngularJS v1.2.21 and Kendo UI v2014.2.1008

Any ideas?

Thanks,
Enrico

Grid

answered on 20 Oct 2014