Telerik Forums
UI for ASP.NET MVC Forum
1 answer
77 views

The master grid is not recognized as a master grid.

Detail Template

<script id="inviteehistorytemplate" type="text/x-kendo-template">
    @(Html.Kendo().Grid<BusinessEntities.ChangeHistory>()
        .Name("grid_#=EventID#") // make sure the Name is unuque
        .Columns(c =>
        {
            c.Bound(h => h.FieldName);
            c.Bound(h => h.NewValue);
            c.Bound(h => h.OldValue);
            c.Bound(h => h.UpdatedBy);
            c.Bound(h => h.UpdatedOn);
        })
    .DataSource(dataSource =>
        // Make request to GetInviteeChangeHistory and provide the current ContactID as a route parameter
        dataSource
        .Ajax()
        .Read(read => read.Action("GetInviteeChangeHistory", "Contacts", new { contactId = Model.Contact.ContactID, eventId = "#=EventID#" }))
    )
        .Scrollable()
        .ToClientTemplate()
    )
</script>

Master grid code. Grid is populated by the model.

 

@(Html.Kendo().Grid(Model.EventHistory)
    .Name("contacteventhistorygrid")
    .Sortable()
    .Scrollable()
    .ClientDetailTemplateId("inviteehistorytemplate")
    .NoRecords()
    .HtmlAttributes(new { @class = "eb-table-header" })
    .Columns(c =>
        {
            c.Bound(e => e.EventID).Title("Event ID");
            c.Bound(e => e.EventDate).Title("Event Date").Format("{0: MM/dd/yyyy}");
            c.Bound(e => e.Name).Title("Event Name");
            c.Bound(e => e.TotalSeats).Title("Total Seats");
            c.Bound(e => e.PartyVenue2).Title("Theatre");
            c.Bound(e => e.PartyVenue1).Title("Party Venue");
        })
  
    .Events(events => events.DataBound("Contacts.fn.eventhistory_DataBound"))
)

JavaScript

 

eventhistory_DataBound: function (e) {
        this.expandRow(this.tbody.find("tr.k-master-row").first());
}

Screenshot of the results

 

 

Shawn
Top achievements
Rank 1
 answered on 06 Nov 2015
7 answers
476 views

When I try to add checkboxes to the TreeView,devtools int he browser show I am getting "Invalid Template"

This works (but no checkboxes).  But if I uncomment the ".Checkboxes part, it throws error.  I have tried many variants, including just ".Checkboxes(true)".

<script id="UserDetailsTemplate" type="text/kendo-tmpl">

    @*@Html.Kendo().TextBox().Value("foo #= User_Login#").Name("yoda_#=User_Login#")*@
    @(Html.Kendo()
          .TabStrip()
          .Name("userTabStrip_#=Person_ID#")
          .SelectedIndex(0)
          .Items((items) =>
                 {
                     items.Add()
                          .Text("Contact Info");
                     items.Add()
                          .Text("Permissions")
                          .Content(obj => Html.Kendo()
                                              .TreeView()
                                              .DataTextField("Name")
                                              .Name("userModulePermissions#=Person_ID#")
                                              //.Checkboxes(cbxConfig => cbxConfig.Enabled(true)
                                              //                                  .CheckChildren(true)
                                              //                                  .Name("checkedNodes"))
                                              .DataSource(d => d.Read("PermissionsTree_Read",
                                                                      "SettingsUsers"))
                                              .ToClientTemplate());
                     items.Add()
                          .Text("Group Membership");
                 })
          .ToClientTemplate()
          )
</script>

Here is the action the provides the tree data:

         public JsonResult PermissionsTree_Read(long? id)
        {
            var moduleId = id;
            var tracDB = new TRACEntities();
            // because modules & permissions are not same thing, we have to distinguish what "level" we are at in the tree
            // modules are root level, permissions (sub_sections) are next (leaf) level
            if (moduleId == null)
            {
                var result = GetOrgModules()
                    .Select(m => new {   
                                         id = m.Module_Type_ID,
                                         Name = m.Module_Type_Name,
                                         hasChildren = GetUserModuleSubsectionPermissions(m.Module_Type_ID).Any(),
                                         @checked = false
                    });
                return Json(result,
                            JsonRequestBehavior.AllowGet);
            }
            else
            {
                var result = GetUserModuleSubsectionPermissions((long) moduleId)
                    .Select(p => new {
                                         id = p.Sub_Section_Type_Id,
                                         Name = p.Sub_Section_Type_Desc,
                                         hasChildren = false,  //always leaves
                                         //@checked = false  //I have tried with and without this line -- it was just a guess that this was needed
                                     });
                return Json(result,
                            JsonRequestBehavior.AllowGet);
            }
        }

 

Dimo
Telerik team
 answered on 06 Nov 2015
1 answer
103 views

Here's my ViewModel

    public class EmailStartsViewModel
    {
        public int Year { get; set; }
        public int Week { get; set; }
        public int Starts { get; set; }
    }​

 I would like to display a line chart that has a category axis value for each week of the year i.e. 1 - 52, and that groups the data by year, so that it display a line for each year.

The data covers 2012 through the present, and looks like this: 

Year     Week Starts
2013    1         1
2015    1         11
2014    2         1
2015    2         8
2013    3         3
2015    3         20
2013    4         9
2015    4         30
2012    5        1
2013    5        3
2014    5        1
2015    5        18

etc up to week 53 (because of partial weeks) 

 

With these settings 

                  .DataSource(ds => ds
                      .Read(read => read
                          .Action("StartData", "Starts")
                          .Data("StartSettings"))
                      .Group( group => group.Add(model => model.Year))
                              .Sort(sort => sort.Add(model => model.Week))
                  )
                  .Series(series =>
                  {
                      series.Line(model => model.Starts, categoryExpression: model => model.Week).Name("Starts");

                  })
                  .CategoryAxis(axis => axis
                      .Categories(model => model.Week)
                  )​

It starts with week 5 which is the first week that has data in the first year. Weeks 1-4 aren't displayed

I've tried various combinations like directly specifiying the categories 

.CategoryAxis(axis => axis
                      .Categories("1", "2", "3", "4", "5", "6"....."52"))

and removing the categoryExpression in 

series.Line(model => model.Starts, categoryExpression: model => model.Week).Name("Starts");​

and it either doesn't show all the weeks, or puts values in the wrong category, or both.

 What's the right way to go about this?

 

Iliana Dyankova
Telerik team
 answered on 06 Nov 2015
3 answers
706 views

 The treeview events demo has event handlers such as the following:

         function onCheck(e) {

                  kendoConsole.log("Checkbox changed :: " + this.text(e.node));

                  //???????  do something useful  ?????

         }

But how would I do something useful, like get ID, checked status (checked or unchecked), or other fields of the item checked?

If the data source has model with fields "Id", "name", "something", how would I get those values?

Boyan Dimitrov
Telerik team
 answered on 06 Nov 2015
3 answers
678 views

I wish to connect the treeview checkboxes to an "enabled" field for records in my database.

Specifically, when a checkbox is clicked, I want to all an action to update the corresponding enabled field.

Also, with checkchildren(true), I want to likewise update the enabled field of all children.

What are the basics of how to do this?

The only demo using checkboxes also uses hard-coded tree items, with no connection to remote data.

Alex Gyoshev
Telerik team
 answered on 06 Nov 2015
1 answer
649 views

Hi telerik team,

I've a Multi-column comboBox and I need to get the value of 3 of the columns when the user select one item in JavaScript.

Here's my comboBox code:

01.@(Html.Kendo().ComboBox()
02.    .Name("comboBox1")
03.    .Events(x => x.Change("comboBox1_onChange"))
04.    .DataValueField("ID")
05.    .DataTextField("Description")
06.    .HeaderTemplate(
07.        "<div class=\"dropdown-header\">" +
08.        "<span class=\"k-widget k-header\">ID</span>" +
09.        "<span class=\"k-widget k-header\">Reference</span>" +
10.        "<span class=\"k-widget k-header\">Description</span>" +
11.        "<span class=\"k-widget k-header\">Internal Code</span>" +
12.        "</div>")
13.    .Template(
14.        "<span class=\"columnItem\">#: data.ID #</span>" +
15.        "<span class=\"columnItem\">#: data.Reference #</span>" +
16.        "<span class=\"columnItem\">#: data.Description #</span>" +
17.        "<span class=\"columnItem\">#: data.InternalCode#</span>")
18.    .Filter(FilterType.StartsWith)
19.    .DataSource(source => {
20.        source.Custom()
21.        .ServerFiltering(true)
22.        .ServerPaging(true)
23.        .PageSize(80)
24.        .Type("aspnetmvc-ajax") //Set this type if you want to use DataSourceRequest and ToDataSourceResult instances
25.        .Transport(transport =>
26.        {
27.            transport.Read("ProductsVirtualization_Read", "Edit");
28.        })
29.        .Schema(schema =>
30.        {
31.            schema.Data("Data") //define the [data](http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-schema.data) option
32.            .Total("Total"); //define the [total](http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-schema.total) option
33.        });
34.    })
35.    .Virtual(v => v.ItemHeight(26))//.ValueMapper("valueMapper"))
36.)

 

Can anyone give me a clue about how to read the value of "ID", "Reference" and "InternalCode" in the comboBox1_onChange event?

Thank you.

Kiril Nikolov
Telerik team
 answered on 06 Nov 2015
3 answers
213 views

I'm trying to use Kendo UI Grid in Orchard CMS (http://orchardproject.net) and I've almost been able to get it to work all the way but I can't seem to get validation to work. I've decorated my model with:

 

        [DisplayName("Namn")]
        [Required(ErrorMessage = "Ange värde")]
        public string Name { get; set; }

 

but when I try to update/create with empty value I get an error:

 

{"Message":"The request is invalid.","ModelState":{"civilStatusTypeViewModel.Name":["Ange värde"]}}​

 

But I am not getting any "visual validation" error message in the page.

 

It is quite complicated to setup Kendo UI with Orchard so this is most likely a configuration error, like a missing .css or .js, but I can't figure out where to look so I would be grateful for any help on how to solve this.

improwise
Top achievements
Rank 1
Iron
Iron
 answered on 06 Nov 2015
1 answer
310 views
Hi, my KendoUI version is v2015.2.902, i use a kendo grid for server paging, sorting, filtering and now i would like to add grouping functionality.
I use "function read" mode for dataSource calling asp.net mvc controller method. (server side request object is a Kendo.Mvc.UI.DataSourceRequest object)
this is my dataSource configuration:

let dataSource: any = {
  batch: true,
  serverPaging: true,
  serverSorting: true,
  serverFiltering: true,
  serverGrouping: true,
  page: 1,
  pageSize: 20,
  transport:
  {
      read: function (options)
      {
          kendo.data.transports["aspnetmvc-ajax"].fn.options.options = { prefix: '' };
          let request = kendo.data.transports["aspnetmvc-ajax"].fn.options.parameterMap(options.data, "read", false);

          thisObject.httpService.GetNodes(request)
          .then(function (args: IHttpServiceParameters)
          {
              options.success(args.data);
          });
      }
  },
  schema:
  {
      data: function (data)
      {
          return data.Data;
      },
      total: function (data)
      {
          return data.Total;
      },
      groups: function (data)
      {
          return data.Data;
      },
      model: model
  }
};

if i not use grouping all work fine, but using grouping the data result object seem not binding correctly.

args.data.Data returned from server has this schema:

[{ AggregateFunctionsProjection: null, 
   Aggregates: {}, 
   HasSubGroups: false, 
   Items: [],      <--- Keep note of this element name
   Key: "Invoice", 
   Member: "InvoiceColumnName", 
   Subgroups: [], 
   value: undefined 
 }, 
...]

the problem is when kendo.all.js parse the response of the server, passed from args.data.Data to convertGroup function (kendo.all.js line 7049)
in this function there is a call who reference to record.items object but the object in data returned from server is called Items (starting with uppercase)

kendo.all.js code:
function convertGroup(data, getters, modelInstance, originalFieldNames, fieldNames) {
      var record,
          idx,
          fieldName,
          length;

      for (idx = 0, length = data.length; idx < length; idx++) {
          record = data[idx];

          fieldName = originalFieldNames[record.field];
          if (fieldName && fieldName != record.field) {
              record.field = fieldName;
          }

          record.value = modelInstance._parse(record.field, record.value);

          if (record.hasSubgroups) {
              convertGroup(record.items, getters, modelInstance, originalFieldNames, fieldNames);    <--- Here the problem !!
          } else {
              convertRecords(record.items, getters, modelInstance, originalFieldNames, fieldNames);  <--- Here the problem !!
          }
      }
  }

do you have any suggestion? why the object returned from server have Items property insted of items?
How to solve?
In attachment the google developer tools screenshot.

Thanks
Rosen
Telerik team
 answered on 06 Nov 2015
1 answer
954 views

Hi Everyone, 

 I have a question regarding the ASP.NET MVC Dropdownlist.

 I load my DDL with data from the controller like this. 

public JsonResult GetCountries()
{
    SelectList list = null;
    ServiceSession.CreateService<MemberService>((Service) =>
        {
            var country = Service.GetCountryCode​s();
            list = new SelectList(country, "Id", "Name", country.Where(e=>e.Name== "Danmark").First());
        });
 
    return Json(list, JsonRequestBehavior.AllowGet);
}
this result return a list of countries and add them to the DDL. 

@(Html.Kendo().DropDownListFor(m => m.CountryCode)
     .DataTextField("Text").DataValueField("Value").SelectedIndex(185).
     AutoBind(true).DataSource(dataSource => dataSource.Read(read =>
     { read.Action("GetCountries", "Member"); })))

Everything is fine, but how can I set the selectedIndex by the text and not the ID in the list?

I can't be sure that Denmark is always number 185. 
​

Georgi Krustev
Telerik team
 answered on 06 Nov 2015
3 answers
349 views

 If I have a treeview with .DataSource(d=>d.Model(....).Read(r=>r.Action(....)))

Can I use .ItemAction() to set item.checked based on a field provided in the DataSource?  How?

In the code below, what would I put in place of the bolded comment?

@( Html.Kendo()
       .TreeView()
       .DataTextField("Name")
       .Name("userPermissionsTree")

       .Checkboxes(cbxConfig => cbxConfig.Enabled(true)
                                         .CheckChildren(true)
                                         .Name("checkedNodes"))
       .DataSource(d => d.Model(m =>
                                {
                                    m.Field("enabled");
                                    m.Id("permissionId")
                                })
       .Read(read => read.Action("PermissionsTree_Read",
                                                   "SettingsUsers",
                                                   new {
                                                       userId = Model
                                                   })))
      .ItemAction(item=>item.Checked=    /*******set to true if field enabled is true**********/    )
      .Events(events => events
        .Check("onPrivilegeCheck"))
      )

Daniel
Telerik team
 answered on 06 Nov 2015
Narrow your results
Selected tags
Tags
+? more
Top users last month
Anislav
Top achievements
Rank 6
Silver
Bronze
Bronze
Jianxian
Top achievements
Rank 1
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Jim
Top achievements
Rank 2
Iron
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Anislav
Top achievements
Rank 6
Silver
Bronze
Bronze
Jianxian
Top achievements
Rank 1
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Jim
Top achievements
Rank 2
Iron
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?