or
6 answers
316 views
In javascript how can you watch changes to a nested property or computed property on an observable object?
http://docs.kendoui.com/api/framework/observableobject#methods has observable.bind("change", function(e) { }); but this does not seem to update for nested properties/computed properties.
3 answers
779 views
I want to change grid font color of the grid based on the jsp data from database. How I will put condition on the changing grid color dynamically from jsp page.
For example,
I have 2 types of records and as per condition i want to change the color of one record in blue and other one in red.
Please help me.
For example,
I have 2 types of records and as per condition i want to change the color of one record in blue and other one in red.
Please help me.
0 answers
103 views
Hello,
I am using the built-in toolbar save command and batch editing. When a user edits some rows and clicks the save button, I need to find which rows were edited. How do I go about doing this? There is no documentation that explains the event passed to the saveChanges function.
I am using the built-in toolbar save command and batch editing. When a user edits some rows and clicks the save button, I need to find which rows were edited. How do I go about doing this? There is no documentation that explains the event passed to the saveChanges function.
1 answer
136 views
I see UI component demos. Are there any application demos? They would be most welcome both to show how the UI components fit into an overall application, and to show suggested patterns for a real enterprise web app.
Thanks.
Thanks.
Alex
Top achievements
Rank 1
Rank 1
answered
on
09 Aug 2012
0 answers
157 views
It looks like my other post didn't save for some reason? Anyway, let me try typing this out again!
So I'm looking for a way to have severa inputs in a form use the same validator message. This is my scenario - I have 8 input fields all requiring 1 - 100 to validate correctly. I find it unnecessary to have 8 validator messages all say the same thing, so I'm looking for a way to have one message on the top of the form that says "must be 1 - 100." However, I can't get this to work without the "data-for" attribute.
I could theoretically "hack" this by creating 8 validator messages, positioning them absolutely, so they would stack, looking like one message. That's a bit "hacky" and I'm hoping to do this the proper way.
Any recommendations would be greatly appreciated. Thanks in advance for your time.
So I'm looking for a way to have severa inputs in a form use the same validator message. This is my scenario - I have 8 input fields all requiring 1 - 100 to validate correctly. I find it unnecessary to have 8 validator messages all say the same thing, so I'm looking for a way to have one message on the top of the form that says "must be 1 - 100." However, I can't get this to work without the "data-for" attribute.
I could theoretically "hack" this by creating 8 validator messages, positioning them absolutely, so they would stack, looking like one message. That's a bit "hacky" and I'm hoping to do this the proper way.
Any recommendations would be greatly appreciated. Thanks in advance for your time.
Jeremy
Top achievements
Rank 1
Rank 1
asked
on
09 Aug 2012
0 answers
1.1K+ views
It would be nice if clearSelection() took an argument, so that I could just deslect a few rows. Right now I find that I am having to first clear all and then select, which does not perform well when the number of rows selected is over 25, and I want to deselect one (that has a column with the contents of valueOf(data.idx).
grid.select("only the desired records") did not work, i.e. if there were three previously selected, and this new list was length two, then all three would remain selected. So I have to clearSelection().
grid.select("only the desired records") did not work, i.e. if there were three previously selected, and this new list was length two, then all three would remain selected. So I have to clearSelection().
var jFilter = ":not(:contains('{0}'))";var records;jFilter = jFilter.format(data.idx);records = GridData.grid.tbody.find(">tr.k-state-selected[data-uid]").filter(jFilter);GridData.grid.clearSelection();GridData.grid.select(records);6 answers
135 views
Hello, I'm having a strange issue. I'm using the DataViz controls (both Gauge and Chart) for a dashboard application. Everything works great, except for 1 thing. The Line Charts do not work in IE8 for me. IE9 works fine, as does every other browser. Unfortunately, many of our employees are running Windows XP and are locked out of installing 3rd party browsers, so IE8 is the defacto browser I have to get this working in. Your source examples work fine in IE8, so I'm a bit dumbfounded.
I'm receiving no error in Firebug's console in Firefox, but running IE9 in IE8 Standards mode using developer tools, gives me an error of:
SCRIPT87: Invalid argument.
kendo.dataviz.min.js, line 8 character 75326
Not sure what that means...
Anyhow, any help would be greatly appreciated. I have attached screen captures to (possibly) aid in an answer. I had to blur out labels that would identify our company, but it's still easy to see what's going on. Thanks in advance for any help!
I'm receiving no error in Firebug's console in Firefox, but running IE9 in IE8 Standards mode using developer tools, gives me an error of:
SCRIPT87: Invalid argument.
kendo.dataviz.min.js, line 8 character 75326
Not sure what that means...
Anyhow, any help would be greatly appreciated. I have attached screen captures to (possibly) aid in an answer. I had to blur out labels that would identify our company, but it's still easy to see what's going on. Thanks in advance for any help!
3 answers
258 views
Hello!
Story:
I want to compare two sets of data created for two periods of time (periods have same length).
As I find out in the kendo doc I can create two X axis for scatter chart. This is the thread that inspire me
The best result I could get is (you can try this here: http://jsfiddle.net/yXXCM/):
https://www.dropbox.com/s/2qbdhz8ek5keh0j/day-large-no-hours.PNG (is it possible to inline the images into the post?)
It is quite nice I would say. I is not perfect as labels are not match dots on the chart (that is because the label is not a day, it is a day + some hours: http://jsfiddle.net/RK26K/).
( You can notice labels' template for the second x axis (template: "#= kendo.toString(new Date(value + 1728000000), 'hh:mm dd MMM') #"). The "magic number" 1728000000 is a difference between periods calculated on the server. It is surely a hack, but it is the only way I found :) )
But unfortunately this chart looks really nasty for small period of time and for week/month charts:
https://www.dropbox.com/s/xqkcwr2l94tklr5/day-small.PNG
https://www.dropbox.com/s/qamzyx3pqsix4jv/week.PNG
https://www.dropbox.com/s/98lg7asn4b2tb3w/month.PNG
Just look on 3 junes, 3 July and no August (the third dot) of months chart.
Question:
Actually, the problem is that X/Y chart is not the one that can help me.
I definitely need a categorical chart. Category is a day or a week or a month in my case. But looks like categorical carts doesn't support two categories axis. Is that true?
Could anyone help me with that %&^$^& cart? :)
Probably there is a workaround for my problem.
Thanks,
Andrei.
Story:
I want to compare two sets of data created for two periods of time (periods have same length).
As I find out in the kendo doc I can create two X axis for scatter chart. This is the thread that inspire me
The best result I could get is (you can try this here: http://jsfiddle.net/yXXCM/):
https://www.dropbox.com/s/2qbdhz8ek5keh0j/day-large-no-hours.PNG (is it possible to inline the images into the post?)
It is quite nice I would say. I is not perfect as labels are not match dots on the chart (that is because the label is not a day, it is a day + some hours: http://jsfiddle.net/RK26K/).
( You can notice labels' template for the second x axis (template: "#= kendo.toString(new Date(value + 1728000000), 'hh:mm dd MMM') #"). The "magic number" 1728000000 is a difference between periods calculated on the server. It is surely a hack, but it is the only way I found :) )
But unfortunately this chart looks really nasty for small period of time and for week/month charts:
https://www.dropbox.com/s/xqkcwr2l94tklr5/day-small.PNG
https://www.dropbox.com/s/qamzyx3pqsix4jv/week.PNG
https://www.dropbox.com/s/98lg7asn4b2tb3w/month.PNG
Just look on 3 junes, 3 July and no August (the third dot) of months chart.
Question:
Actually, the problem is that X/Y chart is not the one that can help me.
I definitely need a categorical chart. Category is a day or a week or a month in my case. But looks like categorical carts doesn't support two categories axis. Is that true?
Could anyone help me with that %&^$^& cart? :)
Probably there is a workaround for my problem.
Thanks,
Andrei.
0 answers
350 views
IF I use:
@(Html.Kendo().Grid<WebSiteHotelRazor.Models.ReportesModeloVentas>()
The grid doesn't return data but if I use:
If I use this it works
@model IEnumerable<WebSiteHotelRazor.Models.ReportesModeloVentas>
@(Html.Kendo().Grid(Model)
What am I missing?
Code that works:
@{
ViewBag.Title = "Reporte";
}
@(Html.Kendo().Grid<WebSiteHotelRazor.Models.ReportesModeloVentas>()
The grid doesn't return data but if I use:
If I use this it works
@model IEnumerable<WebSiteHotelRazor.Models.ReportesModeloVentas>
@(Html.Kendo().Grid(Model)
What am I missing?
Code that works:
@{
ViewBag.Title = "Reporte";
}
@model IEnumerable<WebSiteHotelRazor.Models.ReportesModeloVentas>
<h1>Reporte de Ventas Año 2011</h1>
<p>
@(Html.Kendo().Grid(Model)
.Name("GridAGQ")
.Columns(columns =>
{
columns.Bound(p => p.Ano).Width(50).Title("Año").HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.PRODUCTO).Width(200).Title("Producto").HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.DESCRIPCION_PRODUCTO).Width(300).Title("Descripción del Producto").HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_ENERO).Width(150).Title("Enero").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_FEBRERO).Width(150).Title("Febrero").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_MARZO).Width(150).Title("Marzo").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_ABRIL).Width(150).Title("Abril").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_MAYO).Width(150).Title("Mayo").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_JUNIO).Width(150).Title("Junio").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_JULIO).Width(150).Title("Julio").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_AGOSTO).Width(150).Title("Agosto").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_SEPTIEMBRE).Width(150).Title("Septiembre").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_OCTUBRE).Width(150).Title("Octubre").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_NOVIEMBRE).Width(150).Title("Noviembre").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_DICIEMBRE).Width(150).Title("Diciembre").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
columns.Bound(p => p.SUBTOTAL_TOTAL).Width(150).Title("Total").Format("{0:#,###.00}").HtmlAttributes(new { @style = "text-align:right;font-weight:bold" }).HeaderHtmlAttributes(new { @style = "text-align:center;font-weight:bold" });
})
.Groupable()
.Scrollable()
.Filterable()
.Pageable()
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
.Read(read => read.Action("Products_Read", "Grid"))
)
)
</p>
<p>
<input id="Submit1" type="submit" value="submit" /></p>
3 answers
113 views
I am experiencing a strange issue where there is a random extra digit in the pager. See screenshot.
Also here is the html generated if that helps.
There appears to be a random UL with class='k-pager k-reset k-numeric' in the page? Any ideas.
I have added a second pager to the page via
and that one is fine.
Also here is the html generated if that helps.
<div class="k-pager-wrap k-grid-pager" data-role="pager"><ul class="k-pager k-reset k-numeric"><a class="k-link k-state-disabled" title="Go to the first page" href="#" data-page="1"><a class="k-link k-state-disabled" title="Go to the previous page" href="#" data-page="1"><ul class="k-pager-numbers k-reset"><a class="k-link" title="Go to the next page" href="#" data-page="2"><a class="k-link" title="Go to the last page" href="#" data-page="3"><span class="k-pager-info k-label">1 - 10 of 28 items</span></div>There appears to be a random UL with class='k-pager k-reset k-numeric' in the page? Any ideas.
I have added a second pager to the page via
$("#somepager").kendoPager( { dataSource: gridDatasource });and that one is fine.
