Hey!

I'm creating a view, based on a ViewModel. This View Model has two Complex Properties, of which one is collection


Second Property (viz. secList) is collection which displays two columns in grid(Description, Action, Rest are hidden). Action is a list of CheckBoxes.

Action Method to fill the View is:


Razor Code which Renders Kendo Grid is:

  @(Html.Kendo().Grid(Model.secList)
    .Name("secList")
    .Columns(columns =>
    {
        columns.Bound(p => p.SecurityListId).Hidden();
        columns.Bound(p => p.HubId).Hidden();
        columns.Bound(p => p.FormId).Hidden();
        columns.Bound(p => p.DataActionId).Hidden();
        columns.Bound(p => p.Description).Width(450).Filterable(true);
        columns.Bound(p => p.Action).Width(50).Sortable(false).Filterable(false);
       .HeaderTemplate("<div align=center><p>Select All </p><input id='selectall' type='checkbox'  checked= 'checked' /></div>")
        .ClientTemplate("<div align=center><input type='checkbox'  checked='checked' /></div>"); 
    })
         .DataSource(dataSource => dataSource
            .Ajax()
            .ServerOperation(false)
           .Model(model =>
            {
                model.Id(p => p.SecurityTemplateId);
                model.Field(p => p.Description).Editable(false);
                model.Field(p => p.Action).Editable(true);

            }))
     .Sortable()
    .Scrollable()
    .Filterable()
    .HtmlAttributes(new { style = "height:530px;" })
    );

All i need from grid to show Description and List of Checkboxes. Logic of Insertion is on Action (Post) in Controller. 
My Issue is I'm able to display gird, but when I try to access this collection on Create (Post), the model Property (secList) is null. Can you please advise from where I'm getting it wrong?

I am using snippets with my kendo editor and need to replace the standard "Insert HTML" drop down label with "Insert Merge Field".

I have tried simply replacing the text, but it gets replaced as soon as i insert the first field.

TIA

Hello,
I have a combobox that looksup on a table with a lot of data and I wish to call an action of a controller to retrieve data while typing.... how can achieve this with Kendo UI MVC with Razor's helpers?

Thanks

Is there a simple way to remove or hide the down arrow on a top level menu?

Hi Team,

I want to make date picker textbox readonly so that user can only select the date from picker,but can not edit,so I do not need to do the client side validation any more.

and the next thing is I want to display the date in .Format("dd MMM yyyy") format,but while passing this valuse to server,I want it to be in default dd-MM-yyyy format

Can you please help me out in doing this.

Thanks & Regards,

Preeti

Hi to all,

Great day

Can you help me on how to add properly the confirm dialog before click the upload button on select event in kendo upload.
Below is the code where the confirm dialog is appearing but still the upload is still in-progress which is not right.
It should wait for the user to confirm the upload yes or no before progress event is activated.

Here's my code below:

$(document).ready(function () {

        var lookup = $("#ComboLookupTable").data("kendoComboBox");
        $("#files").kendoUpload({
            async: {
                saveUrl: "Lookup/UploadFile",
                autoUpload: false,
                value: 'Import'
            },
            localization: {
                select: "Select a file",
                uploadSelectedFiles: "Import",
                headerStatusUploaded: "File validation",
                headerStatusUploading: "File uploading...",
                statusFailed: "Uploading file failed",
                statusUploaded: "File validating...",
                statusUploading: "Uploading..."
            },
            multiple: false,
            select: function (e) {
                confirmUpload(e);
                              
            },
            progress: function (e) {
                debugger;
                onProgress(e);
            },
            upload: function (e) {
               // debugger;
                lookup.enable(false);
                this.element.prop("disabled", true);
                this.element.closest(".k-button").addClass("k-state-disabled");
                 e.data = { selectedTable: $("#ComboLookupTable").val() };
            },
           
            success: function (e) {
                //debugger;
                resetUpload();
                if (e.XMLHttpRequest.responseText != '' && e.response != 'gridESREF' && e.response != 'gridFuelEfficiency' && e.response != 'gridConversionFactor' &&
                    e.response != 'gridGlobalEmissionFactor' && e.response != 'gridElectricalRegionalEmissionnFactor' && e.response != 'gridGWP') {
                    showErrorMsgsJson(e.XMLHttpRequest.responseText, 'windowDialog');
                    e.preventDefault();
                    dialog.close();
                }
                else {
                    var delay = 1500;
                    setTimeout(function () {
                        //grid names;
                        //gridRefresh(e.response);
                        dialog.close();
                    }, delay);
                }
            },
            complete: function (e) {
                resetUpload();
                this.element.prop("disabled", false);
                this.element.closest(".k-button").removeClass("k-state-disabled");
                lookup.enable(true);
            },
            error: function (e) {
                resetUpload();
                if (e.XMLHttpRequest.responseText != '') {
                    showErrorMsgsJson(e.XMLHttpRequest.responseText, 'windowDialog');
                    e.preventDefault();
                    dialog.close();
                }
            }

        });
    });

 
//Here's the function of my confirm dialog called by select event.


    function confirmUpload(e) {
        window.setTimeout(function () {
            $(".k-upload-selected").click(function (e) {
                // custom logic
                var kendoWindow = $("<div />").kendoWindow({
                    title: "Replace Lookup Table Data?",
                    height: 130,
                    width: 280,
                    resizable: false,
                    modal: true,
                    animation: {
                        open: {
                            effects: "fade:in",
                            duration: 500
                        },
                        close: {
                            effects: "slide:right fadeOut",
                            duration: 500
                        }
                    },
                    visible: false
                });

                kendoWindow.data("kendoWindow")
                    .content($("#upload-confirmation").html())
                    .center().open();

                kendoWindow
                    .find(".upload-confirm,.upload-cancel")
                        .click(function () {
                            if ($(this).hasClass("upload-cancel")) {
                                // If no
                                kendoWindow.data("kendoWindow").close();
                                e.preventDefault();
                                dialog.close();
                                return false;
                            }
                            else {
                                // If yes
                                kendoWindow.data("kendoWindow").close();
                            }
                        })
                                
            });
        }, 1);
       
    }


Thank you and God bless.

Hi guys...
I have a complex situation here.

I have a treeview loaded with remote data on server 
(exactly the same of your example) and so I have an mvc anction with a nullable id that returns the child of the selected node.
Now in the normal scenario the tree starts with all node collapsed.
The problem is that I need to provide a way to load the page, and the tree as well, with a particular node loaded.

Here my tree:

I don't provide the action cause it is a bit complex and misleading since I get the data from 3 different tables...
anyway...It works perfectly...

now, I tried to pass the parameter to the actual treeview view (mcv) (success) and then pass it the to client (js)

I guess I need to open the node client-side...and sometimes the selected node could be up to the 9 level deep...
the problem is: if I pass the id (of the node) as an argument of the DataBound event, this event fires when the treeview is not rendered yet.
(while if I attach the event handler as you see on the code I provided, it fires when the rendering is compleated) that's weird...
so..How can I achieve what I need? there's no other event that fires "on Compleate", right?
Can I pass my parameter and have the event fire In the right moment?


I hope I made myself clear.
thanks
Fabio

Hello,

I am trying to set marks on a marker layer via JSON returned from my MVC controller.  I am capturing an onCriteriaChange event from a ListView.  In the event handler function I am try the following


My declaration code is 


so you can see the layer already exists.  I just want to set a marker for the lat, long returned by my controller.  

I can verify that my controller is producing JSON (see attached screenshot).   But the markers do not show. Am I doing this correctly? Any help would be appreciated.

Hi,

I was using telerik for asp.net Ajax, and now I am using it's "evolution", telerik for asp.net MVC for a new website.

But I can't find how to export directly as it is displayed, with filter/group/order?

How can we do this?

Hello ,
maybe you can help me with some issue.

I use kendo grid, I have grid with
aggregates data, and it looks like that:

 Grid:
(attach as grid.jpg)

Aggregates: (I don't use all the aggregates)
(attach as Aggregates.jpg)

I save the grid state (paging, grouping,
sorting, filtering and aggregates) in cookie as (Java Script):

var gridState = {           
       page: dataSource.page(),           
       pageSize: dataSource.pageSize(),           
       sort: dataSource.sort(),           
       group: dataSource.group(),
       filter: dataSource.filter(),
      aggregates: dataSource.aggregates()
        };

Cookie (JSON) (Result of saving):
{"page":1,"pageSize":11,"group":[{"field":"Modality","dir":"asc","aggregates":[{"field":"Space","aggregate":"count"},{"field":"Priority","aggregate":"min"},{"field":"Priority","aggregate":"max"},{"field":"Priority","aggregate":"count"},{"field":"Priority","aggregate":"average"}]}],"aggregates":{"Priority":{"min":1,"max":4,"count":148,"average":3.0135135135135136},"Space":{"count":148}}}

And I try to restoring the grid from
cookie that I already save, I loaded it like that:

Restoring the grid state: (paging, grouping , sorting and filtering)
if (gridState!= '' && gridState!= null) {   
      grid.dataSource.query(gridState);
} 

But unfortunately is not work when I use
aggregate, an exception was throw:
"Uncaught ReferenceError: count is not defined"

And I don't understand it because I have count:
(attach as count.jpg)

Anyway those errors occurs just when I started use aggregates. before it, everything work just fine!

Thanks in advance.

Oren.