問題タブ [unobtrusive-javascript]

フォームのあるhtmlページがあります。
フォームには、テキスト ボックス、ラジオ、チェックボックスなどの入力要素が動的に入力される Div があります。

ここで、Html ページでこれらの動的に作成された要素の値を取得して、ページに送信できるようにしたいと考えています。

//HTML ページ

//質問 DIV 生成スクリプトの例のラジオ ボタン

フォーム内の「X」チェックボックス（任意の入力要素）と「M」オプション選択インデックス（「M」は「X」より小さい）と仮定します。次に、「M」オプションのインデックス/値を選択し、残りのチェックボックスを最適に選択解除するにはどうすればよいですか?

つまり、10 個のチェックボックスと 5 つのオプション インデックス (例: 1,2,4,5,8) があるとします。次に、指定されたインデックスでチェックボックスを選択する必要があります。

次のコードを思い付くことができました。

しかし、残りの部分にも効果を追加したいと思います(choiceToSelect配列ではありません)。(choiceToSelect に含まれていない人には赤色かもしれません) これは 1 回のトラバーサル/ループで実行できますか? 最適ですか？またはより良い方法？

私はこのコードhttp://gist.github.com/110410を使用してプロトタイプをダンプし、jQuery を支持していますが、問題があります。

これは私の HTML (link_to で生成されたリンク) です。

問題：

ページがリロードされることを除いて、すべてが正常に機能します。送信が通過してページのリロードが発生すると思われます。

それを防ぐエレガントな方法はありますか？false を返します。この場合、それをカットしないようです。

私はAjaxとRubyを使用して2つのプロジェクトに取り組んできました。あるプロジェクトでは、RailsプロトタイプヘルパーとRJSを使用しました。他のプロジェクトでは、jQueryでHAMLと控えめなJavascriptを使用しました。それぞれに私が克服した学習曲線がありました。ただし、どちらのアプローチの長期的なコストとメリットも明確ではありません。次のプロジェクトでは、次のいずれかを決定しようとしています。

1. Rails + HAML + jRails + jQuery
2. Rails +HAML+控えめなjQuery

Rails、特にRails 3.0の傾向は、控えめなJavascriptを使用する傾向にあるようですが、特にRails / jRailsから非常に多くの有用なヘルパー（remote_form_forなど）を取得する場合、なぜこれが優れているのかはわかりません。この決定を下そうとする際に、私は次の質問があります。

1. 同じ量の機能を実現するためのコードを減らすには、どちらのアプローチが必要ですか？
2. エラーが発生しにくいアプローチはどれですか？
3. テストが簡単なアプローチはどれですか？
4. 読みやすく、維持しやすく、進化しやすいアプローチはどれですか？
5. クライアントブラウザーでJavascriptが無効になっている場合に、（Ajaxなしで同じ機能を提供することにより）Webアプリケーションをより簡単に正常に劣化させることができるアプローチはどれですか？

私はあなたが提供できるどんな助けや洞察にも感謝します。

複数のチェックボックスを選択できるようにしたいのですが、個々のボックスごとonmouseoverに適用 onmouseoverするのではなく、代わりにIDでチェックボックスを操作することでその方法を考え出そうとしていますが、どこから行けばよいかわかりませんを使用してgetElementById。したがって、以下に表示されるものの代わりに：

onmousover次のようなチェックボックスの配列に効果を適用できるようにしたい:

Stack Overflow の検索機能を試して Google を調べた後も、これまでのところ自分にとって意味のある解決策を見つけることができませんでしたが、まだ学習中なので、しようとしているのではないかと心配しています。私の知識レベルには高度すぎることをしてください。

Rails 3 は、Javascript を目立たなくするためにいくつかのクールなことを行っているため、次のようなことを行いました。

..に変換

しかし、それは私に起こりました.. JavaScriptをオフにすると、メソッドはもうDELETEではなく、期待どおりGETです。data-これらの属性を適切に劣化させて、そのリンクが DELETE 要求のままになるようにする計画はありますか、または何らかの方法がありますか?

私のRailsアプリケーション（すべて2.3.5）は、インラインjavascript、rjs、プロトタイプ、jqueryを完全に組み合わせて使用​​しています。それを学習または成長痛と呼びましょう。最近、私は控えめなJavaScriptにますます夢中になっています。cssがクリーンアップしたのと同じように、htmlがクリーンになります。

しかし、私が見たほとんどの例は小さな例であり、それらはすべてのjavascript（jquery）をapplication.js内に配置します

今、私はかなり大きなアプリケーションを持っています、そして私は私のjsを構造化する方法を考えています。どういうわけか、スクリプトがまだビューに近いのが好きなので、次のようなことを考えています。

ここで、orders.jsには、そのビューに固有の控えめなJavaScriptが含まれています。しかし、多分それは私があまりにも保守的であるだけです:)

私はこことここでこの問題についてのイェフダ・カッツによるいくつかの投稿を読みました。そこで彼はこの問題に取り組んでいます。それはあなたのjsファイルを調べて、あなたのビューに関連するものだけをロードします。しかし、残念ながら、現在の実装を見つけることができません。

だから私の質問：

• 控えめなJavaScriptをどのように最適に構成しますか。コードを管理します。HTMLから何かが何をすべきかが明らかであることをどのように確認しますか。良いクラス名は大いに役立つと思います:)
• どのようにファイルを配置し、それらをすべてロードしますか？少しだけ？関連するスクリプトをロードするために、content_for :scriptまたはビューで使用しますか。javascript_include_tagまたは ... ？
• 非常に一般的な関数（削除など）をパラメーター（属性を追加しますか？）を使用して記述しますか、それとも非常に特殊な関数（DRY？）を記述しますか。Rails 3には標準セットがあり、すべてが邪魔にならないことを私は知っています。しかし、Rails 2.3.5で開始するにはどうすればよいですか？

つまり、Railsで控えめなJavaScriptを実行するためのベストプラクティスは何ですか？:)

ベスト プラクティスに従うために、使用しているデバイスに応じて適切な JavaScript/jQuery イベントを使用しようとしています。たとえば、onclick または touch イベントを持つタグを持つモバイル サイトを構築しています。iPhone の場合は、「touchstart」イベントを使用します。そのハンドラーをオブジェクトにバインドする前に、デバイスが「touchstart」をサポートしているかどうかをテストしたいと思います。そうでない場合は、代わりに「onclick」をバインドします。

これを行う最善の方法は何ですか？

私はこれに何時間も取り組んできましたが、うまくいきません。Scriptaculous の Effects ライブラリを使用して ToggleJS を機能させようとしています。具体的には、例: http://wiseheartdesign.com/page_attachments/0000/0075/demo.html .

new.html と呼ばれる純粋な html ファイルを使用して、美しく動作するようにしました。それから new.html.erb に変換して、いくつかのアニメーションを自分の Rails プロジェクトに組み込むことができるようにしましたが、動作しなくなりました!

HTML タグと Ruby JavaScript タグの両方を試しましたが、どちらも機能しません。次に例を示します。

ページの本文はブラウザに表示されていますが、アニメーションはありません。私は自分の JavaScript ファイルがデモと同じであることを確認しました (さらに、html ファイルはとにかく動作しています)。私の .erb ファイルのどこに問題があるか知っていますか?

私が使用しているhtmlのサンプル：

エイマンタス、私はまったくの初心者です。HTMLドキュメントに次を追加しましたが、機能しませんでした：

これがあなたの言いたいことですか、それとも .html.erb ファイルにどのコードを書く必要があるか教えてもらえますか?

多くのレコード（注文）を含むビューで目立たない切り替えを使用しています。個々のdivで機能するようになりましたが、各Orderが独自のトグルリンクを使用してループ内で個別に拡張/縮小できるように機能させたいと思います（リンクもループされます）。

拡張可能なdivがxと呼ばれる場合、問題は、トグルボタンのすべてのループが、それ自体の反復でdivではなく最初のdivを切り替えるだけです-最善の方法は、各拡張可能なセクションの識別子にorder_idを使用することだと思いますか？

より経験豊富な視聴者はこれを笑うかもしれません:)しかし私は次のようなコードで遊んでみました：

ご覧のとおり、これらの各ループ内には、トグルできるようにしたいサブセクションがいくつかあります。拡張可能なループdiv内で複数のdivを切り替えることができる必要がある場合、ソリューションはどのように変わりますか？これは、メインのトグルdivをorder.idとして参照する場合、複数の内部divを参照する方法がわからないためです。これは明らかにメインの問題によるものです。