I have a window on my page:

@(Html.Kendo().Window()
    .Name("window")
    .Title("Add New Comment").LoadContentFrom("AddComment", "Comparisons", new { startDate = @ViewBag.startDate, endDate = @ViewBag.endDate })

    .Draggable()
    .Resizable()
    .Width(450).Height(500)
    .Position(settings => settings.Top(100).Left(100)).Visible(false).Modal(true).Iframe(true)
    .Actions(actions => actions.Close())
)

I open the window with a hyperlink, here is the binding:

        $("#addCommentLink").click(function () {
            $("#window").data("kendoWindow").refresh().open();
        });

I have a div that's not related at all to the window.

<div id='dummy'></div>

At some point I load the div with a partial render.

function ReloadCommentSection() {      
        $("#dummy").load('@Url.Action("CommentEventSection", new { startDate = @ViewBag.startDate, endDate = @ViewBag.endDate })');        
    }

Once that div is loaded, the window won't open any more.  I get an error that  $("#window").data("kendoWindow") is undefined.


What am I doing wrong?

I have a grid ( built with javascript not razor ).
I have aggregates running on several columns and they display fine in the footer of each group once a grouping is added.
if I minimise the group then that information is hidden so I would like to move all the aggregates in the header of each group so they are always visible even when the group is minimised.
The standard groupHeaderTemplate only applies when that particular column is added to a group. What I want is for the aggregates to show regardless of which column is added to the group.

Is this possible ?

Hi,

I was having a hard time in trying to figure out how to position the validation message of an editable cell. My problem is that once it appears it is blocking the cell itself.

Thanks in advance.

In trying to develop a website using the MVCwrappers I am having 2 issues related to the grid.
- When 2 mobile grids are on a page the bottom grid covers half of the top grid.
- I have a grid in a mobile tabstrip, but the grid will not display if the Mobile property is set to "PHONE". However, it does show up when set to "AUTO".

Hi , 

In one of my project I have to let the user pickup on item from a dropdown list and then Add the corresponding Item from my model to a Grid datasource.
The Dropdown list is bind to a property of my ViewModel which is filled by the controller. The grid datasource is also bind to another ViewModel property which is empty and should be passed to controller upon From submit. Both properties are of the same type (TempPp)

My viewmodel contains 2 DateTime properties and after calling the values of those two properties are not displayed properly in the grid

The value sent by the controller is {01/11/2012 00:00:00} and the displayed value is /Date(1351724400000)/
or  {31/12/2013 00:00:00} and /Date(1388444400000)/

Here is myViewmodel

Here is a simplified version of my Razor view:

@model Customer.Asam.Presentation.Supplier.ViewModels.ARRViewmodel

@using Customer.Asam.Resources

@using Customer.Asam.Presentation.Supplier.Common

 

@using (Html.BeginForm("Create_Step3", "", FormMethod.Get, new { @id = "FORM_ARR_3" }))

{

    <div>

        <h2>@Asam_Strings.TITLE_CREATE_ARR_STEP 3 @Asam_Strings.TITLE_CREATE_ARR_PREVENTION_PLAN</h2>

 

        @Asam_Strings.LABEL_PP_REFERENCE

 

        @(Html.Kendo().DropDownList()

            .HtmlAttributes(new { style = "width: 250px" })

            .BindTo(Model.tempPP)

            .Name("tempPP") //The name of the combobox is mandatory. It specifies the "id" attribute of the widget.

            .DataTextField("PPREF") //Specifies which property of the Product to be used by the combobox as a text.

            .DataValueField("ID") //Specifies which property of the Product to be used by the combobox as a value.

            .Events(e => e

            .Select(@<text>

                function(e) {

                    e.preventDefault();

                    var dataItem = this.dataItem(e.item.index());

                 

                    if (e.item.index() > 0)

                    {

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

                        grid.dataSource.add(dataItem);                 

                    }

                }  </text>))

         )

 

        <script>

            function indexPP(dataItem) {

                var data = $("#RefPP").data("kendoGrid").dataSource.data();

                return data.indexOf(dataItem);

            }

        </script>

         

        @(Html.Kendo().Grid(Model.RefPP)

            .Name("RefPP")

            .DataSource(dataSource => dataSource

                .Ajax()

                .PageSize(1)

                .ServerOperation(false)

             )

 

            .Columns(column =>

                {

                    column.Bound(c => c.PPREF)

                        .ClientTemplate("#= PPREF # " +

                        "<input type='hidden' name='RefPP[#= indexPP(data)#].PPREF' value='#= PPREF #' />" +

                        "<input type='hidden' name='RefPP[#= indexPP(data)#].PPSRCAPPLICATION' value='#= PPSRCAPPLICATION #' />" +

                        "<input type='hidden' name='RefPP[#= indexPP(data)#].PPSITE' value='#= PPSITE #' />" +

                        "<input type='hidden' name='RefPP[#= indexPP(data)#].DESCRIPTION' value='#= DESCRIPTION #' />" +

                        "<input type='hidden' name='RefPP[#= indexPP(data)#].DATEFROM' value='#= DATEFROM #' />" +

                        "<input type='hidden' name='RefPP[#= indexPP(data)#].DATEFROM' value='#= DATEFROM #' />" +

                        "<input type='hidden' name='RefPP[#= indexPP(data)#].DATETO' value='#= DATETO #' />" +

                        "<input type='hidden' name='RefPP[#= indexPP(data)#].QUOTA' value='#= QUOTA #' />");

                     

                    column.Bound(c => c.PPSITE);

                    column.Bound(c => c.DESCRIPTION);

                    column.Bound(c => c.DATEFROM)

                        .Format("{0:dd/MM/yyyy}");

                    column.Bound(c => c.DATETO)

                        .Format("{0:dd/MM/yyyy}");

                    column.Bound(c => c.QUOTA);

                }

            )

        )

 

    </div>

}

I've read through the API and was wondering if there is a way to only allow dates to be selected from the calendar OR a real date typed in.  Currently someone could type in "Bill" or "I want to type an alphanumeric sentence"...  I'd like to prevent someone from even entering anything except for a valid date.

I am currently validating this value after the fact and then alerting the user they have entered an invalid date, but just want to be able to cut out that step (or at least part of it) if possible.

Thanks
Jason

This means my model is not binding and the operations are not working.

The read method works just fine, but that is it....  For Example, my Destroy Method:

CONTROLLER:
     public ActionResult Memo_Delete(MemoModel memo)
        {
            using (var context = new eEntities.eWJB())
            {
                Note _note = context.Notes.First(i => i.nMemoID == memo.memoID);
                context.Notes.Remove(_note);
                context.SaveChanges();
            }
            return Json(new[] { memo }.ToDataSourceResult(request, ModelState));
        }

The JS Below sends the following malformed JSON to the Controller:  It looks like Query Parameters / Not JSON:  

Any Suggestions?  I have tried the parameter mapping with no luck.

clientID=8&memoID=2&memoTime=Sat+May+08+2004+13%3A05%3A00+GMT-0700+(Pacific+Daylight+Time)&subject=General+Notes&memo=%24200+Appraisal+%230403053&initials=MM&code=4&eyesOnly=false&sticky=false

JS for the GRID:

    jQuery("#grid2").kendoGrid(
         {
             columns: [
               { "title": "Pin", "width": "30px", "field": "sticky", "filterable": {}, "encoded": true, "editor": null },
               { "title": "Private", "width": "30px", "field": "eyesOnly", "filterable": {}, "encoded": true, "editor": null },
               { "title": "Date", "width": "90px", "field": "memoTime", "format": "{0:dd/MM/yyyy}", "filterable": {}, "encoded": true, "editor": null },
               { "title": "Subject", "width": "125px", "field": "subject", "filterable": {}, "encoded": true, "editor": null },
               { "title": "Note", "width": "250px", "encoded": false, "field": "memo", "filterable": {}, "editor": null },
               { "title": "Initials", "width": "30px", "field": "initials", "filterable": {}, "encoded": true, "editor": null },
               {
                   "width": "172px", "command": [
                     { "name": "edit", "buttonType": "ImageAndText", "text": "Edit" }, { "name": "destroy", "buttonType": "ImageAndText", "text": "Delete" }]
               }],
             pageable: { "refresh": true, "pageSizes": [5, 10, 20], "buttonCount": 5 },
             sortable: true,
             selectable: "Single, Row",
             resizable: true,
             scrollable: false,
             editable: { "confirmation": "Are you sure you want to delete this record?", "mode": "popup", "template": "\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"clientID\"\u003eclientID\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field clientID must be a number.\" data-val-required=\"The clientID field is required.\" id=\"clientID\" name=\"clientID\" type=\"number\" value=\"0\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"clientID\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"memoID\"\u003ememoID\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field memoID must be a number.\" data-val-required=\"The memoID field is required.\" id=\"memoID\" name=\"memoID\" type=\"number\" value=\"0\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"memoID\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"memoTime\"\u003ememoTime\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput data-val=\"true\" data-val-date=\"The field memoTime must be a date.\" id=\"memoTime\" name=\"memoTime\" type=\"datetime\" /\u003e\u003cscript\u003e\tjQuery(function(){jQuery(\"\\\\\\#memoTime\").kendoDateTimePicker({\"format\":\"M/d/yyyy h:mm tt\",\"min\":new Date(1900,0,1,0,0,0,0),\"max\":new Date(2099,11,31,0,0,0,0),\"interval\":30});});\u003c\\/script\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"memoTime\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"subject\"\u003esubject\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"k-textbox\" data-val=\"true\" data-val-required=\"The subject field is required.\" id=\"subject\" name=\"subject\" placeholder=\"\" type=\"text\" value=\"\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"subject\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"memo\"\u003ememo\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"k-textbox\" data-val=\"true\" data-val-required=\"The memo field is required.\" id=\"memo\" name=\"memo\" placeholder=\"\" type=\"text\" value=\"\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"memo\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"initials\"\u003einitials\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"k-textbox\" id=\"initials\" name=\"initials\" placeholder=\"\" type=\"text\" value=\"\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"initials\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"code\"\u003ecode\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"k-textbox\" data-val=\"true\" data-val-number=\"The field code must be a number.\" id=\"code\" name=\"code\" placeholder=\"\" type=\"text\" value=\"\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"code\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"eyesOnly\"\u003eeyesOnly\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"k-textbox\" id=\"eyesOnly\" name=\"eyesOnly\" placeholder=\"\" type=\"text\" value=\"\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"eyesOnly\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"sticky\"\u003esticky\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cselect class=\"list-box tri-state\" id=\"sticky\" name=\"sticky\"\u003e\u003coption selected=\"selected\" value=\"\"\u003eNot Set\u003c/option\u003e\u003coption value=\"true\"\u003eTrue\u003c/option\u003e\u003coption value=\"false\"\u003eFalse\u003c/option\u003e\u003c/select\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"sticky\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e", "window": { "title": "Edit", "modal": true, "draggable": true, "resizable": false }, "create": true, "update": true, "destroy": true }, "toolbar": { "command": [{ "name": null, "buttonType": "ImageAndText", "text": "Add new record" }] },
             dataSource: {
                 transport: {
                     prefix: "",
                     read: { url: "/Memo/Memos_Read"},
                     update: { url: "/Memo/Memo_Update", dataType: "json", contentType: "application/json", type: "POST" },
                     create: { url: "/Memo/Memo_Add", dataType: "json", contentType: "application/json", type: "POST" },
                     destroy: { url: "/Memo/Memo_Delete", dataType: "json", contentType: "application/json", type: "POST" }
                 },
                 parameterMap: function (options, operation) {
                     if (operation !== "read" && options.models) {
                         return {models: kendo.stringify(options.models)};
                     }
                     return options; // <-- added this line

                 
             },
                 pageSize: 10, "page": 1, "total": 0, "type": "aspnetmvc-ajax", "error": error_handler,
                 schema: {
                     data: "Data", "total": "Total", "errors": "Errors",
                     model: {
                         "id": "memoID", "fields":
                             {
                                 "clientID": { "type": "number" },
                                 "memoID": { "type": "number" },
                                 "memoTime": { "type": "date", "defaultValue": null },
                                 "subject": { "type": "string" },
                                 "memo": { "type": "string" },
                                 "initials": { "type": "string" },
                                 "code": { "type": "number", "defaultValue": null },
                                 "eyesOnly": { "type": "boolean", "defaultValue": null },
                                 "sticky": { "type": "boolean", "defaultValue": null }
                             }
                     }
                 }
             }
         });
   });

How could I get the selected data of a kendo grid and send them to controller for being read? How could I get it with the corresponding ViewModel?

I have several filter options in a kendo grid and I need to get data from the controller after being filtered. How could I do that?

I’m trying to set a common value in the “Message” parameter of the “IsEqualTo” property in a kendo grid. My project is Multilanguage, so, when I select a language different than “English”, the shown message is different than “Es igual a”. What should I do to fix that? This is the piece of code:

        .Filterable(filterable => filterable

        .Extra(false)

         .Operators(operators => operators

            .ForString(str => str.Clear()              

               .IsEqualTo("Es igual a")

            ))