kendoAutoComplete: change remote url

[RobMarz]

I'm using a multiSelect and trying to append a query string ("?str=SOMETHING") to the URL for each call to the server.

I'm writing this:

var viewModel = kendo.observable( {
    attributesForMulti: new kendo.data.DataSource( {
            serverFiltering: true,
            transport: {
                read: {
                    url: "/manager/ajax/attributes",
                    data: {
                        str: function() {
                            var element = $( "#product-important-attributes" );
                            var multi = element.data( "kendoMultiSelect" );
                            // multi.value() is undefined
                            return multi.value();
                        },
                    },
                },
                parameterMap: function( data, type ) {
                    if ( type === "read" ) {
                        return { "str": data.str() };
                    }
                }
            },
            schema: {
                data: function( xhr ) {
                    return xhr.data;
                }
            },
        } );

} )

 

HTML:

<select id="product-important-attributes" 
data-placeholder="-- Seleziona gli attributi"
data-role="multiselect" 
data-bind="source: attributesForMulti, value: product.importantAttributes" 
data-value-field="id"
data-text-field="name">
</select>

The problem is that I can't get the string  "color" in widget, to pass it in query string:

var multi = element.data( "kendoMultiSelect" );
 multi.value();

multi.value() iIt's always undefined.

This code works perfectly with "kendoAutoComplete," but I can't use it because it needs to select more than one value in the select widget.

Any ideas?

Many thanks

 

 

[Neli]

Hi Roberto,

From the provided image, the item color seems as it is not selected, but it is a search value. Is this correct? Note that in order the value() method to return the ID of the item, the item should be selected and set as the value of the component. If you need to retrieve and send the entered text in the input, you can use 'multi.input.val()'.

If you select an item in the MultiSelect and then start to filter again, the selected value will be sent to the server.

Here you will find a small Dojo example based on the provided snippet, where the selected value and the text of the input are sent when filtering - https://dojo.telerik.com/djqEyYlt.

Please review the example and let me know in case you have any additional questions on the matter.  

Regards,
Neli
Progress Telerik

[RobMarz]

Great Neli!

The solution is:

multi.input.val()

Thanks a lot 😄

[Neli]

Hi Roberto,

I'm glad to hear that the provided suggestion was helpful in resolving the issue for you. Thank you very much for the feedback.

Feel free to reach out in case any issue arises.

Regards,

Neli