0

この問題について既に議論している複数のスレッドがここにあることは知っていますが、これまでに投稿された提案のどれも解決につながっていません。だから、私は自分自身を投稿します。基本的に、私のページの 1 つで実行するように設定された JavaScript 関数があります。ページが更新されるまで機能しません。私の理解では、問題は ajax がページをロードする方法と関係があるということですか?

私が試したこと：

  • ユーザーが最初に目にするフロントページのレイアウトにスクリプトコードを追加する
  • それがうまくいかないときは、サイトが使用する 3 つのレイアウトすべてにスクリプト コードを追加します。
  • この特定のレイアウトの本文にスクリプトを追加します。

コードは以下です。事前にすべての助けに感謝します!

これはレイアウトのコードです:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <title>RENT</title>
  <%= stylesheet_link_tag    "application", :media => "all" %>
  <%= javascript_include_tag :application %>
  <%= csrf_meta_tags %>
  <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
  <%= stylesheet_link_tag "my.css" %>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  <script src="https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
  <%= javascript_include_tag "my.js" %>
        <script src="/assets/jquery.maskMoney.js" type="text/javascript"></script>

  <!-- THIS IS THE FUNCTION I NEED HELP WITH! -->
  <script type="text/javascript">
    $(function(){
        $("#paymentAmount").maskMoney({symbol:'$ '});
    })
    </script>
</head>
<body>

    <div data-role="page" data-theme="b" id="page4">
          <div data-theme="b" data-role="header">
              <a data-role="button" data-theme="b" href="/home"
               data-icon="back" data-iconpos="left" class="ui-btn-left">
                  Back
              </a>
              <a id="settings" data-role="button" data-inline="true" data-theme="b"
               href="#page9" data-icon="gear" data-iconpos="notext" class="ui-btn-right">
              </a>
              <h3>
                  Pay Rent
              </h3>
          </div>

        <%= content_tag(:div, flash[:error], :id => "flash_error") if flash[:error] %>
        <%= content_tag(:div, flash[:notice], :id => "flash_notice") if flash[:notice] %>
        <%= content_tag(:div, flash[:alert], :id => "flash_alert") if flash[:alert] %>

        <%= yield %>

        <div data-theme="a" data-role="footer" data-position="fixed">
              <h1>
                  © 2013
              </h1>
          </div>
      </div>

</body>
</html>

これはコントローラーのコードです。

<!-- Pay Rent (R) -->
  <div data-role="content" style="padding: 10px">
    <%= form_for(@rentPayment, :url => { action: "create" }) do |f| %>z
      <div data-role="fieldcontain">
        <fieldset data-role="controlgroup" data-mini="true">
        <label for="paymentAmount"> Payment Amount </label>
        <input name="rentPayment[paymentAmount]" id="paymentAmount" placeholder="$ 0.00" value="" type="text">
        </fieldset>
      </div>
      <div data-role="fieldcontain">
        <fieldset data-role="controlgroup" data-mini="true">
        <label for="paymentDate"> Pay on this date </label>
        <input name="rentPayment[paymentDate]" id="paymentDate" placeholder="" value="" type="date">
        </fieldset>
      </div>
      <input type="submit" data-theme="b" value="Submit Payment" data-mini="true">
    <% end %>
  </div>

編集されたレイアウト ページ

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <title>RENT</title>
  <%= stylesheet_link_tag    "application", :media => "all" %>
  <%= javascript_include_tag :application %>
  <%= csrf_meta_tags %>
  <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
  <%= stylesheet_link_tag "my.css" %>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  <script src="https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
  <%= javascript_include_tag "my.js" %>
        <script src="/assets/jquery.maskMoney.js" type="text/javascript"></script>

  <!-- THIS IS THE FUNCTION I NEED HELP WITH! -->
 <script type="text/javascript">
    $(document).on('pageshow', '#page4', function () { $("#paymentAmount").maskMoney({symbol:'$ '}); });
    <!--$(document).ready(function(){$("#paymentAmount").maskMoney({symbol:'$ '});})-->
  </script>
</head>
<body>

    <div data-role="page" data-theme="b" id="page4">
          <div data-theme="b" data-role="header">
              <a data-role="button" data-theme="b" href="/home"
               data-icon="back" data-iconpos="left" class="ui-btn-left">
                  Back
              </a>
              <a id="settings" data-role="button" data-inline="true" data-theme="b"
               href="#page9" data-icon="gear" data-iconpos="notext" class="ui-btn-right">
              </a>
              <h3>
                  Pay Rent
              </h3>
          </div>

        <%= content_tag(:div, flash[:error], :id => "flash_error") if flash[:error] %>
        <%= content_tag(:div, flash[:notice], :id => "flash_notice") if flash[:notice] %>
        <%= content_tag(:div, flash[:alert], :id => "flash_alert") if flash[:alert] %>

        <%= yield %>

        <div data-theme="a" data-role="footer" data-position="fixed">
              <h1>
                  © 2013
              </h1>
          </div>
      </div>

</body>
</html>
4

0 に答える 0