부트 스트랩 태그 입력 - 태그 사이에 추가

Question

일부 입력란을 수정해야하는 입력란이 있습니다. 예를 들어 , 나는 이전에이 필드가 ->

내 화살표 키를 사용하여 커서를 뒤로 이동하고 "테스트"태그 삭제 -이 다시>

그때를 다시 입력합니다 같은 위치 ->

나는 오른쪽 화살표 키를 누르고 커서를 그 위치로 되돌립니다. "test, phrase"라는 순서로 이전 그림과 같은 양식을 제출합니다. 그러나 결과는 "문구, 테스트"로 나타납니다. 나는 그것을 편집 한 순서를 유지하고 싶다. 뭐가 잘못 됐는지 알아?

가되는 HTML 코드 ->

<div class="col-md-8 col-xs-12"> 
    <input type="text" data-role="tagsinput" class="form-control" name="phrases" placeholder="Enter Phrases In Order" value="<?php echo $phrases;?>" required> 
</div> 

PHP는 변수 $ 문구 콤마 분리 형식의 MySQL로부터 입수해온되고있다.

$phrases="test,phrase"; 

정말 많은 코드입니다. 편집 한 후에 주문을 보존하기 만하면됩니다.

Answer 1

이 문제와 관련하여 조사를 해본 결과이 문제를 해결하기 위해 설명서에서 사용자 지정 옵션을 찾을 수 없습니다. bootstrap-tagsinput.js 코드를 약간 수정할 수있는 쉬운 수정 방법을 생각해 냈습니다. 이게 당신을 도울 수 있기를 바랍니다.

self.itemsArray.push(item);

을이로 교체 :

하는 코드 줄을 찾기

self.itemsArray.splice(self.findInputWrapper().index(), 0, item); 

당신은 당신이 태그를 변경 한 후 반환 array을 볼 수있는 console.log($("input").tagsinput('items'));을 할 수 있습니다.

.push()은 array 끝에 값을 추가하지만 .splice()을 사용할 때 추가 할 위치를 지정할 수 있습니다.

이렇게하면 문제가 해결됩니다.