Hi, I'm using Kendo grid in javascript (coffeescript)
I have a boolean grid column with a template functon:

column:
  template: (row) -> if row.booleanField then '<img src="/static/img/yes.png"' else ''

The column is editable, and show a checkbox when editing. After edit, and the cell becomes dirty, template no longer works - the code runs, but the cell does not get the img.

I am looking for some guidance for this application of the Masked Input Box. Simply stated I want to use it in conjunction with the Kendo grid. The research I have done reveals that row templates are not supported for grids with inline editing, and that eliminates one possible straightforward approach. I would be interested if anyone has made this scenario work.

Cheers

Hello,
I am facing a strange issue with submitting data of a grid. Here is how the scenario looks like
There is a grid, with first column having check box to select a certain row. There's a button, on clicking takes all the selected rows and passes on to a MVC controller action - using Ajax Post.
This action, calls a server method that submits all these records to db server as a List<>
The issue is - this all works fine when 39 records are selected but throws up "Internal server error" when more than 39 records are selected.

Note: The number of columns are about 20, no paging in grid, the grid has only 3 columns editable out of 20 and each row is calculated to allow the edits.

Am I missing anything, which is causing Internal server error !!! Is there a problem with grid or my code somewhere....this issue with number of records seems strange.

I want to change the icon on the delete button, but I am somehow not able to catch all the activity state icons like :hover and such. How do I replace all of them?

I have 3 column grid with checkboxes. When I am trying all model values (true/false) by selecting checkbox in header it gives poor performance.
Is the implementation done bad way or it just behave this way normaly ?

My code available at http://jsbin.com/mades/3/edit

Hi,

Please see the two charts in this example.

As you can see, the first chart shows the 0 value data points correctly. But, when set to valueAxis: { type: "log" } the 0 values no longer show as 0 values. How can we fix this?

Thanks,
Josh

Trying to see implement grouping and resources in scheduler widget, however am using declarative syntax for the widget construction and binding it to a view model.

This is the widget :

        <div data-role="scheduler"
             data-views="['day','week','month','agenda']"
             data-height="500"
             data-bind="source: plannerDS"
             ></div>

But to achieve the vertical grouping as in the demo:
http://demos.telerik.com/kendo-ui/scheduler/resources-grouping-vertical

is this the syntax  and also has anyone advice for the syntax for implementing the datasource for each resource field? :          

             data-group-resources="Rooms"
             data-group-orientation="vertical"
             data-resources-field="roomID"
             data-resources-name="Rooms"
.....

Hello
I'm looking for an option to get html that is containing also inherited style. Currently if I won't specify e.g. font or font size directly, these values are not stored in html, so when html is opened somewhere else - e.g. in email it looks differently than in editor, which is unacceptable. I want to have html that is always looking the same in any place I open it. Even if external css is not embedded.

Is there any way to get such html? Or to force not use inherited style and always some default to have that result.

Regards
Marcin

Hello,

I have a kendogrid inside a tabstrip. The primary key of the grid is the value of the tab. When a tab is clicked, the grid data is reloaded with a different primary key value. That part works. On the selectable event of the grid, I create a second grid that gets it's primary key from a field value of the selected row of the first grid. As long as I am on the original tab, all works well. Clicking on a row in the first grid changes the values of the second grid. But when the tab is changed, the first grid continues to work correctly, but the onchange event I use to get the primary key value for the second grid, the event fires multiple times, sending several different values to the second grid, the last one not being the correct one. I am assuming the data from the first tab is still in the page and when the second tab gets clicked it has multiple values for the same field. Is there a way to clear out the data from the first tab when the second  (or third) tab is clicked? by the way, the tabs are dynamically generated when the page is browsed to, there is no way of knowing how many tabs there will be until the data is already loaded.

Here is my code:

<div class="row">
    <div class="col-md-10">
        <h5>Parcels</h5>
        <div class="container">
            <div id="parcelTabStrip">
                <ul>
                    @foreach (ParcelInfo parcel in @Model.ParcelList)
                    {
                        <li>@parcel.property_id</li>
                    }
                </ul>
                @foreach (ParcelInfo parcel in @Model.ParcelList)
                {
                    <div class="row">
                        <div class="col-md-5">
                            <div class="parcelInfoGrid"></div>
                        </div>
                        <div class="col-md-5">
                            <div class="taxDetailGrid"></div>
                        </div>
                    </div>
                }
            </div>
        </div>
    </div>
</div>
<br />

<script>
    $(document).ready(function () {
        $("#parcelTabStrip").kendoTabStrip({
            change: onTabChange,
            activate: function (e) {
                bind();
            }
        });
        var tabstrip = $("#parcelTabStrip").kendoTabStrip().data("kendoTabStrip");
        tabstrip.select(tabstrip.tabGroup.children("li:first"));
        tabstrip.tabGroup.on('click', 'li', function (e) {
            tabstrip.reload($(this));
        });

        function onTabChange(arg) {
           
        }

        bind();

        function bind() {
            var tabId = tabstrip.select().text();

            var taxDetailDataSource = new kendo.data.DataSource({
                schema: {
                    type: "json",
                    model: {
                        id: "property_id",
                        fields: {
                            ptr_number: { editable: false, type: "string" },
                            tax_year: { editable: false, type: "number", },
                            property_id: { editable: false, type: "string" },
                            source_code: { editable: false, type: "string" },
                            tax_bill_tax_year: { editable: false, type: "number" },
                            tax_bill_pay_year: { editable: false, type: "number" },
                            included_flag: { editable: false, type: "string" }
                        }
                    }
                },
                transport: {
                    create: {
                        url: "@Url.Action("ParcelInfoUpdate", "Home")",
                        dataType: "json",
                        type: "POST",
                        cache: false,
                        complete: function (e) {
                            $(".parcelInfoGrid").data("kendoGrid").DataSource.read();
                        }
                    },
                    read: {
                        url: ('@(Url.Action("ParcelInfoRead", "Home"))?number=' + tabId),
                        dataType: "json",
                        cache: false
                    },
                    update: {
                        url: "@Url.Action("ParcelInfoUpdate", "Home")",
                        dataType: "json",
                        type: "POST",
                        cache: false,
                        complete: function (e) {
                            $(".parcelInfoGrid").data("kendoGrid").DataSource.read();
                        }
                    },
                    destroy: {
                        url: "@Url.Action("ParcelInfoDelete", "Home")",
                        dataType: "json",
                        type: "POST"
                    },
                    parameterMap: function (options, operation) {
                        if (operation !== "read" && options.models) {
                            return { models: kendo.stringify(options.models) };
                        }
                    }
                }
            });

            $(".parcelInfoGrid").kendoGrid({
                dataSource: taxDetailDataSource,
                navigatable: true,
                scrollable: true,
                selectable: "row",
                change: onChange,
                columns: [
                    { field: "included_flag", title: "Included" },
                    { field: "source_code", title: "Source" },
                    { field: "tax_bill_tax_year", title: "Tax Year" },
                    { field: "tax_bill_pay_year", title: "Pay Year" }
                ]
            });
        }

        var lastSelection;

        function onChange(arg) {

            var currentSelection = arg.sender.select().attr("data-uid");
            if (lastSelection && currentSelection != lastSelection) {

                var text = "";
                var grid = this;
                var dataItem = "";
                grid.select().each(function () {
                    dataItem = grid.dataItem($(this));
                    text = dataItem.property_id;
                });
                alert(text);
            }
            lastSelection = currentSelection;

            var taxDetailDataSource = new kendo.data.DataSource({
                schema: {
                    type: "json",
                    model: {
                        id: "property_id",
                        fields: {
                            ptr_number: { editable: false, type: "string" },
                            tax_year: { editable: false, type: "number", },
                            property_id: { editable: false, type: "string" },
                            source_code: { editable: false, type: "string" },
                            tax_bill_tax_year: { editable: false, type: "number" },
                            tax_bill_pay_year: { editable: false, type: "number" },
                            included_flag: { editable: false, type: "string" }
                        }
                    }
                },
                transport: {
                    create: {
                        url: "@Url.Action("ParcelInfoUpdate", "Home")",
                    dataType: "json",
                    type: "POST",
                    cache: false,
                    complete: function (e) {
                        $(".taxDetailGrid").data("kendoGrid").DataSource.read();
                    }
                },
                read: {
                    url: ('@(Url.Action("ParcelInfoRead", "Home"))?number=' + text),
                    dataType: "json",
                    cache: false
                },
                update: {
                    url: "@Url.Action("ParcelInfoUpdate", "Home")",
                dataType: "json",
                type: "POST",
                cache: false,
                complete: function (e) {
                    $(".taxDetailGrid").data("kendoGrid").DataSource.read();
                }
            },
                destroy: {
                url: "@Url.Action("ParcelInfoDelete", "Home")",
                dataType: "json",
            type: "POST"
        },
        parameterMap: function (options, operation) {
            if (operation !== "read" && options.models) {
                return { models: kendo.stringify(options.models) };
            }
        }
    }
        });

        $(".taxDetailGrid").kendoGrid({
            dataSource: taxDetailDataSource,
            navigatable: true,
            scrollable: true,
            columns: [
                { field: "included_flag", title: "Included" },
                { field: "source_code", title: "Source" },
                { field: "tax_bill_tax_year", title: "Tax Year" },
                { field: "tax_bill_pay_year", title: "Pay Year" }
            ]
        });
        }
    });
</script>

Hi,

I can't find how to create a TabStrip dynamically with Kendo UI Mobile. I don't care if I have to create <li> with jQuery and then call kendoMobileTabStrip() :) But even that don't work, I'm not sur this function exists in fact.

Any advice?