Can you give me a example of remote binding for this type of chart? or this type of chart we just can bind to local data list? Thanks.
http://demos.kendoui.com/dataviz/bar-charts/grouped-stacked-bar.html

Hi,

I've got a set of editable grids on a page. One contains a date field (mysql) that is editable. When the grid runs a datepicker is shown in the popup editor for that field, dates can be selected and the grid is updated with the new date selected. However, the update on the database doesn't work. All of the other editable fields work fine, just the datepicker is failing.

I have attached a screenshot of the Firebug post info showing that the BillDate is posting as BillDate  Wed Jan 30 2013 00:00:00 GMT-0500 (Eastern Standard Time). Based on the docs I have the BillDate field set to format: "{0:yyyy-MM-dd}" and assumed this formatting would be submitted in the post. It's not and that appears to be the problem.

So, can you tell me how to get the datepicker to submit the date selected in Y-m-d format?

I'm using PHP/MYSQL and have a the very simple update script for the grid with the datepicker:

<?php include('dbcon.php'); ?>
<?php
$id = mysql_real_escape_string($_POST["contractID"]);
$billable = mysql_real_escape_string($_POST["Billable"]);
$billed = mysql_real_escape_string($_POST["Billed"]);
$billdate = mysql_real_escape_string($_POST["BillDate"]);


$rs = mysql_query("UPDATE contracts SET Final = '" .$billable. "', billed = '".$billed."', billed_date = '" .$billdate. "' WHERE contractID = '" .$id."'");
    if ($rs) {
    header("Content-type: application/json");
    echo json_encode($rs);
    }
    else {
    header("HTTP/1.1 500 Internal Server Error");
    echo "Failed on update: " .$billable;
    }
?>

I have also tried converting the date submitted with $billdate = date('Y-m-d', strtotime("".$_POST["BillDate"]."")); and that doesn't work either.

Here is the grid code:

   
    var billableDataSource = new kendo.data.DataSource({
                       transport: {
                        read: "data/billable-options.php"
                        }
                });
    var billedDataSource = new kendo.data.DataSource({
                       transport: {
                        read: "data/billed-options.php"
                        }
                });
    
     function typeDropDownEditor(container, options) {
                    $('<input data-text-field="label" data-value-field="item" data-bind="value:' + options.field + '"/>')
                        .appendTo(container)
                        .kendoDropDownList({
                            autoBind: false,
                            dataSource: billableDataSource
                        });
                }
    function billedDropDownEditor(container, options) {
                    $('<input data-text-field="Label" data-value-field="Value" data-bind="value:' + options.field + '"/>')
                        .appendTo(container)
                        .kendoDropDownList({
                            autoBind: false,
                            dataSource: billedDataSource
                        });
                }
   $("#past").kendoGrid({
                        dataSource: {
                            transport: {
                                read: "data/unbilled-fetch.php?start=<?php echo $_GET['start']; ?>",
                                update: {url:"data/unbilled-update.php", type:"POST"}
                                                                
                            },
                            schema: {
                                model: {
                                   id: "contractID",
                                    fields: {
                                        contractID: { type: "number", editable: false, nullabe: false },
                                        Artist: { type: "string", editable: false},
                                        PlayDate: { type: "date", editable: false},
                                        Venue: { type: "string", editable: false},
                                        Fee: {type: "number", editable: false},
                                        Overage: {type: "number", editable: false},
                                        Actual: {type: "number", editable: false},
                                        Deposits: {type: "number", editable: false},
                                        Commission: {type: "number", editable: false},
                                        MgmtComm: {type: "number", editable: false},
                                        Net: {type: "number", editable: false},
                                        Billable: {type: "string", editable: true},
                                        BillableText: {type: "string"}
                                                    
                                     }
                                }
                            },
                            batch: false,
                        pageSize: 10
                        },
                        sortable: true,
                        groupable: true,
                        resizable: true,
                        scrollable: {
                             virtual: true //false
                             },
                        pageable: {
                            refresh : true
                            },
                        toolbar: ["save", "cancel"],
                        columns: [
                        { field:"contractID", title: "ID", width: "50px" },
                        { field:"Artist", title: "Artist", width: "100px" },
                        { field:"PlayDate", title: "Date", width: "75px", format: "{0:MM/dd/yyyy}" },
                        { field:"Venue", title: "Venue", width: "150px" },
                        { field:"Fee", title: "Fee", width: "60px" },
                        { field:"Overage", title: "Overage", width: "60px" },
                        { field:"Actual", title: "Actual", width: "60px" },
                        { field:"Deposits", title: "Deposits", width: "75px" },
                        { field:"Commission", title: "Commission", width: "75px" },
                        { field:"MgmtComm", title: "MgmtComm", width: "70px" },
                        { field:"Net", title: "Net", width: "60px" },
                        { field:"Billable", title: "Billable",  width: "160px", editor: function (container, options) {
                    $('<input data-text-field="label" data-value-field="item" data-bind="value:' + options.field + '"/>')
                        .appendTo(container)
                        .kendoDropDownList({
                            autoBind: false,
                            dataSource: billableDataSource
                        });
                }},
                        ],
                        editable: true
                    });
                    
                    
                    
                // current billing cycle data based on the search criterea    
                $("#billable").kendoGrid({
                        dataSource: {
                            transport: {
                                read: "data/billing-cycle-fetch.php?start=<?php echo $_GET['start']; ?>&end=<?php echo $_GET['end']; ?>",
                                update: {url:"data/billing-cycle-update.php", type:"POST"}
                                                                
                            },
                           schema: {
                                model: {
                                   id: "contractID",
                                    fields: {
                                        contractID: { type: "number", editable: false, nullabe: false },
                                        PlayDate: { type: "date", editable: false},
                                        Artist: { type: "string", editable: false},
                                        Venue: { type: "string", editable: false},
                                        Fee: {type: "number", editable: false},
                                        Overage: {type: "number", editable: false},
                                        Actual: {type: "number", editable: false},
                                        Deposits: {type: "number", editable: false},
                                        Commission: {type: "number", editable: false},
                                        MgmtComm: {type: "number", editable: false},
                                        Net: {type: "number", editable: false},
                                        Billable: {type: "string", editable: true},
                                        Billed: {type: "number", editable: true},
                                        BillDate: {type: "date", editable: true},
                                        Label: {type: "string"}
                                                    
                                     }
                                }
                            },
                            parameterMap: function(options, operation) {
                                    if (operation !== "read" && options.models) {
                                        return {models: kendo.stringify(options.models)};
                                    }
                                },
                            batch: false,
                        pageSize: 20
                        },
                        sortable: true,
                        resizable: true,
                        filterable: true,
                        columnMenu: true,
                        groupable: true,
                        pageable: {
                            refresh : true,
                            pageSizes: [10,20,50,100],
                            },
                        /* toolbar: ["save", "cancel"], */
                        columns: [
                        { field:"contractID", title: "ID", width: "75px" },
                        { field:"PlayDate", title: "Date", width: "75px", format: "{0:MM/dd/yyyy}" },
                        { field:"Artist", title: "Artist", width: "100px" },
                        { field:"Venue", title: "Venue", width: "150px" },
                        { field:"Fee", title: "Fee", width: "75px" },
                        { field:"Overage", title: "Overage", width: "75px" },
                        { field:"Actual", title: "Actual", width: "75px" },
                        { field:"Deposits", title: "Deposits", width: "75px" },
                        { field:"Commission", title: "Commission", width: "75px" },
                        { field:"MgmtComm", title: "MgmtComm", width: "75px" },
                        { field:"Net", title: "Net", width: "75px" },
                        { field:"Billable", title: "Billable",  width: "125px", editor: function (container, options) {
                    $('<input data-text-field="label" data-value-field="item" data-bind="value:' + options.field + '"/>')
                        .appendTo(container)
                        .kendoDropDownList({
                            autoBind: false,
                            dataSource: billableDataSource
                        });
                }},
                        { field:"Billed", title: "Billed", width: "75px", editor: function (container, options) {
                    $('<input data-text-field="Label" data-value-field="Value" data-bind="value:' + options.field + '"/>')
                        .appendTo(container)
                        .kendoDropDownList({
                            autoBind: false,
                            dataSource: billedDataSource
                        });
                }},
                        { field:"BillDate", title: "Bill Date", width: "100px", format: "{0:yyyy-MM-dd}" },
                        
                         { command: ["edit"], title: "&nbsp;", width: "210px" }],
                        editable: "popup"
                    });   
 
Thanks in advance,
Tony 

I have  login form fields incuding a switch for remember me on a modalview like the demo example.  When I toggle the switch, it causes the modal view to close.  Can anyone please help with a way to work around this and not have the modalview closed by the switch. I want the modalview to only be closed by my login and cancel buttons.

Hello,

I have a Popover with a ListView of links.  I would like someone to be able to click on a link, have it close and it navigates to the page.  Here is the code that I have so far, I have it opening in the parent, but it doesn't close.


The current code is not closing the link for me.  Using the Developer Tools when I debug the JS, the closeParentPopover is not being called when a link is clicked inside the Popover.  Can someone help me out here?  I would have thought that this would have been more simple.

Is it possible to style the tooltip so it can have an arrow similar to this: 
bootstrap tooltip example

Hello!
I'm developing a simple app using Icenium Mist. I followed the example on mobile forms page about drop-down list:
http://demos.kendoui.com/mobile/forms/index.html

In the demo it works fine - the drop down shows up and stays there. In my app I can see the drop-down list show for a split second, and it disappears right away. I didn't see any JS errors or missing references.

Markup is simple:
<div data-role="view" data-init="initSignOffForm">
.....
<select id="ddlChild">
<option value="1">Veronique</option>
<option value="2">Michelle</option>
        <option value="3">Griffin</option>
        <option value="4">Boris</option>
</select>
.....
</div>

Then my JS file piece copied from demo page:

function initSignOffForm(){
    var body = $(".km-vertical,.km-horizontal");
    if (kendo.ui.DropDownList) {
        $("#ddlChild").kendoDropDownList({
                // The options are needed only for the desktop demo, remove them for mobile.
                popup: { appendTo: body },
                animation: { open: { effects: body.hasClass("km-android") ? "fadeIn" : body.hasClass("km-ios") ? "slideIn:up" : "slideIn:down" } }
            });
    }
}

I tried removing the options for the list in JS - same thing...

Compiled and tested in on the phone - blinks the same way as well.

Anyone knows why and how to fix?

I have a grid, with a nested grid (exposed via detailInit), which also has a nested grid.
I am having a couple of issues with it.
When expanding the main grid, if I start at the top item, the second and third one won't expand.
If I start at the third one, the second and first one will expand.  If I start at the second one, the first will expand, but the third one won't.

In the inner grid, if I expand the top row, the second row expands, but isn't rendered correctly.  My innermost grid is actually a tabstrip with two div's in it, and each of those divs are a grid.

I've made a sample that re-creates the problems I am seeing at 
http://jsfiddle.net/giltnerj0/e2RfH/

Thank you.

Robin

I have a couple of <div>'s that are bound to an observable object. Now I want that object to be bound to the datasource so that when the datasource reads data it automatically updates the bound fields. How do I do it? In other words, I call the web service with dataSource.read() and get the data back....OK, now what?


HTML:
The JSON returned by the web service call:

Hello,

I am currently using "Kendo UI Web v2012.3.1114" and I've had this problem where I couldn't group on a column containing line breaks, which is a known issue.

Yesterday I decided to update my project to Kendo UI Web v2012.3.1315 and by the same occasion, update jQuery to version 1.8.3. To my satisfaction, the grouping issue was solved, but I then realized I couldnt no longer group on more than one column.

I stumbled upon this post on stackoverflow which mentionned the same problem I have, but the accepted answer suggests that the multiple grouping is solved by upgrading to the version that solved the problem for me.

http://stackoverflow.com/questions/14536083/kendo-grid-groupping

Any thoughts?

Hi,

My requirement is like, I want to keep my tabs in layout page, as its shared across all the pages.
But when im clicking tab, respective content needs to load in Body section(@RenderBody)
in some other views like below.

Layout.cshtml
*******************
<body>
        <header>         
                @* Some Content here *@
                @Html.Partial("_TabPageUI") @*Tabstrip Page*@
        </header>
               @RenderBody()
    <footer>
         @* Some Content here *@
    </footer>
</body>

Index.cshtml (which is rendering in renderbody)
*****************
<div id="tabcontent">
         @* Needs to load tab content here *@
</div>

As of now, im using Ajax.actionlink with update target id (tabcontent), but i want to use kendo tabstrip and acheive the same.
Is it possible to do so?

Thanks,
PreethiBaskaran.