ejemplos - Jquery obtiene el campo de matriz de entrada

jquery selector

Question

He encontrado preguntas similares aquí pero nada funciona para mí.

tener entradas como:

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

tratando de obtener estos campos como:

$(''input[name="pages_title[]"]'')

pero tiene resultados vacíos :(

cómo obtener todos los campos? Solo puedo obtenerlo como $(''input[name="pages_title[1]"]'')

Answer 1

Creo que la mejor manera es usar un Propper Form y usar jQuery.serializeArray .

<!-- a form with any type of input -->
<form class="a-form">
    <select name="field[something]">...</select>
    <input type="checkbox" name="field[somethingelse]" ... />
    <input type="radio" name="field[somethingelse2]" ... />
    <input type="text" name="field[somethingelse3]" ... />
</form>

<!-- sample ajax call -->
<script>
$(document).ready(function(){
    $.ajax({
        url: ''submit.php'',
        type: ''post'',
        data: $(''form[name="a-form"]).serializeArray(),
        success: function(response){
            ...
        }
    });
});
</script>

Los valores estarán disponibles en PHP como $_POST[''field''][INDEX] .

Answer 2

Debes usar el inicio con el selector

var elems = $( "[name^=''pages_title'']" );

Pero una mejor solución es agregar una clase a los elementos y hacer referencia a la clase. La razón por la cual es una búsqueda más rápida.

Answer 3

Para seleccionar un elemento por atributo que tenga una característica específica, puede crear un nuevo selector como en el siguiente fragmento utilizando un patrón de expresión regular. El uso de regex tiene como objetivo flexibilizar el nuevo selector tanto como sea posible:

jQuery.extend(jQuery.expr['':''], {
    nameMatch: function (ele, idx, selector) {
        var rpStr = (selector[3] || '''').replace(/^//(.*)//$/, ''$1'');
        return (new RegExp(rpStr)).test(ele.name);
    }
});


//
// use of selector
//
$(''input:nameMatch(/^pages_title//[//d//]$/)'').each(function(idx, ele) {
  console.log(ele.outerHTML);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


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

Otra solución puede basarse en:

• [name^=”value”] : selecciona elementos que tienen el atributo especificado con un valor que comienza exactamente con una cadena dada.

• .filter() : reduce el conjunto de elementos coincidentes a aquellos que coinciden con el selector o pasan la prueba de la función.

• un patrón regex

var selectedEle = $('':input[name^="pages_title"]'').filter(function(idx, ele) {
    //
    // test if the name attribute matches the pattern.....
    //
    return  /^pages_title/[/d/]$/.test(ele.name);
});
selectedEle.each(function(idx, ele) {
    console.log(ele.outerHTML);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


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

Answer 4

Puede dar los nombres de las clases de los cuadros de texto de entrada, de la siguiente manera:

<input type="text" value="2" name="pages_title[1]" class="pages_title">
<input type="text" value="1" name="pages_title[2]" class="pages_title">

e iterar así:

$(''input.pages_title'').each(function() {
    alert($(this).val()); 
});

Answer 5

Puede usar el selector de contenido:

[name*=”value”] : selecciona elementos que tienen el atributo especificado con un valor que contiene una subcadena dada.

$( document ).on( "keyup", "input[name*=''pages_title'']", function() {
     alert($(this).val());
});

Answer 6

Puedes escapar de los corchetes con barras invertidas dobles como esta:

$(''input[name="pages_title//[//]"]'')

Answer 7

Use los inicios con el selector

$(''input[name^="pages_title"]'').each(function() {
    alert($(this).val());
});

Ejemplo jsfiddle

Nota: De acuerdo con @epascarello, la mejor solución es agregar una clase a los elementos y hacer referencia a esa clase.

Answer 8

esto normalmente funciona en casillas de verificación y botones de radio ... pero cada nombre debe ser el mismo.

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

var x = $(''input[name="pages_title[]"]'').val();

eso es "supuesto" para obtener todos los campos en valores separados por comas. nunca lo intenté con cuadros de texto, así que no puedo garantizarlo.

como @John comentó: para iterar sobre ellos. $(''input[name="pages_title[]"]'').each(function() { var aValue = $(this).val(); });

EDITAR: No siempre es necesario responder las preguntas OP, a veces es necesario enseñarles mejores métodos. (lo siento si eso suena arrogante)

COMENTARIO: definir las entradas como

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

está rompiendo la matriz, cada entrada tiene un nombre único, por lo tanto, ya no es una matriz.

Answer 9

use el método de mapa, podemos obtener los valores de entrada que se almacenan en la matriz.

var values = $("input[name=''pages_title[]'']").map(function(){return $(this).val();}).get();

Answer 10

var multi_members="";
$("input[name=''bayi[]'']:checked:enabled").each(function() {
    multi_members=$(this).val()+","+multi_members;
});