简体   繁体   中英

Kendo autocomplete, how to insert more than one value into dataTextField

I'm trying to insert more than one value into dataTextField attribute after selected item (template works fine but is affecting only what is displayed to the user in dropdown menu). I tried solve id using parse functionl:

schema: {
            parse: function(response) {
                $.each(response, function(idx, elem) {
                    elem.fullName = elem.name + " " + elem.surname;
                });
                return response;
            }
        },

But this is not working.

Is it standalone autocomplete in form not in datagrid.

How can i solve it please?

Thanks for any help.

Here is the code of the whole method:

$scope.$watch("workerDetail.newSuperiorName", function () {
  console.log($scope.workerDetail.superior);
  $scope.customOptionsSuperior = {
    dataSource: {
      type: "json",
      serverFiltering: true,
      transport: {
        read: function (options) {
          console.log("List");
          console.log(options.data);
          console.log(options.data.filter.filters[0].value);
          requestParams = {
            "entityName": "worker",
            "data": {
              "page": 1,
              "pageSize": 20,
              "filter": {
                "logic": "or",
                "filters": [
                  {
                    "value": $scope.workerDetail.newSuperiorName,
                    "operator": "contains",
                    "field": "name",
                    "ignoreCase": true
                  },
                  {
                    "value": $scope.workerDetail.newSuperiorName,
                    "operator": "contains",
                    "field": "surname",
                    "ignoreCase": true
                  }
                ]
              },
              "sort": [
                {
                  "field": "name",
                  "dir": "asc"
                }
              ]
            }
          };
          ApiService.doHttpRequest(
            "POST",
            $rootScope.apiBaseUrl + "worker/search",
            requestParams
          )
            .success(function (data, status, headers, config) {
              // successful data retrieval
              console.log("request success, checking state");
              console.log(data);
              // sent status to global HTTP status service
              var jsonResponse = ApiService.processReturnedHttpState(status);
              console.log("Status response is " + jsonResponse.result);
              // do something with data
              switch (jsonResponse.result) {
                case true:
                  if (data.results == null) {
                    growlNotifications.add($translate.instant('NO_ITEM_FOUND'), 'error', $rootScope.notificationLifetime);
                    options.success([]);
                  } else {
                    options.success(data.results);
                  }
                  break;
                case false:
                  growlNotifications.add($translate.instant('LIST_LOADING_ERROR'), 'error', $rootScope.notificationLifetime);
                  break;
              }
            })
            .error(function (data, status, headers, config) {
              console.log("Error");
              console.log("Autocomplete loading error");
              growlNotifications.add($translate.instant('AUTOCOMPLETE_ERROR'), 'error', $rootScope.notificationLifetime);
            });
        }
      }
    },
    schema: {
        parse: function(response) {
            $.each(response, function(idx, elem) {
                elem.fullName = elem.name + " " + elem.surname;
            });
            return response;
        }
    },
    dataTextField: "fullName",
    // using  templates:
    template: '#: data.name # #: data.surname #',
    change: function (option, data) {
      console.log("change");
      console.log(this.value());
    },
    // event triggered after selection of the item from autocomplete
    select: function (e) {
      console.log("select");
      var item = e.item;
      var text = item.text();
      var index = item.index();
      var dataItem = this.dataItem(index);
      $scope.workerDetail.superior = dataItem;

    }
  };
});

Your parsing idea should work, but your schema definition is outside of the datasource. If you drop it inside the datasource it should work no problem.

dataSource: { 
   ...
   schema: {
       ...
   }
}

Here's a working example:

http://dojo.telerik.com/eWapI/2

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM