ブートストラップタグ入力 - タグ間の追加

Question

私はいくつかの変更を加える必要があるタグ入力フィールドを持っています。 例えば、私が以前にこのフィールドを持っている - >

私は私の矢印キーでバックカーソルを移動し、「テスト」タグを削除 - 私は、その中で再びそれを再入力>

を同じ場所 - >

私は右矢印キーを押して、カーソルをその場所に戻します。私は前の写真に示されているようなフォームを「テスト、フレーズ」というオーダーで提出します。しかし結果は "フレーズ、テスト"として来る。私はそれを編集した順序を保存したいと思います。何がここに間違っているアイデア？

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からretreivedされています。

$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()を使用するときは、追加する位置を指定できます。

これで問題が解決するはずです。