PUT method and payload with devbridge Jquery Autocomplete Plugin

Question

I'm using the devbridge autocomplete plugin for JQuery.

So far I'm able to call my Rest API and get some results. My Rest Api accepts a query using the PUT methode. But basically I need to pass the value of my textfield (customer) in the query.

Basically I need to update the value of the data payload everytime the value changes. But $( "#customer" ).val() is empty when I trace it the developer console.

I think I dont use it in the correct way. The service shoudl return all results and then it's filtered in the earch box. But for some reasons when I type something in the search box its not filtered. I have all the results in the list box.

I tried the following code but it doesnt work.

<script>
$(document).ready(function() {
    $( "#customer" ).devbridgeAutocomplete({
            serviceUrl: 'http://localhost:8080/services/rest/data/Customer/query',
            type: 'PUT',
            dataType: 'text',
            ajaxSettings: {
                'data': '{"select": {"from": ["Customer"],"where": {"full_text": [{"value": "'+$( "#customer" ).val()+'"}]}}}',
                'contentType': 'application/json',
                headers: {
                    'Authorization': 'Basic YXXtXX5pcXXyYXRvXXphZG1pbmlzdHJhdG9y'
                },
            },
            transformResult: function(response) {
                var responseObj = jQuery.parseJSON( response );

                return { suggestions: $.map(responseObj, function(data) {
                    return { value: data.customer.fullname, data: data.customer.mdmcustid };
                })};
            },
            onSelect: function (suggestion) {
                console.log('You selected: ' + suggestion.value + ', ' + suggestion.data);
            },
            onSearchStart: function (query) {
                console.log('Search terms: ' + $( "#customer" ).val());
            }
    });
});
</script>

Can you tell me how to fix this ?

Thank you very much

Answer 1

it's working using a custom lookup but I dont know if it's the best method.

lookup: function (query, done) {
            $.ajax({
                type: "PUT",
                url: "http://localhost:8080/talendmdm/services/rest/data/Customer/query",
                contentType: "application/json",
                data: '{"select": {"from": ["Customer"],"where": {"full_text": [{"value": "'+$( "#customer" ).val()+'"}]}}}',
                dataType: "text",
                headers: {
                    'Authorization': 'Basic YWRtaW5pc3RyYXRvcjphZG1pbmlzdHJhdG9y'
                },
                success: function (res) {
                    var suggestionObj = { suggestions: $.map(jQuery.parseJSON( res ), function(data) {
                        return { value: data.customer.fullname, data: data.customer.mdmcustid };
                    })};

                    done(suggestionObj);
                },
                error: function (xhr, status, error) {
                    console.log( 'Query KO' );
                }
            });
        },
        onSelect: function (suggestion) {
            console.log('You selected: ' + suggestion.value + ', ' + suggestion.data);
        }