Questions on Kendo UI for jQuery Forum

0 answers

69 views

Hi there,

According to an item in this FAQ http://www.kendoui.com/faq/mobile-faq.aspx
Kendo UI web widgets can be used with Kendo UI mobile without any issues however when I try use the Grid widget in a mobile view I get some unexpected behavior for filtering and grouping functionality in the grid.

Here's a jsfiddle of what I have tried: http://jsfiddle.net/rwLCh/3/

Thanks,

Rob

General Discussions

asked on 30 Apr 2012

0 answers

141 views

Refreshing a Tabstrip?

In every Grid master row, I have 2 tabstrips populated when detailInit event happens.

If I click on the next master row, the tabstrip in that row detail doesn't seems to be updated with the new JSON datasource using AJAX.

How do I do that without using the Grid Refresh?

$("XXX").data("kendoGrid").dataSource.read();

Is there a detailRefresh or detailReload event for Kendo Grid?

I have written 2 methods to collapse the previous master row details when the next master row is clicked.

TabStrip (Mobile)

asked on 30 Apr 2012

0 answers

78 views

Using Grid with the Kendo UI Mobile Scroller

Hi There,

I've got a Kendo UI grid inside a Kendo UI mobile scroller and it works great but I was wondering if it would be possible to somehow setup the grid/scroller to only apply to the contents of the grid (The tbody tag) and keep the columns static at the top.

Thanks!
Rob

Grid

asked on 30 Apr 2012

2 answers

1.7K+ views

Editing only certain cells/columns

Hi,

I would like to make my Kendo Grid editable only for a certain cells (depends on a value in them) or only a certain columns (i.e. only the second column in grid). How can I achieve this goal?

Grid

answered on 30 Apr 2012

1 answer

164 views

close window

Hello how can i close the window after click some button into the current window????

thanks,

Window

answered on 30 Apr 2012

1 answer

183 views

Editor is broken.

Ok - so I thought I would give Kendo UI a go. I needed a basic html editor for adding and editing forum posts. Started with the Kendo Editor with THE most basic usage... and hey presto, problems immediately.

<script type="text/javascript">

$(document).ready(function () {

$("#reply").kendoEditor();

});

</script>

<textarea id="reply" rows="10" cols="30" style="width:740px; height="440px">

This is a test to see if the script shows up is the editor.

</textarea>

<button>

Save</button>

The toolbar icons rendering is broken....(they have partly rendered??). I tried a 2 other theme files... same issue. I tried specifying the tools collection directly .. No go.. . For the record, I am using Firefox 11.0 browser and a MVC 4 project with the HTML validation target set to XHTML 5.

Editor

answered on 29 Apr 2012

1 answer

326 views

Grid, PageSize - Possible bug?

Hello,

I have an issue pretty weird with PageSize of Grid. When I set page size to 2 and I have more elements, in the pager, there is only one page instead of 3 or 4 but when I do sort or group, all pages in the pager appear.

I attach a video.

Am I doing something wrong?

This is the code Javascript:

$(document).ready(function() {

var dataSource = new kendo.data.DataSource({

pageSize: 2,

transport: {

read: "dataSourceJson.php"

},

schema: {

data: "data"

},

error: function(e) {

// handle event

alert("error");

},

change: function(e) {

// handle event

//alert("change");

}

});

$("#grid").kendoGrid({

dataSource: dataSource,

pageable: true,

groupable: true,

scrollable: true,

sortable: true,

pageable: true

});

$("#search").click(function() {

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

var data = Grid.dataSource_data;

dataSource.read();

});

This is the code of dataSourceJson.php:

<?php

$array = Array(Array("from_user" => "daniel","from_user_id" => "1"),

Array("from_user" => "daniel","from_user_id" => "1"),

Array("from_user" => "daniel","from_user_id" => "1"));

header('Content-Type: application/json; charset=iso-8859-1');

echo "{\"data\":" .json_encode($array). "}";

?>

Thank you,
Daniel

Grid

answered on 29 Apr 2012

4 answers

761 views

KendoUI simple stuff like checkboxes?

UI Frameworks like Dijit routinely provide custom versions of all of the basic UI elements like buttons, radio buttons, checkboxes, toggle buttons, etc.

Often there is little added functionality, but the controls are at least styled to conform with the selected theme.

I can find no documentation on this sort of thing. I was able to find and use the "k-button" class by looking at the page code of one of the KendoUI demo pages, but couldn't find docs for it.

Am I missing something?

I am particularly interested in icon toggle buttons. In the demo of the KendoUI editor control the toolbar seems to use "k-tool-icon" and "k-editor-button" controls in the toolbar. Are these documented anywhere?

The KendoUI editor control uses browser-provided checkboxes, so Im guessing there's no kendo-specific styled one. Is that right?

General Discussions

answered on 29 Apr 2012

6 answers

429 views

[Solved] Bind to remote xml

How do I configure the widget to bind to this XML?

http://www.google.com/ig/api?weather=hamilton,ON

This is my definition so far...

$(document).ready(function () {

function onChange() {

$("#weather-container").html(kendo.render(template, this.view()));

}

// create a template using the above definition

var template = kendo.template($("#dashwidget-weather-template").html());

var dataSource = new kendo.data.DataSource({

transport: {

// specify the XML file to read. The same as read: { url: "books.xml" }

read: {

url: "http://www.google.com/ig/api?weather=hamilton",

dateType: "xml"

}

},

schema: {

// specify the the schema is XML

type: "xml",

// the XML element which represents a single data record

data: "/weather/current_conditions",

// define the model - the object which will represent a single data record

model: {

fields: {

condition: "condition/text()",

temp: "temp_c/text()"

}

},

change: onChange

});

dataSource.read();

});

Data Source

answered on 28 Apr 2012

0 answers

226 views

splitter is undefined

I am trying to establish the basics with the splitter.

I have have three panes and am trying to load a page into the middle pane and then resize the spliiter tp fit the content.

When I call

var splitter = $("#splitter").data("kendoSplitter");
 // expand the pane with ID, pane1
splitter.expand("#mainContent");

I get a "splitter is undefined" error. 

Here is the code...

<div align="center">
        <div id="splitter" style="border-color:white; margin:1px; width:80%" align="center">
            <div id="menu">Area 1</div>
            <div id="mainContent">Area 2</div>
            <div id="rightCol">Area 3</div>
        </div>
    </div>

<a href="#" onclick="test()">Expand</a>

 $("#splitter").kendoSplitter({
                panes: [
                    { size: "100px", collapsible: false, min: "100px", max: "110px", resizable: false },
                    { size: "700px", min: "300px",  contentUrl: "../default.aspx"},
                    { size: "100px", collapsible: false, min: "100px", max: "110px", resizable: false }
                ],
                orientation: "horizontal"
            })

function test() {
            var splitter = $("#splitter").data("kendoSplitter");
            // expand the pane with ID, pane1
            splitter.expand("#mainContent");
        }

I am seeing a few other posts about resizing to fit contents, can it be done this way or do you need to resize from the loaded page to the parent?

Cheers

Splitter

asked on 28 Apr 2012