este es el codigo que actual mente tengo.
Código HTML:
<span class="section">¿Con qué?</span> <div class="item form-group"> <label class="control-label col-md-3 col-sm-3 col-xs-12" for="email">Debemos declarar que infraestructura utilizamos para realizar las actividades del proceso.<span class="required">*</span> </label> <div class="col-md-6 col-sm-6 col-xs-12" id="main"> <input type="button" id="btAdd" value="Añadir Elemento" class="bt" /> <input type="button" id="btRemove" value="Eliminar Elemento" class="bt" /> <input type="button" id="btRemoveAll" value="Eliminar Todo" class="bt" /><br /> </div> </div>
Código Javascript:
Ver original
//agregar campos con que $(document).ready(function() { var iCnt = 0; // Crear un elemento div añadiendo estilos CSS var container = $(document.createElement('div')).css({ padding: '1px', margin: '70px', width: '950px', border: '1px dashed' });$('#btAdd').click(function() { if (iCnt <= 19) { iCnt = iCnt + 1; // Añadir caja de texto. $(container).append('<div class="item form-group"><label class="control-label col-md-3 col-sm-3 col-xs-12" for="email">Con Que?<span class="required">*</span></label><div class="col-md-6 col-sm-6 col-xs-12"><input type=text class="form-control col-md-7 col-xs-12" placeholder="Cual es tu Salida" required="required" id=tb' + iCnt + ' ' + 'value="¿Con qué?' + iCnt + '" /></div></div>'); if (iCnt == 1) { var divSubmit = $(document.createElement('div')); //$(divSubmit).append('<input type=button class="bt" onclick="GetTextValue()"' + //'id=btSubmit value=Enviar />'); } $('#main').after(container, divSubmit); } else { //se establece un limite para añadir elementos, 20 es el limite $(container).append('<label>Limite Alcanzado</label>'); $('#btAdd').attr('class', 'bt-disable'); $('#btAdd').attr('disabled', 'disabled'); } }); $('#btRemove').click(function() { // Elimina un elemento por click if (iCnt != 0) { $('#tb' + iCnt).remove(); iCnt = iCnt - 1; } if (iCnt == 0) { $(container).empty(); $(container).remove(); $('#btSubmit').remove(); $('#btAdd').removeAttr('disabled'); $('#btAdd').attr('class', 'bt') } }); $('#btRemoveAll').click(function() { // Elimina todos los elementos del contenedor $(container).empty(); $(container).remove(); $('#btSubmit').remove(); iCnt = 0; $('#btAdd').removeAttr('disabled'); $('#btAdd').attr('class', 'bt'); }); }); // Obtiene los valores de los textbox al dar click en el boton "Enviar" var divValue, values = ''; function GetTextValue() { $(divValue).empty(); $(divValue).remove(); values = ''; $('.input').each(function() { divValue = $(document.createElement('div')).css({ padding:'5px', width:'200px' }); values += this.value + '<br />' }); $(divValue).append('<p><b>Tus valores añadidos</b></p>' + values); $('body').append(divValue); }