在bootstrap input-append中单击时添加更多输入字段

时间:2013-12-27 19:20:15

标签: javascript php jquery twitter-bootstrap

即时通讯使用twitter bootstrap。我需要一个 1.select-box +带自动完成的输入字段。 2.添加添加输入字段的行按钮 3.删除行按钮 4.save按钮,提交所有选定的值。

<div class="well-large">
    <div class="row">
        <button type="button" class="btn btn-default">Save</button></br>
        <div class="input-append btn-group">
            <input class="span2" id="appendedInputButton" size="16" type="text">
            <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
                <span class="caret"></span>
            </a>
            <ul class="dropdown-menu">
                <?php foreach($cars as $ar){?>
                <li><a href="#"><i class="icon-pencil"></i><?php echo $ar;?></a></li>
                <?php }?>
            </ul>
        </div>
    </div>
</div>

var cars = <?php echo json_encode($cars) ?>;
    $("#appendedInputButton").autocomplete({
        source: cars,
        fillin:true
    });

我尝试了很多方法,但其中任何一个都没有用。有人建议我解决这个问题。主要是添加行。

1 个答案:

答案 0 :(得分:0)

For One&gt;&gt;自动完成是否需要动态提取数据,例如输入google URI bar自动搜索google,或者只是根据键入的条件隔离字段。即你键入“a”并且它只显示annie,annabelle,amy,然后输入“n”使你的字段“成为”并且不再显示amy

For Two&gt;&gt;检查这些jquery方法[http://api.jquery.com/category/manipulation/dom-insertion-inside/]并选择最适合你的方法。将它绑定到一个按钮并让jqueryStuff()函数添加你想要的DOM东西

<button onClick="jqueryStuff()">Add Row</button>

For Three&gt;&gt;使用与2相同的内容,但来自[http://api.jquery.com/category/manipulation/dom-removal/]。您是否想要删除复选框,或者更简单的方法,只需删除列表中的最后一个。

<button onClick="jqueryStuff()">Remove Row</button>