Multiple fields
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<div class="col-xs-6">
<form>
<div class="form-group multiple-form-group" data-max=3>
<label>Multiple inputs (with data-max=3)</label>
<div class="form-group input-group">
<input type="text" name="multiple[]" class="form-control">
<span class="input-group-btn"><button type="button" class="btn btn-default btn-add">+
</button></span>
</div>
</div>
<div class="form-group multiple-form-group">
<label>Multiple selects</label>
<div class="form-group input-group">
<select name="multiple[]" class="form-control">
<option value="">Default select</option>
<option value="">Option 1</option>
<option value="">Option 2</option>
</select>
<span class="input-group-btn"><button type="button" class="btn btn-default btn-add">+
</button></span>
</div>
</div>
<div class="form-group multiple-form-group">
<label>Multiple textareas</label>
<div class="form-group input-group">
<textarea name="multiple[]" class="form-control" rows="3"></textarea>
<span class="input-group-btn"><button type="button" class="btn btn-default btn-add">+
</button></span>
</div>
</div>
</form>
</div>
</div>
</div>
Muchas gracias por compartir, me ha sido de mucha utilidad,How I can add a input[type=file] to this form?,what problem?,how to set max no’s to add field?,i added data-max attribute,Very nice! If i have to add also one dropdown list? i have to modify only the html code? Thx!,Yes, it’s cool )Add demo for select and textarea to snippet.,The author is zelenin
Loading...
