2016-06-25 8 views
0

私はブートストラップとjquery tag managerを使用しています。入力フィールドとの相対的なタグの配置場所を制御する方法はありますか?たとえば、以下のようにタグをテキストボックスの上に配置します。ブートストラップフォームグループとjqueryタグマネージャー:入力ボックスの下の位置タグ?

<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tagmanager/3.0.2/tagmanager.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/tagmanager/3.0.2/tagmanager.min.js"></script> 
 
</head> 
 

 
<div class="form"> 
 
    <div class="form-group col-xs-6"> 
 
    <label>Tags</label> 
 
    <input type="text" name="tags" class="form-control tm-input"/> 
 
    </div> 
 
</div> 
 

 

 
<script type="text/javascript"> 
 
$(document).ready(function() { 
 
    $('.tm-input').tagsManager(); 
 
}); 
 
</script>

それがテキストボックス(それを下に移動)の位置を変えるように私は本当に現在の設定は好きではありません。入力ボックスの上にタグを配置するのではなく、その下にタグを配置する方法はありますか?

私が探しているものは、Stackoverflowタグの入力フィールドに似ています - タグはの下に表示されます。テキスト入力フィールド。

+0

は 'tags''余裕を与えることをしようとし-top' cssの 'input'と同じ –

+0

@AnujKhandelwalは動作しません – rookie

答えて

1

私はいくつかのコードと、入力

HTML以下にその番組の編集があります。

<div class="form"> 
    <div class="form-group col-xs-6"> 
    <label>Tags</label> 
    <input type="text" name="tags" class="form-control tm-input"/> 
    </div> 
    <div class="col-sm-12 tags-show"> 

    </div> 
</div> 

jQueryの

$(document).ready(function() { 
    $('.tm-input').tagsManager({ 
    tagsContainer: '.tags-show', 
    }); 
}); 
+0

作品まことにありがとうございます! – rookie

関連する問題