When using RowTemplate, the html output contains empty rows (see attachments, marked items in yellow) which I can't find the option to no render them.

Grid:

@(Html.Kendo().Grid<ePower.Mvc.Areas.PM.Models.ObjectiveListData>(Model.Data)
.Name("ObjectiveListView")
.Columns(columns =>
{
columns.Bound(c => c.Item1).Visible(Model.Item1Used).Title(Model.Item1Header);
columns.Bound(c => c.Item2).Visible(Model.Item2Used).Title(Model.Item2Header);
columns.Bound(c => c.Employees).Title(EPower.Utils.Web.Configuration.WebSettings.Settings.LabelManager.GetString("PM_TeamObjective_ObjectiveListView_EmployeeHeader"));
columns.Bound(c => c.Item4).Visible(Model.Item4Used).Title(Model.Item4Header);
})
.RowTemplate(template =>
@<text>
<tr>
@if (Model.Item1Used)
{
<td>@item.Item1</td>
}
@if (Model.Item2Used)
{
<td>
<div class="item2">@item.Item2</div>
<div class="item3">@item.Item3</div>
</td>
}
<td>@Html.Raw(item.Employees)</td>
@if (Model.Item4Used)
{
<td>@item.Item4</td>
}
</tr>
</text>)
.NoRecords(EPower.Utils.Web.Configuration.WebSettings.Settings.LabelManager.GetString("PM_TeamObjective_ObjectiveListView_NoResult"))
)

 

How to force the grid item into a single line stop text from wrapping ?

+ ---------------------------------------------------------+
|  column 1 | column 2 |  column 3
+ ---------------------------------------------------------+

|  data 1     | data 2 .... |  data 3
+ ---------------------------------------------------------+

instead of:

+ -------------------------------------------+
| column 1 |column n | column 3
+ -------------------------------------------+

|  data 1     | data 2  t|  data 3

|                 | testing  | 
+ ---------------------------------------------------------+

Please see the screenshot

I am currently refreshing the grid every 3 seconds on my page using the Javascript SetInterval function.  The grid is then reloading and displaying accurate information.  However, while the load is happening the grid flashes and looks disabled, then when the function returns it appears enabled again.   This is happening every three seconds so the grid is constantly flashing enabled/disabled.   Is there any way to override this functionality or CSS is can change? 

 

      setInterval(function () {
            var grid = $("#statistics").data("kendoGrid");
            if (grid != null) {
                grid.dataSource.read();
            }
        }, 3000);

 

 

Hello!

I have posted the question before and I thought that I managed to fix the issue but it turns out that I made a mistake. I contacted the support but we still haven't figured out how to fix the problem. I also think that it is pretty hard to understand the issue so I am posting it here and I hope that someone will be able to help.

Basically I have 2 grids on one screen. One shows the Positions in a company, the other shows the staff and their positions. So far so good. The staff grid has a foreign key to the positions table because you know these positions change and they can be updated, so our staff model only holds an id of the specific position. Both Grids are on the same screen and are ajax bound. I have a mechanism that refreshes both grids if there is a change. (dataSource.read() does the trick). I have attached scheme.

I do not want to refresh the screen. I saw from a demo in the docs that when I have a foreign key to some table the Grid uses ViewData to pass the values and map them to their specific Ids. A problem occurs when I edit the Position name in the first grid (the positions grid) and try to refresh the second one (the staff grid). As the staff grid holds only the id of the postion and as we cannot update the ViewData without refreshing the screen, the value remains the same even after I refresh the staff grid. I can edit the staff and change their positions but if I edit the grid from the positions grid, the changes are not visible in the staff gird without refreshing.

 

I have popup edit mode enabled with custom editor for the staff gird and there is a drop down for the foreign key column (postion name) which is beign updated when I refresh the grid and thats fine (it is bound to ajax so we don't have problem here). We need the foreign key columns Ajax bound, not ViewData bound. Of course I could edit my model and add a extra field to hold my Position title and pass it to the screen and use it instead of foreign key but that's not the idea.

 

I repeat:

• I don't want to refresh the page.
• I have attached a scheme.

 

Here is some source code that I use:

View (only the staff grid, that's what's important):

 

Controller(the index method that fills the ViewData):

 

Hope I explained it good enough and someone could help me.

Kind Regards,
Kaloyan Manev

We have a Telerik UI for MVC grid in a partial view. When we attempt to drag a column header to use as a group, it appears offset from the mouse cursor by quite a lot.  I am assuming that it has something to do with the DIV we have as a header and whatever the offset is normally set for the dragged control.

So really my question is not so much why it happens, but where (and how) I can go about fixing the problem.

If there is a specific CSS or JS file we should be looking in to modify this behavior, please let me know.

TIA,

Mark

Hello,

 

I stumbled onto some behaviour that I think is wrong, but am not sure. In this dojo: https://dojo.telerik.com/eyOJA I have created a small snippet that displays the week number of 31.12.2017. That comes up as 1. I was expecting, depending on the culture, maybe an answer of 52 or 53, but certainly not 1. Am I missing something or is there a bug in the weekInYear?

Hey! i am using telerik listview Template for asp.net MVC i want to filter data from server side i.e i enter data in textbox send to action method and filter data and than pass to again view and bind data to listview initially my listview working perfect all data come through database here is my Code

<script type="text/x-kendo-tmpl" id="template">
    <div class="col-md-8  jumbotron">
        <div class="col-sm-4">
            <span><b>Name:</b></span><br />
            <span><b>Gender:</b></span><br />
            <span><b>DOB:</b></span><br />
            <span><b>Country:</b></span><br />
            <span><b>Province:</b></span><br />
            <span><b>Interset:</b></span><br />
        </div>
        <img img src="#:Image#" width="100" height="100" />
        <div class="col-sm-4">
            <span>#:FirstName#</span><br />
            <span>#:Gender#</span><br />
            <span>#:DOB#</span><br />
            <span>#:CountryName#</span><br />
            <span>#:ProvinceName#</span><br />
            <span>#:Interset#</span><br />
        </div>
    </div>
</script>

<div class="demo-section k-content wide">
    @(Html.Kendo().ListView<Assignment.Models.StudentViewModel>()
                .Name("ListView")
                .TagName("div")
                .ClientTemplateId("template")
                .DataSource(dataSource => dataSource
                .ServerOperation(true)
                .Read(read => read.Action("Get", "Home")
                )
                )
    )
</div>

// here im getting data from server for first load using store procedure now i need to filter data from server side in action method 

public JsonResult Get([DataSourceRequest] DataSourceRequest request)
        {
            var studentData = db.sp_GetStudentData().Select(list => new StudentViewModel
            {
                FirstName = list.FirstName,
                Gender = list.Gender,
                DOB = list.DOB.Value.ToShortDateString(),
                Image = list.Image,
                CountryName = list.Name,
                ProvinceName = list.ProvinceName,
                Interset = list.Interset
            }).ToList();
            return Json(studentData.ToDataSourceResult(request));
        }

I've got the tooltip showing on click, but I cannot access any of the variables from my datasource read method in the template. I either get undefined, or errors when trying different combinations with the template. 

 

<script id="Map_Tooltip_Template" type="text/x-kendo-template">
        <p>#=latlng#</p>
</script>

Hi,

 

I am trying to work out how I can disable nodes in a TreeView based on whether the node is checked. For some reason I'm not able to retrieve the TreeView as such I am unable to iterate through the nodes and get the ones that are checked.

Here is my code:

Controller

public class HomeController : Controller
    {
        CalendarEventsEntities2 db = new CalendarEventsEntities2();
        
        private SchedulerMeetingService meetingService;

        public ActionResult SideNavMenu()
        {
            return View();
        }

     

}

View

<div class="demo-section k-content">
    @(Html.Kendo().TreeView()
        .Name("treeview")
        .DataTextField("Name")
        .DataUrlField("LinkURL")
        .Checkboxes(true)
       .HighlightPath(true)
        .DataSource(dataSource => dataSource
            .Read(read => read
                .Action("Menu", "Home")
                
            )
        
        )
    )
</div>
<script>
        $(document).ready(function() {

            
            var treeView = $("#treeview").data("kendoTreeView");
            var nodes = treeView.dataSource.view();
          
          for (var i = 0; i < nodes.length; i++) {
              alert('uuu');
            var node = nodes[i];

            //sets the parent node check property to true
            node.set("checked",true);


            if (node.checked) {
                

              if (node.hasChildren){

                var children = node.loaded() && node.children.data();

                for (var i = 0; i < children.length; i++) {

                  node.children.at(i).set("enabled", false);

                }

              } else {

                if (node.hasChildren) {

                  for (var i = 0; i < node.children.length; i++) {

                    node.children.at(i).set("enabled", true);

                  }
                }

              }

            }

          };

        });

</script>

We have a page that uses the Kendo Grid along with Kendo DropDownLists. The page has a strongly typed model of type ImportModel.  We are trying to POST the entire page at one time.  We were able to get it working but it only works in IE.  Is there a better way to do this?
 
ImportModel looks like the following:
        public string Country { get; set; }                                       //loaded from Kendo DropDownList
        public string Language { get; set; }                                      //loaded from Kendo DropDownList
       public IEnumerable<ImportModel.ImportItem> gridItems { get; set; }        //this is always NULL in Chrome and Firefox once the grid is POSTed
 
ImportItem is defined as:
        public class ImportItem
        {
            public bool Enabled { get; set; }
           
            [Required(ErrorMessage = "Site ID is required")]
            public string SiteId { get; set; }
            [Required(ErrorMessage = "User Name is required")]
            public string UserName { get; set; }
            public string UserPhone { get; set; }
            [Required(ErrorMessage = "User Email is required")]
            public string UserEmail { get; set; }
                }
 
The grid:
                        @(Html.Kendo().Grid<ImportModel.ImportItem>()
                        .Name("importgrid")
                        .ToolBar(toolbar =>
                        {
                            toolbar.Create();
                        })
                           .Columns(columns =>
                           {
                               columns.Bound(item => item.SiteId).Width(220).Title("Site ID").Encoded(true).ClientTemplate("#= SiteId #" +
                                        "<input type='hidden' name='gridItems[#= index(data) #].SiteId' value='#= SiteId #' />");
                               columns.Bound(item => item.UserName).Title("User Name").Encoded(true).ClientTemplate("#= UserName #" +
                                        "<input type='hidden' name='gridItems[#= index(data) #].UserName' value='#= UserName #' />");
                               columns.Bound(item => item.UserPhone).Title("User Phone").Encoded(true).ClientTemplate("#= UserPhone #" +
                                        "<input type='hidden' name='gridItems[#= index(data) #].UserPhone' value='#= UserPhone #' />");
                               columns.Bound(item => item.UserEmail).Title("User Email").Encoded(true).ClientTemplate("#= UserEmail #" +
                                        "<input type='hidden' name='gridItems[#= index(data) #].UserEmail' value='#= UserEmail #' />");
 
                           })
                                    .Editable(editing => editing.Mode(GridEditMode.InCell))
                                    .Pageable(pager => pager.Refresh(true))
                                    .Navigatable
                                    .DataSource(datasource => datasource
                                        .Ajax()
                                                .Batch(true)
                                                .Read(read => read.Action("GetImportData", "Provisioning"))
                                                .PageSize(100)
                                                .Model(model => model.Id(p => p.BridgeId))
                                    )
                                   )
 
Below the grid there are standard Kendo DropDownList controls.
 
The form is defined as:
@using (Html.BeginForm("ProvisioningPost", "Provisioning", FormMethod.Post, new { enctype = "multipart/form-data" }))
 
The controller method is defined as:
[HttpPost]              
public ActionResult ProvisioningPost(string btnSubmit, string btnUploadData, ProvisioningImportModel provisioningImportModel, ProvisioningModel.ImportItem[] gridItems)
 
gridItems is always NULL for Chrome and Firefox.  With IE the data is passed in.  What is the best method to POST the entire form to the controller?