1

JQuery ダイアログでモーダル フォームをレンダリングしたいと考えています。私はScaffoldの生成中に作成された既存のフォームを利用しました。現在、html ボタンではなくダイアログ ボタンを使用してフォームを送信する際に問題が発生しています。

以下のフォームは、ボタンをクリックすると JQuery ダイアログに表示されます。(足場によって生成)

<%= form_for(@user, :remote=>true) do |f| %>
  <% if @user.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@user.errors.count, "error") %> prohibited this user from being saved:</h2>

      <ul>
      <% @user.errors.full_messages.each do |msg| %>
        <li><%= msg %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <div class="field">
    <%= f.label :user_name %><br />
    <%= f.text_field :user_name %>
  </div>
  <div class="field">
    <%= f.label :email %><br />
    <%= f.text_field :email %>
  </div>
  <div class="field">
    <%= f.label :password %><br />
    <%= f.text_field :password %>
  </div>
  <div class="field">
    <%= f.label :account_type %><br />
    <%= f.text_field :account_type %>
  </div>
  <div id="submit-button" class="actions">
    <%= f.submit %>
  </div>
<% end %>

現在、送信ボタンを JQuery 関数に変更したいと考えています。次のコードを JQuery のボタンに追加します。

  <div id="submit-button" class="actions">
    <%= f.submit %>
  </div>

これは、モーダル フォームの Jquery コードです。

   $( "#form" ).dialog({
        autoOpen: false,
        height: 400,
        width: 350,
        modal: true,
        closeOnEscape: true,
        resizable:false,
        buttons: {
            "Create an account": function() {
                    $("#form").submit();
                    $( this ).dialog( "close" );
            },
            Cancel: function() {
                $( this ).dialog( "close" );
            }
        }
    });

したがって、本質的には、それを変更することです

  <div id="submit-button" class="actions">
    <%= f.submit %>
  </div>

のようなものに

  $("#form").submit();

私はそれを行う際にいくつかの問題に直面しています.参照に関係している可能性があると思いますが、それを変更する方法がわかりません. アドバイスをいただければ幸いです。

4

0 に答える 0