# jQuery 기반 자동완성의 비추천 및 향후 제거

**URL:** https://meta.discourse.org/t/deprecation-upcoming-removal-of-jquery-based-autocomplete/385527
**Category:** Development
**Tags:** dev-news
**Created:** [10월 14, 2025, 10:04오전 UTC](https://meta.discourse.org/t/deprecation-upcoming-removal-of-jquery-based-autocomplete/385527 "2025-10-14T10:04:36Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![kelv](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/kelv/32/524739_2.png) [@kelv](https://meta.discourse.org/u/kelv)
#### Post date: [10월 14, 2025, 10:04오전 UTC](https://meta.discourse.org/t/deprecation-upcoming-removal-of-jquery-based-autocomplete/385527/1 "2025-10-14T10:04:36Z")

</div>

`$.autocomplete()` 함수를 통해 호출되는 jQuery 기반 자동완성 라이브러리는 이제 Discourse 코어에서 \*\*비추천(deprecated)\*\*되었습니다. 자동완성 기능에 대해 더 나은 성능과 위치 지정 추상화를 제공하는 현대적인 솔루션으로 전환하고 있습니다.

## 마이그레이션 가이드

### 텍스트 영역 자동완성 (예: 멘션, 해시태그, 이모지)

[DEV: floatkit autocomplete for d-editor - Pull Request #33513%EC%97%90%EC%84%9C - discourse/discourse - GitHub](https://github.com/discourse/discourse/pull/33513%EC%97%90%EC%84%9C) 도입된 **`DAutocomplete` 모디파이어** 를 사용하세요.

이 모디파이어는 jQuery 플러그인과 동일한 기능을 제공하지만, Ember의 반응형 시스템 및 FloatKit 위치 지정 라이브러리와 더 잘 통합됩니다.

기타 참고 PR: [DEV: floatkit autocomplete for ai-bot-conversations - Pull Request #34354 - discourse/discourse - GitHub](https://github.com/discourse/discourse/pull/34354)

**기존:**

```javascript
$(textarea).autocomplete({
  key: "@",
  dataSource: (term) => searchUsers(term),
  template: userTemplate,
  transformComplete: (user) => user.username
});

```

**변경 후:**

```javascript
import DAutocompleteModifier from "discourse/modifiers/d-autocomplete";

// 프로그래밍 방식:
DAutocompleteModifier.setupAutocomplete(
  owner,
  textareaElement,
  autocompleteHandler,
  {
    key: "@",
    dataSource: (term) => searchUsers(term),
    template: userTemplate,
    transformComplete: (user) => user.username
  }
);

```

### 입력 필드 자동완성 (예: 그룹/사용자 선택)

[UX: overhaul of GroupSelector with Floatkit - Pull Request #34685%EC%97%90%EC%84%9C - discourse/discourse - GitHub](https://github.com/discourse/discourse/pull/34685%EC%97%90%EC%84%9C) 시연된 **`DMultiSelect` 컴포넌트** 를 사용하세요.

이 컴포넌트는 검색 및 선택 관리를 포함하는 완전한 멀티셀렉트 경험을 제공합니다. 참고 PR의 구현에서는 단일 선택 모드도 지원합니다.

**기존:**

```javascript
$("input.group-selector").autocomplete({
  dataSource: (term) => searchGroups(term),
  template: groupTemplate
});

```

**변경 후:**

```gjs
import DMultiSelect from "discourse/components/d-multi-select";

<DMultiSelect
  @selection={{this.selectedGroups}}
  @loadFn={{this.searchGroups}}
  @onChange={{this.handleChange}}
  @label="Select groups"
>
  <:selection as |group|>
    {{group.name}}
  </:selection>
  <:result as |group|>
    {{group.name}}
  </:result>
</DMultiSelect>

```

jQuery 자동완성을 사용하는 테마나 플러그인을 유지 관리하고 있다면, 새로운 솔루션으로 마이그레이션해 주세요. **2025년 11월 10일** 에 해당 비추천 사항을 제거할 예정입니다.

코드 마이그레이션에 대해 질문이 있다면 아래에 댓글을 남겨 주세요.