I'm moving an application from jQuery UI to kendo UI and have trouble getting kendo autocomplete do what the jquery ui autocomplte does.

The autocomplete queries the server with 3 input paramters and returns a json array of objects:
I can't figure how to setup/configure the kendo ui autocomplete (or combobox) datasource right.
Is the above possible?

I want to use the Sparkline functionality within a dashboard web page using the DotNetNuke 6.2 framework.

When I use the sample code snippet below within the DNN framework the height of the sparkline is rendered as 14px.  When I use the same code in a stand alone html file it renders at the specified 50px.  There are no javascript errors thrown in either case.

My only thought is that an internal error is occurring when attempting to find the height and the default render height is 14px.  Debugging the spark line java script using the minimized js files is not working for me.

HTML to render:

Code Rendered by kendoSparkline, starting on line 02.

On line 2 and 4 the height is set to 14px.

Any help would be appreciated.

Hi,

I just started using Kendo UI and am still trying to get my head around the css structure.
I am trying to make sure a multi select element is aligned to the right of it's parent div ( see image ).

The HTML code I have is as follows (where the PHP code generates the 2 multiselect widgets) and is used in conjunction with Twitter Bootstrap:
the .tfw-classes are defined as follows:
I can see using Firebug that this alignment is active, but it's not effective. I also tried changing the display to inline-block, but that didn't have the desired result either.
Maybe it's just late and I am looking at it all wrong right now, but some help would be greatly appreciated! :)
Regards,
Rinck

I seem to be unable to get the virtual scrolling to work with large data sets. There seems to be a bug in the calculation of scroll position or height and the effect is different in all browsers. I have created a fiddle to demonstrate.

http://jsfiddle.net/SBxtC/

Firefox seems to max around 234000 depending on exact structure of html
Chrome around 906300
IE around @ 553400

Not sure if there is something im not overrideing correctly.

Also Ive noticed that the naigatable option dosn't work with virtual scrolling. Is there a way around this?

I'm trying to build as general a grid as possible. It has a dataSource that uses server side paging, sorting, and filtering. It all works great, at least until the server gets a request from the dataSource and has a hard time figuring out the query that it should execute.

The web server is running .NET, so the dataSource uses web methods to exchange data with the data server via a SqlConnection. The dataSource stringifies all the options very nicely but I can't come up with a general solution for how to write parameters for my web methods that can take a variety of filtering cases.

The simplest case is... simple. Without any filtering or sorting the web method just handles the paging parameters. No problems there.

Adding filtering to the mix, or even doing filtering without any other parameters, is tough. Looking at the JSON that the dataSource sends to the web server, I gather that the filter argument can be complicated. It can be a list of filters and an operation, or a list of lists of filters and operations and filters and operations, yadda yadda yadda. I've attached a tree view of a sample JSON request showing the nested filters; this is a simple case relative to what my grid will eventually have to do.

It almost looks like I need to handle each case explicitly on the server, rather than being able to write a generic filter object that will take any filter parameter sent by the dataSource. That kind of sucks. I have no problem getting the filter out in a particular case (that would be easy) but I can't seem to design a generic object that will take the filter parameter in any case.

Any help on how to represent a filter on the server in the most general case?

Today I've noticed that when using an XML DataSource in a TreeView, KendoUI complains about level method not being defined.

As far as I've seen this method is defined in Data Model but seems that for XML DataSources the code follow a different path and level is not defined.

Given the XML:
And the following JavaScript code for defining the grid and the datasource:
 It complains about level not being defined.

If I add into the model a level function returning any number then it works.
Is this a bug or XML datasources are not supported in Kendo UI TreeView widgets?

Hi,
I've been playing around with the ImageBrowser (Editor) and would love to see a variation of the ImageBrowser as a standalone widget. If I could use it without the Editor to simply select or upload an image file that would really add value to some of my applications (for which I now have to use a different tool: elFinder).

Since the ImageBrowser already exists, hopefully this would be an easy addition to the KendoUI toolset! :)

I cant make the grid to update de database. i press the save button and it does nothing. 

Code for the grid: 

<!DOCTYPE html>
<html>
<head>
    <title>Customizing filter menu</title>

<link href="/styles/kendo.common.min.css" rel="stylesheet">
<link href="/styles/kendo.default.min.css" rel="stylesheet">

<script type="text/javascript" src="/js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="/js/kendo.all.min.js"></script>
<script type="text/javascript" src="/js/people.js"></script>

<style>
.k-grid {
margin: 5px;
}
</style>
</head>
<body>
<div id="grid"></div>
        <script>
$(function() {
            $("#grid").kendoGrid({
                dataSource: {
                    transport: {
                        read: "data.php",
update: {
                url: "data.php",
                type: "POST"
}
                    },
       
                    schema: {
                        data: "data",
                        model: {
codmat: "codmat",
fields: {
                  codmat: { editable: false }, 
codarea:{ editable: false },
codrubro:{ editable: false },
codsubrub:{ editable: false },
secuencia:{ editable: false },
nombre:{ editable:true},
}
}
}
                },
                columns: [{ field: "codmat" }, { field: "codarea" }, { field: "codrubro" }, { field: "codsubrub" }, { field: "secuencia"}, { field: "nombre" }],

    editable: true,
navigable: true, //habilita el teclado para navegar
toolbar: ["save", "cancel"]//adds save and cancel buttons
            }); 
        });
        </script> 
</body>
</html>

Code for the database:




<?php

    $link = mysql_pconnect("localhost", "root", "") or die("Unable To Connect To Database Server");
   mysql_select_db("datos") or die("Unable To Connect To Northwind");

 
 // add the header line to specify that the content type is JSON
    header("Content-type: application/json");

    // determine the request type
    $verb = $_SERVER["REQUEST_METHOD"];

    // handle a GET 
    if ($verb == "GET") {
        $arr = array();

        $rs = mysql_query("SELECT codmat, codarea, codrubro, codsubrub, secuencia, nombre FROM mater");

        while($obj = mysql_fetch_object($rs)) {

            $arr[] = $obj;

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

// handle a POST  
    if ($verb == "POST") {

 // DISCLAIMER: It is better to use PHP prepared statements to communicate with the database. 
        //             this provides better protection against SQL injection.
        //             [http://php.net/manual/en/pdo.prepared-statements.php][4]
        // get the parameters from the post. escape them to protect against sql injection.

        $codmat = mysql_real_escape_string($_POST["codmat"]);
$nombre = mysql_real_escape_string($_POST["nombre"]);
        $rs = mysql_query("UPDATE mater SET nombre = '" . $nombre ."' WHERE codmat = " .$codmat);
if ($rs) {
        echo json_encode($rs);
    }
    else {
        header("HTTP/1.1 500 Internal Server Error");
        echo "Update failed for EmployeeID: " .$employeeId;
    }

}
 ?>

Hello,
I am binding a Kendo Dropdownlist from a remote datasource just like in this example:
http://demos.kendoui.com/web/dropdownlist/remotedatasource.html

My problem is that I can't figure out a way to set the width of the dropdownlist automatically based on the largest item. Instead of having an ellipsis on the selected item or have the text wrap in the drop down options (like in the example above), I want the dropdowns width to auto adjust based on it's longest item just like a regular drop down list. Setting the css width to auto did not work for me. Setting it to 100% stretches the dropdown accross the page which i don't want either.

Is there a way to set the dropdowns width to adjust automatically based on it's items?

Thanks in advance!

I have a column chart where I would like to show extra information about the x axis categories in a tooltip. If I show all the information in the label it is too much. I also tried having the information in the tooltip for the data series, but this makes it harder to see the information pertaining to the data series point. 

Is it possible to configure a tooltip for the xaxis categories? I also need it to be dynamic based on the category.

I did try using the new tooltip control, but I couldn't figure out how to get the dynamic content.