Envoyer tableau html comme variable d'après en utilisant Request.JSON

Question

J'ai un html:

First name: <input type='text' name='first_name' value='' /><br/> 
Last name: <input type='text' name='last_name' value='' /><br/> 
<input type='checkbox' name='category[]' value='Math' /> Math<br/> 
<input type='checkbox' name='category[]' value='Science' /> Science<br/> 
<input type='checkbox' name='category[]' value='History' /> History<br/> 
etc..... 

Je veux envoyer (en utilisant la méthode de post) les catégories sélectionnées (catégorie []) via Mootools ajax de sorte que si je vide la variable $ _POST dans le serveur je vais obtenir quelque chose comme: Code

array(1) { 
    [category]=> 
    array(2) { 
    [0]=> 
    string(4) "Math" 
    [1]=> 
    string(7) "History" 
    } 
} 

Quel devrait être le javascript (Mootools) pour cela? Voici mon code partiel.

new Request.JSON({url: '/ajax_url', 
      onSuccess: function(){ 
       alert('success'); 
      } 
     }).post(???); 

Notez que je ne souhaite pas envoyer les champs prénom et nom de famille. Je veux seulement envoyer le champ catégorie qui est un tableau html.

Answer 1

Il vous suffit de sérialiser les champs:

var theForm = $('form-id'); 

new Request.JSON({url: '/ajax_url', 
    onSuccess: function(){ 
     alert('success'); 
    } 
}).post(theForm.toQueryString()); // this will create the GET-style query 

Answer 2

J'examine le code source de cette fonction de la bibliothèque Prototype JS pour voir comment cela fonctionne: la ligne 100 à http://github.com/sstephenson/prototype/blob/master/src/dom/form.js#L100

Il peut nécessiter un peu de peaufinage pour accepter le format category[], mais il est un début, ou une inspiration.

Answer 3

est ici une façon de le faire:

$("formid").addEvent("submit", function(e) { 
    e.stop(); 
    var x = {}; 
    this.toQueryString().split('&').each(function(i) { 
     var p = i.split('='); 
     if (p[0].contains("[]")) { 
      p[0] = p[0].replace("[]", ""); 
      if ($type(x[p[0]]) != "array") 
       x[p[0]] = []; 
      x[p[0]].push(p[1]); 
     } 
     else { 
      x[p[0]] = p[1]; 
     } 

    }); 
    // return a number of formats, depends on your backend: 
    console.log(x, JSON.encode(x), $H(x).toQueryString()); 
}); 

ce peut produire:

l'objet (x) ou ...

json {"first_name":"Dimitar","last_name":"Christoff","category":["Math","Science"]} ou ...

chaîne de requête: first_name=Dimitar&last_name=Christoff&category[0]=Math&category[1]=Science

bonne chance. case: http://www.jsfiddle.net/dimitar/Wxx3b/1/

p.s. vous n'êtes pas censé utiliser les name[] comme noms de champs, c'est vraiment un raccourci/une bonne façon pour PHP de gérer les choses mais ce n'est pas pour l'imo côté client.