Questions on Kendo UI for jQuery Forum

1 answer

164 views

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

296 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

722 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

357 views

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

195 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

2 answers

1.3K+ views

How to Convert dataSource to JSON to send back to a mvc controller?

How can I convert a datasource which is an array of "object" 3 columns per row in kendoui grid to a json object I can send into an mvc controller?

Thank you,

Data Source

answered on 28 Apr 2012

0 answers

90 views

How do I implement view composition using KendoUI

Hi, I'm new to KendoUI and JS based UI framework.
I wonder if I can decompose complex UI page/form into "UserControls"(like asp.net) and then
A. use "Contianer" ,
B. or even something like "Region Import"(in Prism) technology,
to compose them.
I go through the TabStrip and Window KendoUI controls and find them can act as a "Container" and load content from other seperated files,
so I think option A above is achievable, but how should I do?
Further, when using Prism, sivlerlight applications can make views as plugins and auto imported into ShellView by IoC container,
is there a same technology in KendoUI or jQuery, or something else.

Please show me a way out, thanks in advance.:-)

General Discussions

asked on 28 Apr 2012

0 answers

89 views

Where to find Kendo good designers/developers?

We are looking for some Kendo UI designers/developers, but it seems that Kendo is still a bit new in the general development community. Any suggestions? Or does anyone know of someone who would be interested?

If you don't want to post here, you can send me a note at 'info' at-sign 'carpedatuminc.com'.

General Discussions

asked on 28 Apr 2012

0 answers

67 views

Increase date by 2 days by default.

How to add the date by 2 days from the current date by default when the page is displayed using datepicker

$(

"#toDate").kendoDatePicker({

value:

new Date(),

min:

new Date(1950, 0 ,1),

max:

new Date(2049,11,31)

})

Here by default it is giving current date for example 4/27/2010, but I wanted it to diplsay by + 2 days i.e 4/29/2012.
How can I achieve this?

DatePicker

asked on 27 Apr 2012

4 answers

495 views

binding grid to remote webservice

Hi,

Do you have a code sample that demonstrates how to bind a grid to a remote webservice (normal SOAP webservice)

http://demos.kendoui.com/web/grid/remote-data.html

Thanks!

Grid

answered on 27 Apr 2012