CODEWITHSUNDEEP
javascriptjqueryruby-on-railsruby
Raafat Hamzeh
Raafat Hamzeh

Reputation: 25

How to pass html values in Ruby within a Javascript function

I have a view page, where the user inputs a number and clicks on generate to get a form in the same page based on this input. So I'm using javascript in my main view:

 <div class="label-field-pair"><%= "#{t('total')} #{t('amount')}" %>:
    <%= form.text_field :total, :value =>precision_label(@total_pay.to_f)  , :disabled=> true , :id=>'total' %></div>


      <div class="label-field-pair">
        <label for="student_grade"><%= t('no_payments') %><span class="necessary-field">*</span> </label>
        <input type="number" min="1" max="12" step="1" value="1" name="no_payments" id="no_payments">      </div>
       <%= form.hidden_field :no_payments, :id=>'payments' %>
       <%= form.hidden_field :total_pay, :id=>'total_pay' %>

    <%#= submit_tag "", :value => "► #{t('generate')}", :class => "submit_button", :disable_with => "► #{t('please_wait')}" %>
    <%#= render :partial => 'distribute_payments', :locals => {:no_payments=>2, :total => 30000 , :guardian=>@guardian.id} %>
    <button type="button" id="gen" onClick="generate()" style="display: block">Generate</button>
    <div id="payments_distribute"></div>
   <%end%>



  <script type="text/javascript">

       function generate() {


          var t = document.getElementById("total").value;
          var n = document.getElementById("no_payments").value;
          j('#total_pay').val("<%= @total_pay %>");
         document.getElementById("gen").style.display = "none";

          <%="#{remote_function(:url => {:action => "distribute_payments", :id=>@guardian.id,:total_pay=>@total_pay}

          )}"%>
      }



  </script>

And this is the action for my partial view:

  def distribute_payments
    @total_amount=params[:total]
      @no_payments=params[:no_payments]
      @total_payment=params[:total_pay]
     @guardian = Guardian.find(params[:id])
    @students=Student.find_all_by_sibling_id(@guardian.ward_id)

      render(:update) do |page|
            page.replace_html 'payments_distribute', :partial=>'distribute_payments', :total_pay=>@total_payment, :no_payments=>@no_payments
         end
  end

The problem here is that I need to pass the value of "no_payments" with the parameters to my partial view, and I don't know how to do this from my Javascript function (remote_function). I was trying to use render_partial with a submit button, but I wasn't able to open the partial view in the same page. You can check my question here: Rails: Render Partial from controller

Upvotes: 0

Views: 1044

Answers (1)

user3640056
user3640056

Reputation: 732

You need to use Ajax:

  <script type="text/javascript">

       function generate() {


          var t = document.getElementById("total").value;
          var n = document.getElementById("no_payments").value;
          var id="<%= @guardian.id %>"
          j('#total_pay').val("<%= @total_pay %>");
         document.getElementById("gen").style.display = "none";


                 j.ajax({
      type: 'POST' ,
      url: '<%=  url_for :action => "distribute_payments" %>',
      data : {
        'no_payments' :n,
        'total_payment' :t,
        'id' :id
      },
      beforeSend : function() {
      },
      success : function() {
        j("#payments_distribute").html(data)
      }});
      }



  </script>

Upvotes: 1

Related Questions