I am apparently missing something in setting up a combo box, can someone help me out?

I followed the examples, and got to here:

------

        public JsonResult GetItems(string filter)
        {
            List<Item> Items = new List<Item>();
            if (!string.IsNullOrEmpty(filter))
                using (ScratchDBClassesDataContext DB = new ScratchDBClassesDataContext())
                    Items = DB.Items.Where(itm => itm.Name.Contains(filter)).ToList();
            return Json(Items, JsonRequestBehavior.AllowGet);
        }

------

@(Html.Kendo().ComboBox()
        .Name("ItemCombo")
        .DataSource(ds =>
        {
            ds.Read(read =>
            {
                read.Action("GetItems", "Home").Data("FilterValue");
            });
            ds.ServerFiltering(true);
        })
        .DataTextField("Name")
        .DataValueField("ItemID")
        .AutoBind(false)
        .MinLength(3)
        .ClearButton(true)

)
<script>
    function FilterValue() {       
        var ItemCombo = $("#ItemCombo").data("kendoComboBox");
        return { filter: ItemCombo.text() };
    }
</script>

------

It works initially - once I type 3 characters, the read action runs and my initial results are shown in the popup.  However, after that, the read action never fires again when I continue typing, so the box never further filters my results. 

I put a breakpoint in my controller code as well as an alert in the "FilterValue" function, and I can confirm that the action is not firing.

I discovered that if I add ".Filter(FilterType.Contains)" to the combobox configuration, the action fires every time I type after the 3rd character but my controller receives a null value for the filter string. An alert in "FilterValue" shows that ItemCombo.text() has the value I want, but it isn't being sent to the controller.

What have I missed here?

Hello

I had a look at the ComboBox demo and saw that there is no add new item feature for the MVC version. Is there any way to accomplish adding a new item to the database in MVC with the ComboBox?

I tried creating an API in MVC and using the Kendo UI for jQuery version but that only stores in localstorage and does not add to the database either.

If anybody knows of a way to add a new item to the database from the ComboBox in MVC could you please shed some light on how to accomplish that. Code first would be preferred if possible.

Thank You

Hi there,

I'm experiencing issues with the media player; it's breaking when used at low-resolutions such as on a mobile. I'm embedding YouTube, for what it's worth.

By way of sample code, the example on https://demos.telerik.com/aspnet-mvc/mediaplayer exhibits the same issue. When under ~970 pixels in width, the Media player refuses to render, and the JavaScript console outputs and error, both in Chrome and Edge (attachments 1 and 2).

When resized a couple of hundred pixels larger, the player immediately renders [after a refresh] and the JavaScript error goes away.

Any assistance in getting this working at lower resolutions would be much appreciated.

Hi ,

i am in learning phase of asp.net mvc charts. i am able to see data in controller but it is not displayed in view. can you please help. thanks in advance

controller code

 [HttpPost]
        public ActionResult DisplayChart([DataSourceRequest]DataSourceRequest request, string item)
        {
            var result = Enumerable.Range(0, 50).Select(i => new Chart
            {
                bytes = i.ToString(),
                OS = "Android" + i.ToString(),
                protocol = "SMTP" + i.ToString(),
                Device = i.ToString(),
                IP = "10.97.216." + i.ToString(),
                Location = "Location" + i.ToString(),
                Network = "Telstra " + i,
                VLAN = "VLAN " + i.ToString(),
                ChartNumber1 = 10 + i,
                ChartNumber2 = 20 + i.ToString(),
                ChartNumber3 = 30 + i,
                Year = "201"+ i.ToString()
            });

            if (item != null)
            {
                var children = result
                    .Where(p => p.Location == item)
                    .ToList();

                return Json(children.ToDataSourceResult(request));
            }
            else
            {
                var children = result
                    .ToList();

                return Json(children.ToDataSourceResult(request));
            }
        }

and cshtml code is 

<div class="row">
            <div class="col-xs-18 col-md-12">
                <div class="demo-section k-content wide">
                    @(Html.Kendo().Chart<TelerikMvcApp1.Models.Chart>()
                            .Name("chart2")
                            .Title(" Sample Chart")
                            .Legend(legend => legend
                                .Position(ChartLegendPosition.Top)
                            )
                            .ChartArea(chartArea => chartArea
                                .Background("transparent")
                            )
                            .DataSource(ds => ds.Read(read => read.Action("DisplayChart", "Chart")))
                            .Series(series =>
                            {

                                series.Column(model => model.ChartNumber1).Name("ChartNumber1").CategoryField("Year");
                                series.Column(model => model.ChartNumber2).Name("ChartNumber2").CategoryField("Year");
                                series.Column(model => model.ChartNumber3).Name("ChartNumber3").CategoryField("Year");
                            })
                              .CategoryAxis(axis => axis
                              .Categories(model => model.Year)
                              )
                              .AutoBind(true)
                            .ValueAxis(axis => axis.Numeric()
                            .Labels(labels => labels.Format("{0:N0}"))
                            .MajorUnit(10)
                            )
                            .Tooltip(tooltip => tooltip
                                .Visible(true)
                                .Template("#= series.name #: #= value #")
                            )
                            .Events(events => events
                            .SeriesClick("onSeriesClick")
                            .SeriesHover("onSeriesHover")
                            .DataBound("onDataBound")
                            .AxisLabelClick("onAxisLabelClick")
                            .PlotAreaClick("onPlotAreaClick")
                            .PlotAreaHover("onPlotAreaHover")
                            .Render("onRender")
                            .LegendItemClick("onLegendItemClick")
                            .LegendItemHover("onLegendItemHover")
                            .DragStart("onDragStart")
                            .Drag("onDrag")
                            .DragEnd("onDragEnd")
                            .ZoomStart("onZoomStart")
                            .Zoom("onZoom")
                            .ZoomEnd("onZoomEnd")
                              )
                    )
                </div>
            </div>
        </div>

<script>
    function onSeriesClick(e) {
        console.log(kendo.format("Series click :: {0} ({1}): {2}",
            e.series.name, e.category, e.value));
    }

    function onSeriesHover(e) {
        console.log(kendo.format("Series hover :: {0} ({1}): {2}",
            e.series.name, e.category, e.value));
    }

    function onDataBound(e) {
        console.log("Data bound");
    }

    function onAxisLabelClick(e) {
        console.log(kendo.format("Axis label click :: {0} axis : {1}",
            e.axis.type, e.text));
    }

    function onPlotAreaClick(e) {
        console.log(kendo.format("Plot area click :: {0} : {1:N0}",
            e.category, e.value
        ));
    }

    function onPlotAreaHover(e) {
        console.log(kendo.format("Plot area hover :: {0} : {1:N0}",
            e.category, e.value
        ));
    }

    function onRender(e) {
        console.log("Render");
    }

    function onLegendItemClick(e) {
        console.log(kendo.format("Legend item click :: {0}",
            e.text));
    }

    function onLegendItemHover(e) {
        console.log(kendo.format("Legend item hover :: {0}",
            e.text));
    }

    function onDragStart(e) {
        console.log("Drag start");
    }

    function onDrag(e) {
        console.log("Drag");
    }

    function onDragEnd(e) {
        console.log("Drag end");
    }

    function onZoomStart(e) {
        console.log("Zoom start");
    }

    function onZoom(e) {
        console.log(kendo.format("Zoom :: {0}", e.delta));

        // Prevent scrolling
        e.originalEvent.preventDefault();
    }

    function onZoomEnd(e) {
        console.log("Zoom end");
    }

    //$(function () {
    //    $(document).bind("kendo:skinChange", updateTheme);
    //});

    //function updateTheme() {
    //    $("#chart2").getKendoChart().setOptions({ theme: kendoTheme });
    //}
</script>

   is there a way to use the grid hierarchy to edit nested collections when you need the database generated ID to apply to the nested collection?  I have the grids and controllers set up, but i don't know how to send the ID to the nested collection.

cshtml

parent grid read and create controller

child grid read and create controller

I feel like i'm close but can't quite get it working

Hi

I'm try to get data from an external Api (different domain), how can i send an Authentication token with my request   

e.g

.DataSource(dataSource => dataSource

                 );      

      })}

))

Situation - 

I have a grid, which is set to use a popup editor.  Here's the relevant .editable section from the grid:

I'm trying to change two of the fields in the popup editor from text boxes to rich editors.  Everything seems to work fine in Chrome, but not in Internet Explorer.

In IE, once either of the editors receives focus, it has to lose it before the built-in "Update" button works.

if I focus one of the editors and enter some text, clicking the window's "Update" button doesn't work - I get a flash, the page scrolls a bit, but it doesn't submit (no fiddler calls to the back end).  Pushing the "Update" button again submits the data as expected (because the editor no longer has focus?).  

If I edit the field then leave the editor (tab out, click another field, etc.), the "Update" button works fine first click. 

If I never enter one of the editors, the "Update button works first click.

Hopefully someone has an idea for me?  Company standards require both Chrome and IE functionality, or I'd just tell the user "Use Chrome!".

Here's the Popup Editor Template in question: