Questions on Kendo UI for jQuery Forum

0 answers

125 views

Here is my requirement,
1. I need unlimited local storage, because my application should work offline for different valid reasons. I deal with complex grids (I am using Kendo UI here) having data returned from multiple DB tables, so in order to work my app offline I need to have a mechanism to maintain the similar relation between the DB objects or at least some work around to deal with it.
2. My users will use Desk top , IOS devices like Ipad, Iphone , and Androd devices.so I need all latest browsers support.

so, Please suggest me an option to choose from the technologies around HTML5.

General Discussions

asked on 02 Sep 2013

3 answers

72 views

Categories in empty column chart

Hello,

I've got a question about the categories in an empty column chart.
They show up as if it was a linechart when the chart is empty.

Is their a way to show the categories in the correct way, even if the chart is empty?
For an example please see the attached image.

Charts

answered on 02 Sep 2013

1 answer

851 views

Window Border CSS Setting

I have a KendoUI Window which is not behaving itself when I am using it inside another JQuery framework.
I am trying to set the window title colour and the maximise and close icons to the top right, but I cannot figure out the CSS settings to do this.
I attach an image showing what I have now and what I am trying to achieve.
I was given these settings a few months ago but they appear to be having little effect:
/* Override our KendoUI popup window */
/*
.k-window-titlebar
{
    background-color: pink;
    color: red;
    font-weight: bold;
    padding: 0px;
}
*/

.k-header {
    margin-top: 0px;
    padding: 0px;
}

.k-window-title {
    background-color: #275CAB;
    color: white;
    font-weight: bold;
    padding: 3px;
}

/* Allow centering of the table content in the popup window */
.k-window-content > .km-scroll-container
{
   height:100%;
    padding: 30px;
}

.k-window-titlebar .k-window-action
{
    background: none;
    border-width: 200px;
    background-color: #275CAB;
}
Your help is most appreciated?

Kind Regards, Garry.

Window

answered on 02 Sep 2013

3 answers

105 views

Style for the .Formatting() option not applied when opened in window control

When an editor control is loaded in a window control, the .Formatting() component on the editor does not render the expected styles for each of the options in the drop down list.

This is occurring with the latest build 2013.2.823.

It seems to be adding the below inline style to each of the list items in the dropdown. This has been happening for the last few builds but i got around it by having a mismatch of different version JS files which was less than ideal as it breaks other things.

color: rgb(51,51,51); padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; border-top-color: rgb(51,51,51); border-right-color: rgb(51,51,51); border-bottom-color: rgb(51,51,51); border-left-color: rgb(51,51,51); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; display: block; background-image: none; background-attachment: scroll; background-repeat: repeat; background-position-x: 0%; background-position-y: 0%; background-color: transparent;

I have attached a screenshot to show this.

Editor

answered on 02 Sep 2013

1 answer

105 views

GroupBy functionality not working correctly with ClientRowTemplate

Hello,
I am trying to implement a grid that uses a ClientRowTemplate and also has GroupBy functionality. The grid renders fine and all other behaviors act appropriately except the GroupBy, when a column is selected to GroupBy the column headers act strangely and an additional column is inserted and the widths are changed as well. If I remove the ClientRowTemplate everything works great. I am new to Kendo so please let me know if my implementation is wrong or could be better code is below:

@(Html.Kendo().Grid(Model)

.Name("Grid")

.HtmlAttributes(new { style = "height:450px;font-size:.85em;" })

.Columns(columns =>

{

columns.Template(e => { }).ClientTemplate(" ").Width(30).HtmlAttributes(new { style="vertical-align: middle; text-align: center" });

columns.Bound(p => p.Id).Width(60);

columns.Bound(p => p.Title).Width(250);

columns.Bound(p => p.AssignedUser).Width(120);

columns.Bound(p => p.Status);

columns.Bound(p => p.Priority);

columns.Bound(p => p.Category);

columns.Bound(p => p.Tier);

columns.Bound(p => p.LastModifiedAsString).Title("Last Modified").Width(120);

})

.ClientRowTemplate(

"<tr>" +

"<td>" +

"<img style ='margin-top:5px;' src='" + Url.Content("~/Images/") +"#:data.Icon#' alt='#:data.Icon#' />" +

"</td>" +

"<td width='60'>#: Id #</td>" +

"<td width='250'>#: Title #</td>" +

"<td width='120'>#: AssignedUser #</td>" +

"<td>#: Status #</td>" +

"<td>#: Priority #</td>" +

"<td>#: Category #</td>" +

"<td>#: Tier #</td>" +

"<td>#: LastModifiedAsString #</td>" +

"</tr>"

)

.Pageable()

.Sortable()

.Scrollable()

.Groupable()

.Filterable(filterable => filterable

.Extra(false)

.Operators(operators => operators

.ForString(str => str.Clear()

.StartsWith("Starts with")

.IsEqualTo("Is equal to")

.IsNotEqualTo("Is not equal to")

))

)

.Selectable(selectable => selectable

.Mode(GridSelectionMode.Single))

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(20)

.Read(read => read.Action("Get", "Grid"))

)

.Events(e => e.Change("onChanged"))

)

<script type="text/javascript">

function onChanged(arg) {

var selected = this.select();

var wiId = this.dataItem(selected).Id;

window.location = '../WorkItem/Edit?Id=' + wiId;

}

var myGrid;

$(function () {

myGrid = $('#Grid').data('kendoGrid');

});

setInterval(DoWork, parseInt(@ViewBag.RefreshInterval));

function DoWork() {

myGrid.dataSource.read();

}

</script>

Grid

answered on 02 Sep 2013

1 answer

699 views

Add parameters to the ParametersMap dynamically

Hello there, is there any way I can add parameters to the DataSource dynamically?

Thanks!

Data Source

answered on 02 Sep 2013

1 answer

160 views

kendoUpload becomes undefined after disabling it on IE9

In my app I am disabling the kendoUpload widget when the user has chosen 5 files to upload. But - if the user removes one of those files to download, I will enable the kendoUpload widget.

My issue is that once I call the disable() method in the kendoUpload widget - the next time I try to access the kendoUpload widget it is undefined.

Here's my function.

function setAddAttachmentButton(disable) {
var kendoUpload = $("#attachmentUpload").data("kendoUpload");
if (kendoUpload == undefined)
return;

if (disable) {
kendoUpload.disable();
} else {
kendoUpload.enable();
}
}

This is only happening on IE9 - the other browsers work fine.

Upload

answered on 02 Sep 2013

5 answers

822 views

Drag and Drop feature is not working for kendo grid

Hi,
I have a drop downlist and grid.Based on the drop down selection, i'm loading the data in to kendo grid.
Drag and drop row feature is working fine when my page loads first time and after that selecting the dropdown list value and loading the grid first time.
If i change my dropdownlist value in change event and load the grid data, then drag is calling(that too calling multiple times).But drop is not calling...

The implementation is done for this feature by refering
http://jsfiddle.net/JBeQn/

Please find the written code snippet attachment

Drag and Drop

answered on 02 Sep 2013

1 answer

3.3K+ views

How to Fetch Current Row info of Kendo Grid from onClick event of ComboBox ?

Hello Kendo Team,

I am using Kendo Combo Box under Kendo Grid. Now i need to fetch current row data or array of Kendo Grid onClick event of ComboBox ?

In short meaning, OnClick event of ComboBox , I need to fetch data of current row of Kendo Grid. I can not do this and data of current row can be not fetched.

======================

Kendo ComboBox Event:

======================

transport: {

read: {

type: "POST",

dataType: "json",

data: function(e){

//alert(e.toSource());

var grid = $("#grid").data("kendoGrid");

var rowDataItem = grid.dataItem(grid.tbody.find("tr")); /* I need Current Row */

alert(rowDataItem.toSource());

},

url: "<?php

echo $this->url( array('module'=> 'Invoice', 'controller' => 'backend', 'action' => 'gateway' ), 'adminrout',    true); ?>"

}

grid.dataItem(grid.tbody.find("tr")) is not working. How to get the current row array ?

Please See the Screen Shot and Code sample attached herewith for your better understand.
Please help where is my mistake or can you give us a sample code ?

Grid