Hw do i render a partial in rails 3.0 using ajax, on radio button select?

问题

I try a bit of ajax first time but did not get success, i want to render a partial on radio button select using ajax, here is my code :

My script.js:

$(document).ready(function(){
$.ajax({
  url : "/income_vouchers/income_voucher_partial?$('form input[type=radio]:checked').val()="+$('form input[type=radio]:checked').val(),
  type: "GET",
  data: { 
        type: $('form input[type=radio]:checked').val() 
      }
});

 });

income_voucher.js.erb

$("#payment_mode").append('  

     <% if params[:type]== 'cheque' %> 
         <%= escape_javascript render :partial => "cheque" %>
     <% elsif params[:type]=='card' %> 
          <%= escape_javascript render :partial => "card" %>
     <% elsif params[:type]=='ibank'%> 
         <%= escape_javascript render :partial => "ibank" %>
      <% else params[:type] == 'cash' %>
    <% end %>
');

My from:

<script type="text/javascript" src="/javascripts/voucher.js"></script>
<%= form_for(@income_voucher) do |f| %>
  <%= render 'shared/form_error', :object => @income_voucher %>
 <div >   
            <%= radio_button_tag :transaction_type,'cash', :checked => true %>
            <%= f.label :transaction_type, "Cash", :value => "cash" %>
            <%= radio_button_tag :transaction_type,'cheque' %>
            <%= f.label :transaction_type, "Cheque", :value => "cheque" %>
            <%= radio_button_tag :transaction_type,'card'%>
            <%= f.label :transaction_type, "Card", :value => "card" %>
            <%= radio_button_tag :transaction_type,'ibank'%>
            <%= f.label :transaction_type, "Internet Banking", :value => "ibank" %>
          </div>
      <div id = "payment_mode">
          <% if params[:type]== "cheque" %> 
                <%= render :partial => "cheque", :f => f %> 
          <% elsif params[:type]=='card' %> 
                <%= render :partial => "card", :f => f %>
          <% elseif params[:type] == 'ibank'%> 
              <%= render :partial => "ibank", :f => f %>
          <% else params[:type] == 'cash' %> 
       <% end %>
     </div>
  <%= f.submit %>
<% end %>

and here is my controller method:

 class IncomeVouchersController < ApplicationController
def new
    @income_voucher = IncomeVoucher.new
    @invoices = current_company.invoices
    @income_voucher.build_payment_mode

    respond_to do |format|
      format.html # new.html.erb
      format.xml  { render :xml => @income_voucher }
    end
  end
 def create
    @income_voucher = IncomeVoucher.new(params[:income_voucher])

   transaction_type = params[:transaction_type]
    payment_mode = nil
    if transaction_type == 'cheque'
      payment = ChequePayment.new(params[:cheque_payment])
    payment.amount = @income_voucher.amount
    elsif transaction_type == 'card'
      payment = CardPayment.new(params[:card_payment])
    payment.amount = @income_voucher.amount
    elsif transaction_type == 'ibank'
      payment = InternetBankingPayment.new(params[:internet_banking_payment])
    payment.amount = @income_voucher.amount
    else
      payment = CashPayment.new
    payment.amount = @income_voucher.amount
    end
    payment_mode = PaymentMode.new
    payment_mode.transactionable = payment

    @income_voucher.payment_mode = payment_mode
    respond_to do |format|
      if @income_voucher.save

        format.html { redirect_to(@income_voucher, :notice => 'Income voucher was successfully created.') }
        format.xml  { render :xml => @income_voucher, :status => :created, :location => @income_voucher }
      else

        format.html { render :action => "new" }
        format.xml  { render :xml => @income_voucher.errors, :status => :unprocessable_entity }
      end
    end

   def income_voucher_partial
       @payment_mode = PaymentMode.new(params[:payment_mode])
  end 
 end

i can see my view form but when select a radio button nothing is rende. Any help would be appreciated

回答1:

First of all: choose the method - or you using remote form, or ajax submit. If your want that user choose radio button AND click submit to render use in .html.erb:

form_for(@income_voucher, :remote => true)

remove javascript ajax and change param name in .js.erb to :transaction_type

If you want that user choosse radio button and immidiately render move javascript ajax to radio button change event handler like this

$(your_element).change(function(){
  $.ajax(){
    url : "/income_vouchers/income_voucher_partial",
    data: { 
      type: $('form input[type=radio]:checked').val() 
    }
  }
});

and remove params setting from directly url - set params in 'data:'

回答2:

in my js.erb file i did this

$(".gradeU").remove();
    $("#abcd").after(  

    '<%= escape_javascript render :partial => params[:payment] unless params[:payment] == 'cash' %>'
    );

and in my script :

$(document).ready(function(){
$("#check").click(function(){

 var payment = $('form input[type= radio]:checked').val()

 console.debug(payment); 

 $.ajax({

   type: 'GET',

   url : "/income_vouchers/income_voucher_partial?payment="+payment,

 });

 });
 });

and i did not render same code in form, thanks

来源：https://stackoverflow.com/questions/10810817/hw-do-i-render-a-partial-in-rails-3-0-using-ajax-on-radio-button-select