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?  
 

I would like to see a full working project with the spreadsheet and MVC, like the many grid examples, however I could not find any in Github. 

Thanks

Hello guys

The main problem is that I need a grid with "popup/batch" editing, but as I know kendo doesn't have such a functionality right now.

So, here we are: "how to convert an asp editor template to a kendo template and then use it inside a popup grid window with all binds"?
If I understand the process correctly:
1) I create an empty model (for example: var customer = new Customer();)
2) I call this one: var wholeHtmlCode = @Html.EditorFor(x => customer)
3) *Magic transformation where I put 'wholeHtmlCode' into kendo template*.
4) When I click "add/edit" button on grid, I open my custom window with template and make "binds".

Thanks in advance

I have a scheduler code like below, but it is not working although it has rendered a drop-down list but no data inside. Any help?

<script id="popup_editor" type="text/x-kendo-template">
    <div class="k-edit-form-container">
        <div class="k-edit-label"><label for="Product">Product</label></div>
        <div id="example" class="k-edit-field" data-container-for="ProductID">
            <input data-role="dropdownlist" data-text-field="Name" data-value-field="Id" data-bind="source: arr" />
        </div>
    </div>
</script>

@(Html.Kendo().Scheduler<KendoUI.Northwind.Dashboard.Controllers.ScheduleTableViewModel>()
    .Name("scheduler")
    .Editable(editable => editable
        .EditRecurringMode(SchedulerEditRecurringMode.Dialog)
    .TemplateId("popup_editor")
    )
    .Selectable(false)
    .Views(views =>
    {
        views.DayView();
        views.WeekView();
        views.WorkWeekView(workWeekView => workWeekView.Selected(true));
        views.MonthView();
        views.AgendaView();
        views.TimelineView();
    })
    .DataSource(d => d
        .Model(m =>
        {
            m.Id(f => f.RecId);
            m.Field(f => f.Title).DefaultValue("No title");
            m.RecurrenceId(f => f.RecurrenceID);
        })
        .Read(read => read.Action("ScheduleTables_Read", "SchedulerMvc"))
        .Create(create => create.Action("ScheduleTables_Create", "SchedulerMvc"))
        .Update(update => update.Action("ScheduleTables_Update", "SchedulerMvc"))
        .Destroy(destroy => destroy.Action("ScheduleTables_Destroy", "SchedulerMvc"))
    )

<script>
    var arr = new kendo.data.ObservableArray([
    { Name: "John Doe", Id: 23 },
    { Name: "Jane Doe", Id: 34 }
    ]);

    var viewModel = kendo.observable({
        arr: arr //Temp solution, eventually will bind to a remote
    });

    kendo.bind($("#popup_editor"), viewModel);
</script>

Hi, May I know how to add additional Textbox field either in or numeric? I able to add a  list using the Resource, but it seems unable to add a textbox.

Thank you.

HI

I known textbox could be placed in HeaderTemplate.

Single TextBox as filter row in each column header
https://www.telerik.com/forums/single-textbox-as-filter-row-in-each-column-header
example
http://dojo.telerik.com/UbeFu

But Navigatable() method causes textbox not focused automatically on click.

How can I solve this kind of problem.

*input/type=checkbox works well but input/type=text not works : 

  .HeaderTemplate("<input type='text' />");

*Telerik DevCraft R2 2017 SP1.

Best regards

Chris

 

 

 

Hello,

I wish to be able to turn off the browser auto complete on the filter options (search and entering values).

Normally I would just add the following to the input but that doesn't appear to be working. We are using the MVC wrappers.

.attr('autocomplete', 'off');

Thank you

Lucy