0

client_side_validationジェムをリビールモーダル(Zurb Foundation)内で機能させることができたかどうかを誰かに教えてもらえますか?

client_side_validationでうまく機能するフォームがありますが、それをリビールモーダルに入れるとすぐに、検証が機能しなくなります。

( http://foundation.zurb.com/docs/reveal.phpのhttps://github.com/bcardarella/client_side_validations )

ありがとう

4

1 に答える 1

2

編集済み-このページは将来、他の人に洞察を与える可能性があります(最初の回答を投稿して以来、これを再訪していないため、テストしていません)-クライアント側の検証では、デフォルトで表示されているフィールドのみが検証されます。ページ、https://github.com/bcardarella/client_side_validations/wiki/Validation-in-Multi-Step-Form、フォームを検証するように指示する必要がある場合があります$(form_id).enableClientSideValidations();

私はそれをしませんでした、私はajaxを通して全部をロードしました。この状況で他の人が始めるのに役立つかもしれないいくつかの情報があります。

ZurbのFoundationフレームワークの標準モーダルウィンドウは、ページ上のdivと、jsがdisplay:none/blockを切り替えるトリガーとなるリンクです。これにより、リビールモーダル内の他のjsが正常に機能するため、client_side_validationsgemが機能しなくなる理由がわかりません。リビールモーダルとそのjsのスタイリングに便乗し、コンテンツ全体をajax経由でロードします。

これが将来誰かを助ける場合に備えて、これが私の基本的なセットアップが現在どのように見えるかです。ajaxへの複数のリンクとモーダルになる単一のdivがあります。js.erbを簡単にチェックして、以前にレンダリングされたコンテンツを(複数のリンク用に)交換します。

#Populate div with a reveal modal containing a partial (a form, remember to put in the j in "j render") and if said modal already has content, ditch it.  

if( !$('#reveal-div').html().length ) {
$('#reveal-div').append('<%= j render :partial => 'form', :locals => { :some_locals => @whatever_values  } %><a class="close-reveal-modal">&#215;</a> ');
$('#reveal-div').addClass('reveal-modal').appendTo('body');
$('#reveal-div').reveal();
}
else{
$('#cbrform').remove();
$('#reveal-div').append('<%= j render :partial => 'form', :locals => { :some_locals => @whatever_values } %><a class="close-reveal-modal">&#215;</a>'); 
$('#reveal-div').reveal()};

#Make sure you get your validations working on remote loaded forms with this line
$('form[data-validate]').validate(); 

したがって、フォームのモーダルdivで.reveal()を呼び出してから、.validate()を呼び出すことで、モーダルをajax経由でロードし、通常の方法で閉じることができます。最初のページの読み込み時にフォームを読み込んでからjsで表示するのではなく、すべてをjsで読み込むので、通常の手順に従って検証を実行します。これが私のnew.js.erbです。これを管理できるはずです(つまり、link_to、それをロードするためのdiv(この場合は#reveal-div)、および適切なコントローラーアクションが必要になります) )。

ハッピーコーディング;-)

于 2012-11-20T16:16:12.777 に答える