Formulaire à distance avec A tag soumettre dans Rails 3

Question

J'ai un formulaire à distance avec des boutons faits à la main en utilisant des balises. J'utilise data-remote = true dans la balise de formulaire, mais je ne sais pas comment utiliser la balise link pour publier les données du formulaire dans un formulaire. Lorsque j'utilise data-remote avec data-method, il crée un appel distant avec des paramètres vides, donc je n'appelle pas la fonction submit() à mon formulaire.

Ma forme est:

<form accept-charset="UTF-8" action="/tasks" data-remote="true" method="post"> 

et ma balise de lien sous les balises de formulaire sont:

il crée un appel à distance avec les paramètres POST vides:

<a class='minibutton' data-remote='create' href='/tasks/create' data-method='post'> 

elle ne présente pas envoyer des informations POST, uniquement l'en-tête:

<a class='minibutton' data-remote='create' href='/tasks/create'> 

Comment appeler élégante la méthode submit() du formulaire? Je suppose que je n'ai pas besoin de créer des hacks javascript pour le faire fonctionner. Est ce que je?

Answer 1

Je suppose qu'il ya 2 façons êtes les pouvez résoudre:

1. Je vois que vous utilisez une classe appelée « minibutton » sur votre lien, que vous voulez qu'il suggère ressembler à un bouton de toute façon . Ainsi, au lieu du lien (ou <input type="submit"> tag), utilisez la balise de bouton à l'intérieur de votre formulaire:

<button type="submit" value="Submit"> 

et le style à votre goût en utilisant le CSS. Vous pouvez même utiliser des icônes sur eux. Découvrez this blog post pour plus de détails et un morceau de code CSS prêt à l'emploi. Si vous souhaitez toujours utiliser le lien, vous pouvez définir des attributs "id" sur le lien et sur le formulaire, et ajouter un observateur d'événement click pour soumettre le formulaire. En supposant que vous utilisez Prototype, mettre quelque chose comme ça dans la partie de la tête de la page:

<%= javascript_tag do %> 
    $('YOUR-LINK-ID').observe(
     'click', 
     function(el, value) { 
      $('YOUR-FORM-ID').request({ 
      onSuccess: function(response) {eval(response)} 
      }) 
     } 
    ); 
<% end %> 

Cela suppose votre type de contenu de réponse est text/javascript. Si ce n'est pas le cas, vous devrez utiliser les rappels onSuccess et/ou onComplete pour remplacer un élément de votre page par le contenu de la réponse. Voir la documentation sur Form.request et Event.observe pour plus de détails sur l'observation et la soumission d'un formulaire.

This question peut aussi vous être utile.