How to force Reload of Combobox in Grid

4 posts, 1 answers
  1. Malcolm
    Malcolm avatar
    29 posts
    Member since:
    Oct 2011

    Posted 28 Jul 2014 Link to this post

    Dear Telerik Team!
    I would really like to know how to make an ajax-bound combobox reload its items with a given filter value. In the attached example I've got a editortemplate for Country1

    @(Html.Kendo().ComboBoxFor(m => m)
                .DataTextField("DisplayName")
                .DataValueField("Code")
                .AutoBind(true)
                .DataSource(ds => ds
                    .Read(read => read.Action("CountryLoading", "Home"))
                    .ServerFiltering(true)
                )
            )

    When the Combobox gets focus, i want to reload it. I tried all this:

    function CommidityFocus(e, upperE, elementName) {
        var combobox = $(elementName).find('span').children('input').data('kendoComboBox');
        Combobox.value("hurz"); // No Reload ?!
        combobox.search("hurz"); // No Reload ?!
        combobox.dataSource.read(); // No Reload ?!
    }

    but ... nothing happens. The CountryLoading function is not called...
    How can I make it reload ?

    brgds
    Malcolm Howlett
  2. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 30 Jul 2014 Link to this post

    Hi Malcolm,

    I was not able to run the provided project due to a compilation errors.

    In case serverFiltering is enabled the search method will issue an Ajax request through the read transport to the server. Please make sure that the `combobox` variable holds a reference to the client side widget's object. Do you see any JavaScript errors in the browser's console that might give us a clue what exactly is going wrong?

    Regards,
    Alexander Valchev
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Malcolm
    Malcolm avatar
    29 posts
    Member since:
    Oct 2011

    Posted 01 Aug 2014 in reply to Alexander Valchev Link to this post

    Hello Alexander
    There is no javascript error and the 'combobox' object is filled. I attached a screenshot.
    The compilation errors are probably due to limitations of upload size. Can you please fix them? You should find everything you need in the EnumerationEditing example provided by telerik. (Your colleague achieved to do this a few months ago and so found a localization bug)

    BTW: Why does the initial call to the data-function (CountryLoading) not use the given value of the field edited with the combobox.

    brgds
    Malcolm
  5. Answer
    Daniel
    Admin
    Daniel avatar
    2117 posts

    Posted 05 Aug 2014 Link to this post

    Hello Malcolm,

    If there are not any JavaScript errors then the most likely reason for the action method not be called when calling read is that the result is loaded from the browser cache. Please check if adding the OutputCache attribute to the action method result:
    [OutputCache(NoStore = true, Duration = 0, VaryByParam = "*")]
    public JsonResult CountryLoading(string text)
    resolves the problem. 

    As for the project, I ran it but I am not sure if I understand correctly how should the value be passed. Should it be passed as "text"? If yes, then you can pass it with the read method:
    combobox.dataSource.read({
        text: "hurz"
    });
    or just call the read method:
    combobox.dataSource.read();
    and pass the value with the request data function:
    <script type="text/javascript">
        function additionalData() {
            return {
                text: "hurz"
            };
        }
    </script>
    @(Html.Kendo().ComboBoxFor(m => m)
        .DataTextField("DisplayName")
        .DataValueField("Code")
        .AutoBind(true)
        .DataSource(ds => ds
            .Read(read => read.Action("CountryLoading", "Home").Data("additionalData"))
            .ServerFiltering(true)
        )
    )

    The search method can also be used to trigger a request but you need to set the filter type:
    Html.Kendo().ComboBoxFor(m => m)
        .Filter(FilterType.StartsWith)
    In this case however, the value will be sent as a dataSource filter and not as "text".

    As for the initial request - the combobox will pass the text parameter to the server only when the widget is filtered by typing in the text input. If you wish to send the initial value then you can use the data function to get the value from the grid and add it to the request data.

    Regards,
    Daniel
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top
UI for ASP.NET MVC is VS 2017 Ready