php - procesamiento - obtener datos de un formulario con jquery

Cómo enviar datos de formulario de serialización usando JQuery si el elemento de entrada es una matriz

Question

Tengo este código en mi código PHP:

while ($row = mysqli_fetch_assoc($result))
{
    extract($row);
    echo "<tr>";
    echo "<td bgcolor=''#FFFFFF''><input id=''bookArray[]'' name=''bookArray[]'' type=''checkbox'' value=''$book_id'' />$book_id</td>";
    echo "<td bgcolor=''#FFFFFF''>$threat_name</td>";
    echo "</tr>";
}

En la página HTML, quiero usar el método jQuery serialize () para enviar una matriz de libros seleccionados en bookArray []. En mi JavaScript,

var selectedbooks = $("book_form").serialize();
alert (selectedbooks); 

En el cuadro de mensaje de alerta, no obtuve ningún valor (cadena vacía).

Previamente, cuando estoy usando Prototype, funcionó bien.

Answer 1

¡Problema resuelto! Aquí esta lo que hice.

Dentro de un archivo PHP para crear filas de casillas de verificación dinámicas,

  while ($row = mysqli_fetch_assoc($result))
  {
   extract($row);
   echo "<tr>";
   echo "<td bgcolor=''#FFFFFF''><input name=''books'' type=''checkbox'' value=''$book_id'' />$book_id</td>";
   echo "<td bgcolor=''#FFFFFF''>$book_name</td>";
   echo "</tr>";
  } // while

Ya no uso el método JQuery $ .post. Cambié mi código a la siguiente

    var my_query_str = '''';

$("input[@type=''checkbox''][@name=''books'']").each(
  function()
  {
    if(this.checked)
    {
           my_query_str += "&bookArray[]=" + this.value;
    }
  });


$.ajax(
{
    type: "POST",
    url: "saveBookList.php",
    data: "dummy_data=a" + my_query_str,
    success:
        function(responseData)
        {
            $("#save-result").empty().append(responseData);
        },
    error:
        function()
        {
            $("#save-result").append("An error occured during processing");
        }
});

Ahora, dentro de la página saveBookList.php, el valor de $ _POST [''bookArray''] es una matriz. ¡Yey! ¡Yey!

Espero y deseo que el método $ .post de JQuery pueda admitir tipos de datos de matriz como lo hace Prototype. :)

Answer 2

Puede que necesites cambiar tu PHP como sugiere @Tomalak, pero también necesitarás cambiar tu javascript. Para hacer referencia a un elemento con nombre, use el selector #name:

var selectedbooks = $(''form#book_form'').serialize();;

Answer 3

Prototype / Scriptaculous serialize funcionalidad para jQuery:

<script>
function toObjectMap( queryString )
{
    return ''{/''' + queryString.replace(/=/g, ''/':/''').replace(/&/g, ''/',/''') + ''/'}'';
}
</script>
...
<div id="result"></div>
...
<form onSubmit="$(''#result'').load( ajaxURL, toObjectMap( $(''#formId'').serialize() ) );" ...>
...

Answer 4

@Tomalak Puedes usar los corchetes de los caracteres "[" y "]" dentro de XHTML ver http://www.w3.org/TR/xhtml1/dtds.html#dtdentry_xhtml1-transitional.dtd_input

Esto significa que un nombre puede contener muchos caracteres diferentes legalmente dentro de XHTML, aunque no tiene mucho sentido usar barras o corchetes. PHP admite el uso de la notación de matriz en los nombres de forma, por lo que podría perder un truco si no utiliza la notación de matriz en algunos casos.

Answer 5

var data = $(form).serialize();
$.post(''post.php'', ''&''+data);

Answer 6

jQuery 1.4

var myform = $("book_form").serialize();

decodeURIComponent(myform);

Answer 7

no es un problema con jQuery Post, es con la serialización puedes hacer esto:

    var my_query_str = ''''; 
    $("input[@type=''checkbox''][@name=''books'']").each( function() { 
       if(this.checked) { my_query_str += "&bookArray[]=" + this.value; } 
    }); 
   jQuery.post(
      "saveBookList.php",
      "dummy_data=a" + my_query_str ,
       function(responseData){   
          $("#save-result").empty().append(responseData); 
       }, 
       error: function() { 
            $("#save-result").append("An error occured during processing"); 
       }
   }); 

pero todo lo que tienes que hacer es reemplazar ''['' & '']'' a sí mismos después de serializarlos. porque serialize (); ¡los cambió a su valor htmlencoded!

Answer 8

He encontrado un método que lo hará, cuando los datos se envíen utilizando publicaciones

por otro lado, te permite acceder a tus elementos usando $_[''post''][''name'']

Si se trata de una matriz (por ejemplo, una selección múltiple), en su servidor puede acceder a ella como una matriz de nuevo $_POST[''myselect''][0]...

Código: Función para serializar datos de formulario para publicación

function serializePost(form) {
    var data = {};
    form = $(form).serializeArray();
    for (var i = form.length; i--;) {
        var name = form[i].name;
        var value = form[i].value;
        var index = name.indexOf(''[]'');
        if (index > -1) {
            name = name.substring(0, index);
            if (!(name in data)) {
                data[name] = [];
            }
            data[name].push(value);
        }
        else
            data[name] = value;
    }
    return data;
}

Answer 9

var arTags = new Array();

jQuery.map( $("input[name=''tags[]'']") , function(obj,index)
{
   arTags .push($(obj).val());
});

var obj = {''new_tags''           : $("#interest").val() ,
           ''allready_tags[]''  : arTags };

var post_data = jQuery.param(obj,true);

$.ajax({
      type :  ''POST'',
      url  :  ''some_url'',
      data :  post_data,
      dataType : "html",
      success: function(htmlResponse)
      {

      }
});

Answer 10

Si tiene que publicar esa matriz solamente y no otros campos de entrada, esta es una solución limpia y rápida:

var selectedbooks = $(''book_form input[name^="bookArray["]'').serialize();
alert (selectedbooks); 

Explicación

El selector ^ = selecciona todos los elementos con un valor de atributo de nombre que comienza con ''bookArray'', el corchete abierto ''['' asegura que el elemento es la matriz que queremos serializar y no solo una variable que comienza con la cadena ''bookArray''.

Answer 11

Tienes que reemplazar los corchetes de la izquierda y los corchetes de la derecha con esto:

data: $(this).serialize().replace(/%5B/g, ''['').replace(/%5D/g, '']''),

Answer 12

easy: serialize().replace(/%5B%5D/g, ''[]'')

Answer 13

trabaja correctamente jquery =>

var data = $(''form'').serialize();
            $.post(baseUrl+''/ajax.php'',
                    {action:''saveData'',data:data},
                    function( data ) {
                        alert(data);
                    });

php =>

parse_str($_POST[''data''], $searcharray);
    echo (''<PRE>'');print_r($searcharray);echo (''</PRE>'');

salida =>

[query] => 
[search_type] => 0
[motive_note] => 
[id_state] => 1
[sel_status] => Array
    (
        [8] => 0
        [7] => 1
    )

y puedes hacer lo que quieras con los datos de la matriz, gracias a Aridane https://.com/questions/1792603

Answer 14

Gracias Tomalak.

En el archivo PHP, estoy usando el siguiente código ahora:

while ($row = mysqli_fetch_assoc($result)) {
    extract($row);
    echo "<tr>";
        echo "<td bgcolor=''#FFFFFF''><input id=''$book_id'' name=''bookArray[]'' type=''checkbox'' value=''$book_id'' />$book_id</td>";
        echo "<td bgcolor=''#FFFFFF''>$book_name</td>";
    echo "</tr>";
} // while

** El book_id es único.

Utilizando la solución tvanfosson, ahora puedo obtener una matriz de valor de entrada

var selectedBooks = $ (''form # book_form''). serialize (); alerta (selectedBooks);

Desde el cuadro de mensaje de alerta, obtengo ==> bookArray% 5B% 5D = T2.05 & bookArray% 5B% 5D = T2.81

Ahora, cuando envié el valor de entrada de serialización al archivo PHP usando JQuery

var selectedBooks   = $(''form#book_form'').serialize();
alert (selectedBooks);

var url = ''saveBookList.php'';

// Send to server using JQuery
$.post(url, {bookArray: selectedBooks}, function(responseData) {
    $("#save-result").text(responseData);
});

Dentro de saveBookList.php para procesar el formulario de serialización, recibí este error "Se proporcionó un argumento inválido para foreach ()".

Dentro de saveBookList.php,

// If you have selected from list box.
if(isset($_POST[''bookArray''])) {

    // Get array or bookID selected by user
    $selectedBookId = $_POST[''bookArray''];
    echo $selectedBookId;

    foreach($selectedBookId as $selectListItem) {
        echo "You sent this -->" . $selectListItem . "/n";
    }
}

El código PHP anterior funciona bien si estoy enviando usando Prototype.

Para Prototype cuando echo echo $ selectedBookId;

Tengo Array.

Para JQuery, cuando echo echo $ selectedBookId;

Tengo ==> bookArray% 5B% 5D = T4.11 & bookArray% 5B% 5D = T4.38

Mi pregunta, ¿jQuery admite el valor de matriz para el método de publicación?