How to use assign a dynamic .Name property?

2 posts, 0 answers
  1. Chad
    Chad avatar
    29 posts
    Member since:
    Nov 2012

    Posted 18 Dec 2012 Link to this post

    Hello, I am trying to create a reusable control (partial view) utilizing the Kendo UI Autocomplete widget. The issue is that since this new partial I am creating can appear multiple times in a view, how can you pass in or otherwise use a variable as the .Name() attribute in the AutoComplete helper?

    Here is my partial view:
    @using Kendo.Mvc.UI;
    @model IEnumerable<OTIS.AppServ.Shared.ViewModels.ddlOptions>
     
    @(Html.Kendo().AutoComplete()
        .Name("TEST")
        .Filter("startswith")
        .DataTextField("DisplayName")
        .BindTo(Model)
        .Events(e => e
            .Change("autocomplete_change")
        )
        .Placeholder("Select Customer...")
        .HtmlAttributes(new {@class = "filter"}) 
    )
    <input class="filter" id="@ViewBag.ControlId" type="hidden" />
    <script>
        //$("#TEST").attr("id", '@ViewBag.ControlId' + '_org');
     
        function autocomplete_change() {
            var hiddenInput = $('#' + '@ViewBag.ControlId');
            var autoContainer = $("#" + 'TEST').data("kendoAutoComplete");
            var result = $.grep(autoContainer.dataSource.data(),
                                    function (itemInArray, itemIndex) {
                                        return itemInArray.DisplayName == autoContainer.value();
                                    }
                                );
            //alert(result[0].Id)
            hiddenInput.val(result[0].Id);
        }
    </script>

    My controller will handle acquiring the specific data and then passing it to the partial (it needs to take a parameter to populate ViewBag.ControlId, for now it is just hard coded):

    [ChildActionOnly]
            public ActionResult Customers()
            {
                List<ddlOptions> viewModel = new List<ddlOptions>();
                viewModel = _manageDDLsAppServ.GetCustomersDDLViewModel(_currentCompanyId).ToList();
                ViewBag.ControlId = "customerIdFilter";
     
                return PartialView("_ddlOptionsAutoComplete", viewModel);
            }
    I then call this partial from my view like:
    @{ Html.RenderAction("Customers", "ManageDDLs", new { area = "Shared" }); }

     I tried JQuery, to change the name at run time, but this then breaks the Kendo jquery script as it will be looking for the original name.
  2. Chad
    Chad avatar
    29 posts
    Member since:
    Nov 2012

    Posted 18 Dec 2012 Link to this post

    Figured it out. You have to cast the ViewBag variable to a string like so:
    .Name((string)ViewBag.ControlId)
  3. UI for ASP.NET MVC is VS 2017 Ready
Back to Top