Telerik Forums
UI for ASP.NET MVC Forum
5 answers
152 views
I am using Kendo Grid for ASP.NET MVC in Server Edit mode. The grid is bound to a List<ModelObject>. I am using a Popup Editor. For the popup editor I am using a custom template. The ModelObject has some properties that should be loaded only when editing (lazy load). I have looked for samples but did not find how I can do lazy loading.

Are there any samples I can look at to get some ideas?

Thank you
Dimiter Madjarov
Telerik team
 answered on 18 Sep 2013
6 answers
338 views
I have a grid which columns are dynamically created on runtime. The grid renders fine, but I cannot resize the grid columns in Internet Explorer 8, because the resize handle icon is not shown. There is no problem in IE 9 or in any other browser.

When I use a static grid (column are defined in the razor view) the column resizing works fine also in IE 8. So the combination of dynamic grid columns and IE 8 causes the bug.

Here is the code I use in my razor View to define the dynamic grid:
@{
    string controller = ViewContext.GetCurrentController();
    string action = ViewContext.GetCurrentAction();
    string methodName = "_GetNewGridRows" + "_" + action;
 
    WFObjectListViewModel objectListViewModel = Model;   
}
 
@(Html.Kendo().Grid(objectListViewModel.ObjectDataList)
    .Name("Grid_" + objectListViewModel.UniqueID)
    .Columns(columns =>
    {
        columns.Bound(c => c.ID)
            .Hidden(true)
            .Title("wfID");
 
        columns.Bound(c => c.AspSite)
            .Hidden(true)
            .Title("aspSite");
 
        for (int i = 0; i < objectListViewModel.FolderColumns.Count; i++)
        {
            var id = i;
            var itemAttributesId = id + 2;
 
            if (objectListViewModel.FolderColumns[i].Type == "text")
            {
                string template = null;
                 
                if (Model.FolderColumns[i].ColumnName == "subject")
                {
                    string wfID = "\"#=ItemAttributes[" + 0 + "]#\"";
                    string aspSite = "\"#=ItemAttributes[" + 1 + "]#\"";
                    string jsOpenWindow = "javascript:openWindow(" + wfID + ", " + aspSite + ")";
                     
                    template = string.Format("<a href='{0}' style='white-space: nowrap;'>{1}</a>", jsOpenWindow, "#=ItemAttributes[" + itemAttributesId + "]#");
                }
                else
                {
                    template = string.Format(Model.FolderColumns[id].Template, "#=ItemAttributes[" + itemAttributesId + "]#");
                }
                                 
                columns.Bound(c => c.ItemAttributes)
                        .ClientTemplate("#=gridClientTemplate(Unread, 'begin')#" + template + "#=gridClientTemplate(Unread, 'end')#")
                        .Title(Model.FolderColumns[id].ColumnDisplayName)
                        .Hidden(Model.FolderColumns[i].Hidden)
                        .Column.Member = Model.FolderColumns[id].ColumnUniqueName;
 
            }
            else if ((Model.FolderColumns[id].Type == "image") || (Model.FolderColumns[id].Type == "deadline") || (Model.FolderColumns[id].Type == "bit"))
            {                  
                int columnWidth = 22 + (Model.FolderColumns[id].ColumnDisplayName.Length * 5);
                columns.Bound(c => c.ItemAttributes)
                    .ClientTemplate("#=gridClientTemplate(Unread, 'begin')#" + string.Format(Model.FolderColumns[id].Template, "#=ItemAttributes[" + itemAttributesId + "]#") + "#=gridClientTemplate(Unread, 'end')#")
                    .Title(Model.FolderColumns[id].ColumnDisplayName)
                    .Width(columnWidth)
                    .Hidden(Model.FolderColumns[i].Hidden)
                    .Column.Member = Model.FolderColumns[id].ColumnUniqueName;
            }
        }
    })
    .EnableCustomBinding(true)
    .DataSource(dataSource => dataSource.Ajax()
        .Read(read => read.Action(methodName, controller, new { folderID = Model.FolderID, searchFilterJson = ViewData["hiddenSearchFilter_Data"] }))       
        .PageSize(Model.EntriesPerPage)
        .Total(Model.TotalItems)
    )
    .Sortable(sorting => sorting.SortMode(GridSortMode.MultipleColumn))
    .Selectable()
    .Scrollable()   
    .Resizable(resizing => resizing.Columns(true))
    .Events(events => events.DataBound("onObjectDataListBound_" + controller + "_" + action))
    .Pageable(pageing => pageing.Enabled(true).Refresh(Model.AllowGridRefresh).Input(true).Numeric(false).PreviousNext(true).PageSizes(new int[] {3, 5, 10, 15, 25, 50, 75, 100 }))
)

Any idea how I can get the resizing handle shown when I move over the columns in IE 8? Updating to IE 9 is not a solution for me, because the customer is forced to use IE 8. Thanks.
Daniel
Telerik team
 answered on 18 Sep 2013
0 answers
48 views
I'm just posting this here for all the Kendo UI/MVC newbies out there...
If you copy and past the code snippet from http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/helpers/datepicker/overview, you will get a compilation error about missing parentheses.
Delete all the comments and it will run fine.
Pauline
Top achievements
Rank 1
 asked on 18 Sep 2013
1 answer
1.0K+ views
Please see the attached screenshot.

This only happens when we have both the virtual scrolling and the height set and then we filter.  It doesn't always happen, usually only after filtering on multiple columns.
@(Html.Kendo().Grid<BulletinModel>()
                .Name("Grid")
                .Editable(ed => ed.Mode(GridEditMode.PopUp).Window(w => w.Width(950)))
                .Selectable()
                .Scrollable(scrollable => scrollable.Virtual(true))
                .Sortable()
                .HtmlAttributes(new { @style = "height: 600px;" }))
Is there any way around this behavior?  Maybe setting the scrollable height on one of the containers?
Dimo
Telerik team
 answered on 17 Sep 2013
4 answers
258 views
Hello,

I have some troubles about resources in scheduler, so I come here to find some help.
I want to make a scheduler for some employees. For a better readability, I would like that every user's event has a unique color. Colors are stored in database, on with all User's data. So I decided to use Resources to do this.

However, when I define a remote loading for resources, then scheduler raise on error (see below) and stop working.
Here is Razor code :

@(Html.Kendo().Scheduler<EventViewModel>()
          .Name("calendar")
          .Date(DateTime.Now)
          .Timezone("Etc/UTC")
          .Views(v =>
          {
              v.DayView();
              v.WeekView(conf => conf.Selected(true));
              v.MonthView();
              v.AgendaView();
          })
          .DataSource(source => source
              .Model(conf =>conf.Id(f => f.EventId))
              .AutoSync(true)
              .Read("GetAllEvents", "Activity")
              .Create("CreateEvent", "Activity")
              .Destroy("DestroyEvent", "Activity")
              .Update("UpdateEvent", "Activity")
          )
        .Resources(resources => resources.Add(m => m.Creator)
            .Title("User")
            .DataTextField("Name")
            .DataValueField("UserId")
            .DataColorField("Color")
            .DataSource(source => source
                .Read(read => read.Action("GetUsersList", "Activity"))))
)

If I remove .Resources() part, all is working great. Defining some static resources (with .BindTo(new[]{...})) works well too, but this way is not handy.
Finally, when I want to define a resources section with remote loading, I got the following error messages in FireFox :

TypeError: t is undefined @ /Scripts/kendo/2013.2.716/kendo.all.min.js:31
TypeError: n.slice is not a function @ /Scripts/kendo/2013.2.716/kendo.all.min.js:11


Users list is perfeclty loaded in my page. Here is GetUsersList() code :
public ActionResult GetUsersList([DataSourceRequest] DataSourceRequest request)
{
    var items = from x in db.Users
                        select new {x.UserId, Name = x.FirstName + " " + x.LastName, x.Color};
    return Json(items.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}

One thing I notice is that, when resources are loaded up, scheduler does not trigger any loading for events. I'm not yet used to scheduler helper, so it's not really easy to understand what issue is.

Thanks you for your help.

Best Regards,
Claude
Claude
Top achievements
Rank 1
 answered on 17 Sep 2013
3 answers
1.1K+ views
Hello all,

I am relatively new to the Kendo UI suite, so I need some assistance in an application I'm working on.  I'm using Visual Studio 2010, MVC3.  I will do my best to explain my situation and the problem I'm trying to solve.

I'm trying to handle the login process for my application using a popup window that is raised by a link in the main browser window.  On my main screen, I have an Html.ActionLink that opens the view for the logon page (screen shot #1).  This is a simple view with one link.  The logon view contains the definition for the Kendo window, so the username/password entry screen is then presented as a modal popup (attached screenshot #2).  When the logon link on the main page is clicked, the Kendo window opens as a popup without any issues, and I can enter the user and password.   If the entered user and password is correct, the popup closes and the controller code redirects the user to the application's main menu of options in the browser window, as expected.  The problem arises when the user/password fails validation, because the popup window still closes, and the resulting "invalid login" message is displayed in the main browser window.  I'm trying to keep the popup open after the submission, and display the error within the popup, so the user can try again (simulated in screen shot #3).

All of the logic for the Kendo window definition exists in the logon view, not the main view.  Also, I'm not sure which pieces of code to post in helping to clarify this, but I will gladly do so if it helps me to resolve the problem.  So, in a nutshell, how do I keep my logon popup window open and have it receive the results of an invalid user/password submission, rather than have it close and the results sent to the main browser window.

Thanks in advance,
Bob

Daniel
Telerik team
 answered on 17 Sep 2013
1 answer
89 views
I like the ImageUploader.

So can I use it on its own ?

I was thinking maybe hide the editor and have a button which would exec the appropriate command to open the ImageUploader control.  
So effectively it would work as an image file manager.

Is  this possible ?
Iliana Dyankova
Telerik team
 answered on 17 Sep 2013
2 answers
217 views

We have a page with Kendo UI grid and simple search field with Kendo UI Autocomplete inititated on it. Search field has a placeholder "Type resource key".

On any version of internet explorer, when user navigates grid using pagination, the "GetResourceValues" function, that populates grid, gets search field's placeholder value as request parameter:

sort=&page=2&pageSize=25&group=&filter=&language=-&searchKeyword=Type+resource+key&resourceType=

While in other browsers the request looks like this:

sort=&page=3&pageSize=25&group=&filter=&language=-&searchKeyword=-&resourceType=

This leads to empty grid results after using pagination. Can it be Kendo UI bug?

Here is part of the code:

@(Html.Kendo().Grid<ResourceViewModel>()
          .Name("resourcesList")
          .Events(e => e.DataBound("handleDataBound"))
          .Pageable()
          .Resizable(resizable => resizable.Columns(true))
          .ClientDetailTemplateId("resourceDetailsTemplate")
          .DataSource(dataSource => dataSource
                                        .Ajax()
                                        .Events(events => events.Error("errorHandler"))
                                        .ServerOperation(true)
                                        .Batch(false)
                                        .Model(model => model.Id(res => res.Id))
                                        .Create(create => create.Action("CreateResource", "Resources"))
                                        .Update(update => update.Action("UpdateResource", "Resources"))
                                        .Destroy(destroy => destroy.Action("DeleteResource", "Resources"))
                                        .Read(read => read.Action("GetResources", "Resources").Data("searchCriteria"))
                                        .PageSize(25))
          .Sortable()
          .Scrollable()
          .ToolBar(factory =>
                   factory.Template(@<text>
        <div class="k-grid-toolbar-row">
            <input id="resourceSearch" class="k-grid-toolbar-search-field" />
        </div>
    </text>)))

<script>
    $(document).ready(function () {
        var autocompleteSymbol = $("#resourceSearch").kendoAutoComplete({
            dataTextField: "Key",
            minLength: 2,
            dataValueField: "Key",
            filter: "contains",
            placeholder: "Type resource key",
            dataSource: {
                type: "json",
                transport: {
                    read: "Resources/GetAutoComplete",
                    maxRows: 50000
                }
            },
            change: filterResources
        });
    });
</script>

Paulius
Top achievements
Rank 1
 answered on 16 Sep 2013
1 answer
64 views
I want to use the mvc wrappers grid filter to select a sub group of data, and then use that data to send a sms. How do access that data using  on the server?
Thanks
Nikolay Rusev
Telerik team
 answered on 16 Sep 2013
1 answer
200 views
I have a list view that supports viewing and deleting attached files.  That works just fine.  The problem I am having is when I try to add a new file to the list.  I have a custom editor template for the AttachedFile object, but when the editor runs the Model passed into it is empty.  I have specified a default value on the field that I need to access in editor template, which I would assume would be passed to the editor.  

Here is my ListView:
@(Html.Kendo().ListView<AttachedFile>()
    .Name("attachedFilesListView")
    .TagName("div")
    .ClientTemplateId("attachedFilesTemplate")
    .DataSource(dataSource => dataSource
        .Model(model => {
            model.Id(f => f.AttachedFileID);
            model.Field(f => f.EntityTableKey).DefaultValue(Model.CorrectiveActionItemID);
        })
        .Read(read => read.Action("Files_Read", "CorrectiveActionItem", new { correctiveActionItemId = Model.CorrectiveActionItemID }))
        .Destroy(destroy => destroy.Action("Files_Delete","CorrectiveActionItem"))
        .PageSize(4)
    )
    .Pageable()
    .Editable()
)
Here is my EditorTemplate:
@model AttachedFile
 
@(Html.Kendo().Upload()
    .Name("files")
    .Async(a => a.Save("SaveFile", "CorrectiveActionItem", new { correctiveActionItemId = Model.EntityTableKey })
    .AutoUpload(true))
)
The problem is the Model.EntityTableKey is empty in the editor.  

What am I doing wrong?  Shouldn't the default value be passed to the editor template?
Steton
Top achievements
Rank 1
 answered on 13 Sep 2013
Narrow your results
Selected tags
Tags
+? more
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?