Question

我有一个标准的jQuery kendo ui自动完成功能，足以启动：

    let querCo = [];
    ...........
    $.each(lRsp, function(i, value) {
         querCo.push(value[id]);
    });

   $("#agent").kendoAutoComplete({
        dataSource: querCo,
        serverFiltering: true, // this was also an attempt
        select: function(e) {
                let item = e.item;
                text = item.text();
                // console.log(text);
        }
    });

一切正常，除了尝试更新时...例如，我有一个删除按钮，目的是删除所选项目；我很好地选择了项目，并在querCo更新了数组，然后从数组中删除了该项目。但是自动完成功能仍然可以显示它。...

 $('#del').click(function(){
    let val = text;
    querCo = $.grep(querCo, function(value) {
      return value != val;
  });
  console.log(querCo); // correct, outputs updated array

然后我尝试了以下两种方法；似乎什么也没做...原始数组，可惜已删除的项目仍显示为自动完成？

尝试1

$("#agent").data("kendoAutoComplete").dataSource.read();

尝试2

$("#agent").data("kendoAutoComplete").refresh();

Answer 1

我相信您要使用的方法是setDataSource来替换自动完成绑定到的dataSource：

@Data
@EqualsAndHashCode(callSuper = true)
@Entity
@Table(name = "group_entity")
public class GroupEntity extends BaseEntity {

   @Id
   @Column(name = "id", unique = true)
   private String id;
}

@Data
@EqualsAndHashCode(callSuper = true)
@Entity
@Table(name = "single_entity")
public class SingleEntity extends BaseEntity {

   @Id
   @Column(name = "id", unique = true)
   private String id;
}

@Data
@EqualsAndHashCode(callSuper = true)
@MappedSuperclass
public class BaseEntity {

   @OneToMany(fetch = FetchType.EAGER)
   @Fetch(FetchMode.SUBSELECT)
   @JoinColumn(name = "entity_id", referencedColumnName = "id")
   private List<Association> associations;
}

@Data
@Entity
@Table(name = "Association")
public class Association implements Serializable {
 
  @Column(name = "entity_type")
  private String entityType;

  @Column(name = "entity_id")
  private String entityId;

  @Column(name = "relationship")
  private String relationship;
}


public interface EntityRepository extends JpaRepository<GroupEntity, String>, QuerydslPredicateExecutor<GroupEntity> {}

https://docs.telerik.com/kendo-ui/api/javascript/ui/autocomplete/methods/setdatasource

Answer 2

您也可以尝试使用data方法设置新数据：

{ 
    "notfortabulator" : { "row2color": "orange" },
    "fortabulator" : [
        { "field":"fieldName","width":63,"visible":false }
    ],
}

$("#agent").data("kendoAutoComplete").dataSource.data(querCo);

Dojo

使用数组更改更新/刷新kendo ui自动完成

2 个答案: