entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

2votos

recuperar nombre de input

hola, estoy usando este codigo para generar una tabla en la cual si el usuario lo desea pueda agregar mas rows, hasta aqui todo va bien, ahora solo necesito si me pueden orientar para recuperar el nombre de los inputs, dejo mi codigo

<table class="table table-striped table-bordered table-hover table-heading no-border-bottom" id="field_grid6">
                            <thead>
                                <tr>
                                    <th>STEP</th>
                                    <th>ACTION</th>
                                    <th>RESULTS/DESCRIPTIONS</th>
                                    <th>TIME</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td> <input type="text" value=""  name="91a[]" placeholder="step" class="form-control" />
                                        <br>
                                            <select class="form-control" name="admotion[]">
                                                <option value="">Admotion</option>
                                                <option value="danger">DANGER</option>
                                                <option value="warning">WARNING</option>
                                                <option value="caution">CAUTION</option>
                                            </select>
                                        <br>
                                            <select class="form-control" name="admotion1[]">
                                                <option value="">Disruption</option>
                                                <option value="Service">SERVICE</option>
                                                <option value="Network">NETWORK</option>
                                            </select>
                                        <br>
                                        <textarea rows="4" name="[]" cols="50" class="form-control"></textarea>
                                    </td>
                                    <td> <textarea rows="6" name="92a[]" cols="50" class="form-control"></textarea></td>
                                    <td> <textarea rows="6" name="93a[]" cols="50" class="form-control"></textarea></td>
                                    <td> <input type="text"  value="" name="94a[]" placeholder="time" class="form-control" /></td>
                                </tr>
                            </tbody>
                        </table>
                        <button id="add_field6" class="btn btn-default">Add Field <i class="fa fa-plus"></i></button>
                        <script type="text/template5" id="template6">
                                 <tr>
                                    <td>
                                        <input type="text" class="form-control" value=""  name="91a[]" placeholder="step" />
                                        <br>
                                            <select class="form-control" name="admotion[]">
                                                <option value="">Admotion</option>
                                                <option value="danger">DANGER</option>
                                                <option value="warning">WARNING</option>
                                                <option value="caution">CAUTION</option>
                                            </select>
                                        <br>
                                            <select class="form-control" name="admotion1[]">
                                                <option value="">Disruption</option>
                                                <option value="Service">SERVICE</option>
                                                <option value="Network">NETWORK</option>
                                            </select>
                                        <br>
                                        <textarea rows="4" name="admotion2[]" cols="50" class="form-control"></textarea>
                                    </td>
                                    <td>
                                        <textarea rows="6" name="92a[]" cols="50" class="form-control"></textarea>
                                    </td>
                                    <td>
                                        <textarea rows="6" name="93a[]" cols="50" class="form-control"></textarea>
                                    </td>
                                    <td>
                                        <input type="text" class="form-control" value=""  name="94a[]" placeholder="time" />
                                    </td>
                                    <td>
                                        <a href="#" class="btn-remove6"><li class="fa fa-trash-o"> </li></a>
                                    </td>
                                </tr>
                        </script>

<script type="text/javascript">
function addField6() {
            $($('#template6').html()).appendTo('#field_grid6 tbody');
        }

        function removeField(e) {
            if($('input[type=text]').parents('tbody').find('tr').length <= 2) {
                return false;
            }
            var row = $(e).closest('tr').remove();
        }

        $(function() {
            $('#field_grid6').on('click', '.btn-remove6', function(e) {
                removeField(e.target);
                return e.preventDefault();
            });

            $('#add_field6').click(function(e) {
                addField6();
                return e.preventDefault();
            });

            $('#field_grid6').on('click', '.btn-up', function(e) {
                var current = $(this).parents('tr');

                if(current.prevAll().length == 1) {
                    return e.preventDefault();
                }
                current.prev().before(current);
                return e.preventDefault();
            });

            $('#field_grid6').on('click', '.btn-down', function(e) {
                var current = $(this).parents('tr');
                current.next().after(current);
                return e.preventDefault();
            });
        });
</script>

Espero que me puedan ayudar, de antemano muchas gracias!

0voto

white comentado

Estas hablando del atributo name de los campos? en donde deseas obtener los nombres? cliente? servidor?

en jquery podria ser:

var nombre = $('#input').attr('name');

0voto

rach comentado

si, lo que quiero es saber el nombre del nuevo campo que agrego
me guíe con este ejemplo http://jsfiddle.net/imron02/6udka/
solo quiero recuperar los nombres de los nuevos inputs que se vayan agregando

1 Respuesta

0voto

white Puntos75880

En tu código y en el ejemplo son campos vectores, cuando envias los campos por un formulario haciendo submit los recuperas de esta forma:

html:

<input name="campos[]" value="1" type="text >
<input name="campos[]" value="2" type="text >
<input name="campos[]" value="3" type="text >

$campos = $_POST['campos'];

$campos contendría:

array(
    [0] => 1
    [1] => 2
    [2] => 3
)

ahora bien si deseas recuperarlos en javascript podrias intentar obtener todos los campos:

function get_values() {
    var inputs = $('input'),
        selects = $('select'),
        textareas = $('textarea'),
        all = {}, values = {}, inputs, name;

    all['inputs'] = [].slice.call(inputs);
    all['selects'] = [].slice.call(selects);
    all['textareas'] = [].slice.call(textareas);

    for(var type in all) {
        inputs = all[type];

        $(inputs).each(function(i, input) {
            console.log(input);
            name = $(input).attr('name');

            if(!values[name])
                values[name] = [];

            values[name].push(input.value);
        });
    };

    // solo para ver los valores:
    $('#valores').html(unescape($.param(values)));
}

http://jsfiddle.net/m85qz5uy/1/

0voto

white comentado

Aca te dejo un ejemplo:

https://jsfiddle.net/vv86pqvm/1/embedded/result/
https://jsfiddle.net/vv86pqvm/1/

en el elemento <script id="inputs-template" type="text/template"> agregas el template para cada grupo de campos, cada campo tiene el atributo data-name que será el nombre del campo para enviarse por ajax, cambia esta linea:

url: 'save.php',

por tu url.

0voto

rach comentado

hola muchas gracias, voy a ver la manera de adaptar tu ejemplo a como lo necesito muchas gracias por tu inmensa ayuda

0voto

rach comentado

HOLA otra vez regreso, ojala que me puedan ayudar, creo que necesito algo mas sencillo, solo quiero recuperar el valor de los inputs dinámicos y que me los muestre con una alerta, algo parecido a esto
http://roshanbh.com.np/2008/08/handling-array-html-form-elements-javascript-php.html

pero no me funciona, :( no se si me puedan ayudar

0voto

white comentado

0voto

rach comentado

GRACIAS era lo que necesitaba :)

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta