Telerik Forums
UI for ASP.NET MVC Forum
7 answers
1.1K+ views
Hi,

I have a grid that is populated from my Controller. My controller gets its data from an external webservice, and then populates a list in my controller, and then the view is fed with this list.

This is my controller:
public ActionResult Index()
{
    var client = new UnitServiceClient();
    var listOfUnitsFromService = client.GetListOfUnits(true);
 
    var model = new UnitModel
                    {
                        UnitTypes = listOfUnitsFromService.ToList()
                    };
        return View(model);
}
And this is my grid (cshtml):
<div class="row-fluid">
    <div class="span12">
        <div class="k-block">
            <div class="k-header">Unit List</div>
            @(Html.Kendo().Grid(Model.UnitTypes)
            .Name("Grid")
            .Columns(columns =>
                {
                    columns.Bound(p => p.Id).Groupable(false);
                    columns.Bound(p => p.Name);
                    columns.Command(command => { command.Custom("Edit Unit"); }).Width(160);
                })
                .Groupable()
                .Pageable()
                .Sortable()
                .Scrollable()
                .Filterable()
                )
        </div>
    </div>
Populating the grid when the page is loaded is no problem, but I'd like to update my grid with a new list of units whenever the user clicks the checkbox. Any help would be appreciated :)
Nicklas
Top achievements
Rank 1
 answered on 26 Apr 2013
9 answers
283 views
Dear Kendo Team,

I'm using a simple grid, which I binded with few thousand records, and added a Change event. Below is the code.
@(Html.Kendo().Grid(Model.OtherCompanyVesselsModelList)
                      .Name("grdOtherCompanyVessels")
                      .Columns(columns =>
                      {
                          columns.Bound(p => p.ID).Visible(false).Width(50);
                          columns.Bound(p => p.VesselName).Width(150);
                          columns.Bound(p => p.IMONo).Width(100);
                      })
                              .Pageable(paging => paging.PageSizes(new int[3] { 50, 100, 500 }))
                              .Sortable()
                              .Selectable()
                              .Navigatable()
                              .Scrollable(scrollable => scrollable.Height(480))
                              .Reorderable(reorder => reorder.Columns(true))
                              .Resizable(resize => resize.Columns(true))
                              .Events(e => e.Change("onChange"))
                              .Filterable()
                              .DataSource(dataSource => dataSource
                                                            .Ajax()
                                                            .Read(read => read.Action("FetchOtherCompanyVesselDetails", "OtherCompanyVessels"))
                                                            )
                              )

Now in my Change event, I just kept one alert.

function onChange(e) {
        alert('In Change');
    }

But when I run the page in FireFox 19.0 and selects any row in the grid, it shows alert after long time(approx 10-15 seconds), and second time when I select any other row the FireFox itself stops responding. Finally I've to close FireFox.
And the same thing if I execute in Chrome 24.0, it works perfectly.
And in IE 9, the change event executes twice and prompt alert twice.

Grateful, if you assist me here.
I'm using Kendo.Mvc v4.0.30319 with VS2012.

Regards,
Suraj Kumar Singh.
saritha
Top achievements
Rank 1
 answered on 25 Apr 2013
1 answer
1.0K+ views
I have an aggregate on the quantity column returning the sum. Is it possible for it to only return the total for one groupings instead of returning a total for each of my groupings? I would just like a total for the ShippedDate grouping.
        
/// Code ///
01.        @(Html.Kendo().Grid(Model)
02.    .Name("Grid")
03.    .HtmlAttributes(new { style = "width:80%" })
04.    .Columns(columns =>
05.    {
06.        columns.Bound(p => p.CountyID);
07.        columns.Bound(p => p.County);
08.        columns.Bound(p => p.OrderNum);
09.        columns.Bound(p => p.ShippedDate).Format("{0:MM/dd/yyyy}");
10.        columns.Bound(p => p.InvCode);
11.        columns.Bound(p => p.TagName);
12.        columns.Bound(p => p.Quantity)
13.            .ClientGroupFooterTemplate("Total: #=sum#");
14.    })
15.    .Groupable()
16.    .Pageable()
17.    .Sortable()
18.    .Filterable()
19.    .DataSource(dataSource => dataSource
20.        .Ajax()
21.        .Group(g => g.Add(p => p.CountyID))
22.          .Group(g => g.Add(p => p.County))
23.            .Group(g => g.Add(p => p.OrderNum))
24.              .Group(g => g.Add(p => p.ShippedDate))
25.         .Aggregates(aggregates =>
26.            {
27.                aggregates.Add(p => p.Quantity).Sum();
28.            })
29.        .Read(read => read.Action("CountyMonth_Read", "Report").Data("CountyMonthData"))
30.        .PageSize(10)
31. 
32.    )
33. 
34.)
Daniel
Telerik team
 answered on 25 Apr 2013
6 answers
256 views

Hello all Kendo experts. I'm facing an issue here with MVC Grid batch update. Your help will be appreciated here. So here is my scenario.

  1. I'm using ASP.NET MVC 4 with Kendo UI. I'm using a grid  with batch update.
  2. There are some rows, that the user types in value (numeric), and there are some rows, that are calculated fields, and are not editable.

Please bear in mind, it's the same column, but rows are editable or not (given the condition). I've alredy acheived at this point.

(See screenshot attached).

What I'm looking for is.

On Save Changes event, calculate the values of the other rows.
The problem I'm facing is, since on the natch update, these rows were not "Edited" by the user, these values are not refreshes at the controller.
So, basically what I'm looking for, is for the same type of column, make some rows non-editable, but refresh with calculated values on the Save changes.

In the screeshot supplied, the rows in blue are my calculated rows.

Any help please?

Sachin
Top achievements
Rank 1
 answered on 25 Apr 2013
1 answer
73 views

Greetings, I've been trying to set up a modal popup Window that contains a treeview from which a user can select a single item and then close the window.  

I basically took the code we use all over our site for modal popup windows (without errors) and then just tried putting a treeview in it.   In Firefox the error is not explicitly thrown, the tree itself renders, but anything you tried to put in the window underneath the treeview does not render at all.  In Chrome, the window renders but not the tree and no error is thrown (i.e. you get an empty window).  In IE9 (9.0.8112.16421) you get an error in jQuery-1.8.2.min.js as soon as you try to open the window.  The error says "0x80020101 Microsoft JScript Runtime Error:  could not complete the operation due to error 80020101" (useful, I know).  The window never opens at all.  I am running Windows 7.

I created a dummy test page on my site that includes only the kendo and jQuery libraries/css/js files in the layout and removes everything not involved with housing the treeview in the window and I still get the same error.

The error occurs before calling the controller method to get the data to populate the tree (and I have another treeview that is NOT in a window using the same controller method which one works properly, and if I run in firefox it does actually call the method and populate the tree, just nothing below the tree like buttons - so I am positive the problem is not the controller method).  You can substitute any data you want if you try to repro this since the code below is data agnostic, just give it's type a property called TagName or substitute your own value of DataTextField.

If I remove the code defining the treeview and replace it with a simple "hi", I do not get the error, which proves the problem is the tree + window combination (because remember, the exact same tree works perfectly outside of the window).  

My code is below, distilled down to the absolute simplest case, still throwing the same error in IE9:
(I even got rid of the select handler and the confirm/cancel buttons just to try to get rid of the error)

The versions of jQuery & jQueryUI we include are the full downloaded library from jQuery - we have not customized them in any way.  The specific version number that we are using are ones we've had to upgrade to because of error conflicts with other between other Kendo controls and jQuery.  I suspect something similar is at play here.

If there is a specific way I need to set up the window to support this functionality please let me know, or if there is a problem with the interaction of the window + tree + jQuery that needs to be fixed can we please get a patch for it ASAP?  There are a bunch of places in our app where we'll need to have a tree in a popup window like this.

Thanks in advance, please let me know if you need anything else from me to diagnose the issue!

@model NeedleFinder.WebUI.Areas.CaseMgmt.Models.Tag.ManageTagsViewModel
@using Kendo.Mvc.UI
@{
    ViewBag.Title = "TreeWindowPopup";
    Layout = "~/Views/Shared/_TestLayout.cshtml";
}
<div>  <input type="button" name="btnChooseParent" value="Select" onclick="openParentTagList();" />
</div>
<script id="parentTagSelection" type="text/x-kendo-template">

  @(Html.Kendo().TreeView()
        .Name("trvParentTag")
        .DataTextField("TagName")
       .DataSource(dataSource => dataSource
                                      .Read(read => read
                                                        .Action("GetTagsForTree", "Tag", new { area = "CaseMgmt" }))
        )
   )  

     
</script>
  
<script type="text/javascript">

    function openParentTagList() {
        var kendoWindow = $("<div />").kendoWindow({
            title: "Select parent tag",
            resizable: false,
            modal: true,
            height: 500,
            width: 400
        });

        kendoWindow.data("kendoWindow")
            .content($("#parentTagSelection").html())
            .center().open();

       
        return false;
    }
   
    </script>


My layout looks like this:
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title</title>
     <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/themes/redmond/jquery-ui.css")" rel="stylesheet" type="text/css" />
    <!-- PROTOTYPE CSS -->

    <link href="@Url.Content("~/Content/Kendo/2013.1.319.340/kendo.common.min.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/Kendo/2013.1.319.340/kendo.default.min.css")" rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/jquery-1.8.2.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/Kendo/2013.1.319.340/kendo.web.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/Kendo/2013.1.319.340/kendo.aspnetmvc.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery-ui-1.10.2.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jQuery.Validate.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

    @if (false)
    {
        <script src="@Url.Content("~/Scripts/jquery-1.5.1-vsdoc.js")" type="text/javascript"></script>
    }
</head>

    <body>
       
        @RenderBody()
</body>
</html>
Petur Subev
Telerik team
 answered on 25 Apr 2013
1 answer
604 views
Hello All,

I set up a parent/child grid much like the Hierarchy demo.  In my case I wanted to make both grids editable (inline).  But I kept getting an invalid template error on my child grid as soon as I added the .Editable() section to it.  After some investigation and commenting/uncommenting things on the child grid and my model I discovered that the error was related to my Required validator message on the model.  My validation message was "The field '{0}' is required."  It seems like the single quotes in the validation message aren't being escaped properly when the template is created or something like that because when I changed the validation message to "The field {0} is required." everything works fine.  So I'm able to get around the issue, but I thought I'd let you know in case this is something that can be fixed in the core code.  Thanks!

Regards,
Brian
Petur Subev
Telerik team
 answered on 25 Apr 2013
1 answer
89 views
In my application, I frequently use multiple DropDownLists on the same page. Most of the time, the data sources for those lists (which are connected to a SQL Server database) load quickly and there's no problem. Every once in a while, however, the load hangs and all the dropdowns show the spinning 'loading' icon. Sometimes they resolve on their own and finish loading. Sometimes they throw one of several errors that I know relate to simultaneous SQL transactions running in the database (I apologize, I don't have the error text for any of them at the moment, but I will update this thread if and when I do).

Anyone know about this issue or have suggestions on how I can avoid the problem and improve performance?
Petur Subev
Telerik team
 answered on 25 Apr 2013
0 answers
102 views
While working through a process of batch editing a database tables that
had a timestamp field in each row for concurrency checking. It was not
immediately apparent the the return value for the update could be the
same as that for the create procedure.

Could you update your
documentation to explain that during an update you can return the
results of the update process to the grid.
so using generics the insert process can be:-

public
static DataSourceResult AddChanges<TEntity>([DataSourceRequest]
DataSourceRequest request, System.Data.Entity.DbContext context,
System.Web.Mvc.ModelStateDictionary modelState,
System.Collections.Generic.IEnumerable<TEntity> dbes)
where TEntity : class
{
   var results = new System.Collections.Generic.List<TEntity>();
   if (dbes != null && modelState.IsValid)
   {
      foreach (var dbe in dbes)
      {
         if (AddChanges<TEntity>(context, modelState, dbe))
            results.Add(dbe);
      }
   }
   return results.ToDataSourceResult(request, modelState);
}

and the update process can also be:-

public
static DataSourceResult SaveChanges<TEntity>([DataSourceRequest]
DataSourceRequest request, System.Data.Entity.DbContext context,
System.Web.Mvc.ModelStateDictionary modelState,
System.Collections.Generic.IEnumerable<TEntity> detached)
   where TEntity : class
{
   var results = new System.Collections.Generic.List<TEntity>();
   if (modelState.IsValid)
   {
      foreach (var dbe in detached)
      {
         if (SaveChanges<TEntity>(context, modelState, dbe))
            results.Add(dbe);
      }
   }
   return results.ToDataSourceResult(request, modelState);
}


NOTE the return of the results from the Save process

so in a controller the create and edit ActionResults would like :-
[AcceptVerbs(HttpVerbs.Post)]
public virtual ActionResult ProductPricingClientCreate([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<ProductPricing> prices)
{
   return Json(PS.Common.DataAccess.AddChanges<ProductPricing>(request, db, ModelState, prices));
}

[AcceptVerbs(HttpVerbs.Post)]
public virtual ActionResult ProductPricingGridUpdate([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<ProductPricing> prices)
{
   return Json(PS.Common.DataAccess.SaveChanges<ProductPricing>(request, db, ModelState, prices));
}


Timothy
Top achievements
Rank 1
 asked on 24 Apr 2013
1 answer
240 views
Hi there,

I am continuing to eval the kendo grid for purchase and seeing if I can get it working in my application which is using MVC 4 and kendo 2013.1.319. 

While swapping in the dropdown I am running into an error for only certain records where the Select Event function on the dropdown is not recognized; even though it is present in the javascript. Its weird because it works for most records that visit the details page and once in awhile it breaks and I can't figure out why. Any ideas?

For example:

I am binding this list with a selectlist in the controller and the values are properly set. there is a full list and the Id is there in the list.

//select list on the viewmodel
pvModel.CostCenterList = new SelectList(_setupBiz.GetNonOverheadCostCenters(), "Key", "Value",pvModel.CostCenterId);

I have this DDL on the .cshtml page

                    @(Html.Kendo().DropDownList()
                        .Name("CostCenter")
                        .OptionLabel("Pick a costcenter...")
                        .BindTo(Model.CostCenterList)
                        .Events(e=>e.Select("CostCenterSelect"))
                        )

and this script in my <scripts> section

    function CostCenterSelect(e) {       
        var costCenter = this.dataItem(e.item.index());
        if (costCenter.Value > 0) {
//stuff happens
        }
        else {
//hide a bunch of buttons        }
    };







Tim
Top achievements
Rank 1
 answered on 24 Apr 2013
1 answer
107 views
Hi,

How to check kendo datasource is null before bind to any control
Vladimir Iliev
Telerik team
 answered on 24 Apr 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?