Hi, I have a webpage where I load the main page, and then load kendo.ui components (ASP.NET MVC) via ajax calls. On checking, the kendo.all.min.js library - all 1,5 MB of it - gets loaded with every call. That is because I have the scripts included in the page loaded via ajax. However, were I to exclude these scripts, the page loaded via ajax will not work correctly because the kendo.ui components will not work correctly.

How can I make these pages loaded via ajax use the kendo.all.min.js library loaded during the loading of the main page?

Thanks in advance.

Hi,

I have a sortable, pageable, filterable ajax binding grid with an external search panel inputs and a search button and i need to include these inputs values to
every grid sort, paging and filter actions.

So i need to pass the search input values to the server read action method on every action mentioned above and after that i need to add them to
the DataSourceRequest.Filters object property.

I have search the internet especially for the first part of the issue, and i was able to send additional parameter to the action method as explained 
in your documentation but the the additional parameter get send on the first call only, i don't now if is the default behavior.

Any help.

Hi All,

Thanks Telerik for addressing my issues. I am stuck with another problem.

I want to populate the grid with dropdown filters from the model object. 
Currently, my Controller does the Database call and return data is binded to the kendo grid. 
Another call to DB is done as a action from the view page of the grid to populate the dropdown. 
I want to avoid another DB call to populate the drowndown in the grid. It would be ideal to retrieve the data from the model object and populate the dropdown in grid.

Following is my approach.

Controller: 

  public ActionResult AllMessages()
        {
            List<LogModel> logs = this.GetAllMessages();
           
            return View(logs);
        
        }

        public ActionResult FilterMenuCustomization_ReceivePorts(LogModel logsinput)
        {

            List<LogModel> logs = this.GetAllMessages();
            return Json(logs.Select(e => e.ReceivePortName).Distinct(), JsonRequestBehavior.AllowGet);
           
        }

  private List<LogModel> GetAllMessages()
        {
            DataAccess dataAccess = new DataAccess(_LogDBConnectionString);
            DataTable dt = dataAccess.GetAllMessages();
            List<LogModel> outboundMessages = dt.AsEnumerable().ToList().ConvertAll(x => new LogModel
            {
                ReceivePortName = (string)x.ItemArray[0],
                SendPortName = (string)x.ItemArray[1],
                ControlID = (string)x.ItemArray[2],
                SenderID = (string)x.ItemArray[3],
                ReceiverID = (string)x.ItemArray[4],
                loggedDate = (DateTime)x.ItemArray[5],
                LogID = x.ItemArray[7].ToString(),
                ReplayedCount = (int)x.ItemArray[8],
                InterchangeID = x.ItemArray[9].ToString(),
                AckCode = (string)x.ItemArray[10],
                RetryCount = (int)x.ItemArray[11]
            });

            return outboundMessages;
        }

View:

 @using (Html.BeginForm("ReplaySelectedInboundMessages", "Home"))
   {
    <div id="gridContent">
        <h1>All Messages</h1>  
    @(Html.Kendo().Grid<ViaPath.MessageReplay.MvcApp.Models.LogModel>(Model)
    .Name("gridTable")   
    .HtmlAttributes(new {style = "font-family: verdana,arial,sans-serif; font-size: 11px;color: #333333;border-color: #999999;"})   
    
    .Columns(columns => 
        {
          columns.Template(@<text><input class="box"  id="assignChkBx" name="assignChkBx" type="checkbox" value="@item.LogID"/></text>).HeaderTemplate(@<text><input class="selectAll" type="checkbox" id="allBox" onclick="toggleSelection()"/></text>).Width(20);
            //columns.Template(p => { }).ClientTemplate("<input type='checkbox' #= CheckSelect ? checked='checked':'' # class='chkbx' />");
                    
            columns.Bound(p => p.LogID).Template(p => Html.ActionLink(((string)p.LogID), "MessageDetails", new { logid = p.LogID })).Width(200);
            columns.Bound(p => p.ReceivePortName).Width(100).Filterable(ft => ft.UI("ReceivePortsFilter")); 
            columns.Bound(p => p.SendPortName).Width(100);
            columns.Bound(p => p.loggedDate).Format("{0:MM/dd/yyyy hh:mm tt}").Filterable(f => f.UI("DateTimeFilter").Extra(true)).Width(100);
            columns.Bound(p => p.ControlID).Width(100);
            columns.Bound(p => p.SenderID).Width(100);
            columns.Bound(p => p.ReceiverID).Width(100);
            columns.Bound(p => p.InterchangeID).Width(100);
            columns.Bound(p => p.ReplayedCount).Width(100);
            columns.Bound(p => p.RetryCount).Width(100);
            columns.Bound(p => p.AckCode).Width(20);
        })
           // .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
            .Filterable()
            .Pageable(page => page.PageSizes(new int[]{10,25,50,100}).Enabled(true))
            .Sortable()
            .Scrollable(src => src.Height("auto"))
            .Resizable(resize => resize.Columns(true))
           

            )

         <br />
        <br />
        <input type="Submit" name="btnReplayMessage" value="Replay" title="Replay Message" \>
</div>  
      <script type="text/javascript">
          function ReceivePortsFilter(element) {
              element.kendoDropDownList({
                  dataSource: {
                      transport: {
                          read: "@Url.Action("FilterMenuCustomization_ReceivePorts")"
            }
        },
        optionLabel: "--Select Value--"
    });
}
      </script>
       
   }

Hi All,

In ASP.NET MVC application we are using Kendo Grid, the grid is bind to a data model.
We have a Checkbox column and CheckAll check box at the header.

At the initial page load, if I click on CheckAll CheckBox it works fine but after that event the checkall doesnt work. Not sure where I am doing wrong.

 I have seperate javascript file which has toggleSelection() function.

toggleSelection = function() {
    var chk = document.getElementById('allBox').checked;
    $(".box").attr("checked", chk);
}

Following is my .cshtml code for grid.

<body>

    <link href="@Url.Content("~/Content/kendo/kendo.common.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/kendo.default.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/kendo.dataviz.default.min.css")" rel="stylesheet" type="text/css" />

   @using (Html.BeginForm("ReplaySelectedInboundMessages", "Home"))
   {
    <div id="gridContent">
        <h1>All Messages</h1>  
    @(Html.Kendo().Grid<ViaPath.MessageReplay.MvcApp.Models.LogModel>(Model)
    .Name("gridTable")   
    .HtmlAttributes(new {style = "font-family: verdana,arial,sans-serif; font-size: 11px;color: #333333;border-color: #999999;"})   
    .Columns(columns => 
        {
          columns.Template(@<text><input class="box"  id="assignChkBx" name="assignChkBx" type="checkbox" value="@item.LogID"/></text>).HeaderTemplate(@<text><input class="selectAll" type="checkbox" id="allBox" onclick="toggleSelection()"/></text>).Width(20);
           

            columns.Bound(p => p.LogID).Template(p => Html.ActionLink(((string)p.LogID), "MessageDetails", new { logid = p.LogID })).Width(200);
            columns.Bound(p => p.ReceivePortName).Width(100).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
            columns.Bound(p => p.SendPortName).Width(100);
            columns.Bound(p => p.loggedDate).Width(100);
            columns.Bound(p => p.ControlID).Width(100);
            columns.Bound(p => p.SenderID).Width(100);
            columns.Bound(p => p.ReceiverID).Width(100);
            columns.Bound(p => p.InterchangeID).Width(100);
            columns.Bound(p => p.ReplayedCount).Width(100);
            columns.Bound(p => p.RetryCount).Width(100);
            columns.Bound(p => p.AckCode).Width(20);
        })
                                                                  .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
                                                                  .Pageable()
                                                                  .Sortable()
                                                                  .Scrollable(src => src.Height(430))
                                                                  .Resizable(resize => resize.Columns(true))

                                                                  )

         <br />
        <br />
        <input type="Submit" name="btnReplayMessage" value="Replay" title="Replay Message" \>
</div>  
      
       
   }
</body>

I have a ListView which gets json data from the MVC controller action like below:


The returned json has a array "fields".
In the list view I want to create a template which loops through the fields collection and display a list or table in the template like below: 
"fields.name" : "fields.value" 
"fields.name" : "fields.value" 
"fields.name" : "fields.value" 
"fields.name" : "fields.value" 
etc....

Basically I dont know the syntax of how to loop through the fields collection in the template?

The json follows this format:

Using date pickers I need to format as dd-MM-yyyy, but when posting to server I need to post as yyyy-MM-dd
using ajax I can do this using "FromDate": kendo.toString($("#FromDate").data("kendoDatePicker").value(), "yyyy/MM/dd")

but when using the MVC wrappers in a form how can I send to server as yyy-MM-dd?

Thnaks

Hi All,

I have simple ASP.NET MVC web application to fetch data from SQL DB from controller and render it to a web application using Kendo grid.
Performance before we started to use Kendo controls was fine and renders the page quickly. The issue of slow performance started only after we decided to use Kendo grid for sorting and filtering. Even the page without any kendo controls takes more time to load.

Following is the code in our CSHTML page. Any quick help will be greatly appreciated.

    @using (Html.BeginForm("ReplaySelectedInboundMessages", "Home"))
   {
    <div id="gridContent1">
        <h1>All Messages</h1>  
    @(Html.Kendo().Grid<VPath.MessageReplay.MvcApp.Models.LogModel>(Model)
    .Name("grid")  
    .HtmlAttributes(new { style = "height:430px;" })  
    .Columns(columns => 
        {
            columns.Template(@<text><input class="box"  id="assignChkBx"name="assignChkBx" type="checkbox" value="@item.LogID"/></text>).HeaderTemplate(@<text><input type='checkbox' id='allBox' onclick='toggleSelection()'</text>).Width(20);
            columns.Bound(p => p.LogID).Template(p=> Html.ActionLink(((string)p.LogID), "MessageDetails", new { logid = p.LogID})).Width(200);
            columns.Bound(p => p.ReceivePortName).Width(100);
            columns.Bound(p => p.SendPortName).Width(100);
            columns.Bound(p => p.loggedDate).Width(100);
            columns.Bound(p => p.ControlID).Width(100);
            columns.Bound(p => p.SenderID).Width(100);
            columns.Bound(p => p.ReceiverID).Width(100);
            columns.Bound(p => p.InterchangeID).Width(100);
            columns.Bound(p => p.ReplayedCount).Width(100);
            columns.Bound(p => p.RetryCount).Width(100);
            columns.Bound(p => p.AckCode).Width(20);
        })        
        .Filterable()   
        .Pageable()
        .Sortable()
        .Scrollable(src => src.Height(430))        
        .Resizable(resize => resize.Columns(true))
        
        )
         <br />
        <br />
        <input type="Submit" name="btnReplayMessage" value="Replay" title="Replay Message" \>
</div>  
    }

Hi all,

I've tried to create detail template using this link http://demos.telerik.com/aspnet-mvc/grid/detailtemplate
and modified a little so i can add grid inside it, so basically my grid structure look like this :
> Parent Grid
     >Child Grid


but right now, whenever i use editor template, the input column looks weird (i tried with editor template for datepicker)
I was looking for solution everywhere but couldn't found the answer yet :(

and i attached some images about my application.

Hi,

I am not sure there have been threads about this issue before. I could not find anything quickly. I am planning to use Telerik hosted within a standard COTS application by means of an IFrame. I have limited possibilities to change the standard application (because, well it is a bad practice for a COTS application). The browser is IE9 which is a company standard and I am not able to change that too. The problem is that the standard host application forces the browser in Quirks mode and if I change that to standard (strict) mode (e.g. by means of an http header setting X-UA-Compatible to IE=edge) other things breaks for obvious reasons (IFrame height set to "100%" now interpreted as 100 pixels, font resizing issue probably caused by the box model interpretation, etc.).

What is my best option to have Telerik controls working correctly in this scenario? Some things just don't seem to work for no obvious reason even in IE9 strict mode, such as selecting an item from a dropdown list in a custom popup editor in a grid using the MVC Html.DropDownListFor. For example, I can click on an item in the drop-down list but it does not get selected. There might be other issues I might ran into. To get a feeling about whether I will be able to make this scenario work at all I would like to have some advice from Telerik support and others from this forum.

To summarize I have these questions:
1. What are my chances to make the Telerik controls (UI forASP.NET MVC) work together with the standard MVC controls in this scenario?
2. What are some features I should avoid or issues I should be aware of? Are there any workarounds for them?
3. Except from some styling and sizing issues the standard host application seem to work fine. I might be able to fix things there but some references on how to fix things would be great (I am already exploring stackoverflow, quirtksmode.org, MDN, w3fools, etc.). I guess I am looking for something like a cookbook on migrating from quirks to strict mode. Any good pointers would be greatly appreciated.

Thanks in advance for any help.

Marc

After upgrading Kendo UI 2014 Q3 to Kendo UI 2014 Q3 SP1, I found a problem in my project, with visibility of TITLE of Navigation Bar.
Using inspector, I can see the next difference in the generated html code:

After update
<div class="km-view-title km-hide-title">
  <span data-role="view-title">Title</span>
</div>

Before the update
<div class="km-view-title">
   <span data-role="view-title">Title</span>
</div>

The problem is solved applying 'display:block' to 'km-view-title' class, but I am wondering if it's a bug of the new release or if I can set the title visibility using navigation bar settings. 

I can't find in the documentation when 'km-hide-title' style is applied. 

Thank you,
Ina