jQuery with Rails


#1

In a nutshell, my jQuery code in a rails form works in Firefox, but not
in Internet Explorer 7. Here is the form code with unnecessary details
stripped out:

New Discount Order

<%= error_messages_for :discount_order %> <% vertical_form_for :discount_order, @discount_order, :url => discount_orders_path, :method => :post do |f| %> <% f.radio_button_group :code_type, :label => 'Code Type', :id => 'ctype' do %> <%= f.radio_button :code_type, 'voucher', :label => 'Single-use vouchers', :button_on_left => true %>
<% if @who == 'partner' %> <%= f.radio_button :code_type, 'affiliate', :label => 'Multi-use affiliate', :button_on_left => true %> <% end %> <% end %> <%= f.text_field :requested_codes, :size => 2, :label => "How Many Codes", :help => 'Number of codes to generate. Only applies to single-use codes.'%> <% f.wide_content :id => 'has_expiration_date' do %> <%= check_box_tag :has_expiration_dates, '1', !@discount_order.codes_expire_at.blank? %>Codes Expire? <% end %> <%= f.date_field :codes_expire_at, :label => 'Expiration Date', :disabled => @discount_order.codes_expire_at.blank? %> <%= f.submit 'Create', :cancel => {:controller => 'system', :action => 'discounts'}%> <% end %>

Does anyone know a cross platform (Firefox and IE) solution to above?

Thanks for your time.

Bharat


#2

The problem is solved. I changed the “change” event to “clicked” event
as shown below:

jQuery(function(){
jQuery(’#has_expiration_date input’).change(function(){
jQuery(’#discount_order__codes_expire_at’).attr(‘disabled’,
!jQuery(’#discount_order__codes_expire_at’).attr(‘disabled’))
});
jQuery(’#ctype’).clicked(function(){ <------ changed from “change”
event
jQuery(’#discount_order__requested_codes’).attr(‘disabled’,
!jQuery(’#discount_order__requested_codes’).attr(‘disabled’));
if (jQuery(’#discount_order__code_type_affiliate:checked’).val() ==
‘affiliate’) {
jQuery(’#discount_order__requested_codes’).val("")
}
})
})

I got this tip from the jQuery in Action book written by Bear Bibeault
and Yehuda K… They document it on page 114. Thank you gentlemen.

One thing that I am learning as a new Javascript/jQuery developer is
that not everything works in a cross-platform manner even in a
supposedly cross-browser library as jQuery.

Bharat


#3

Bharat R. wrote:

The problem is solved. I changed the “change” event to “clicked” event
as shown below:

jQuery(function(){
jQuery(’#has_expiration_date input’).change(function(){
jQuery(’#discount_order__codes_expire_at’).attr(‘disabled’,
!jQuery(’#discount_order__codes_expire_at’).attr(‘disabled’))
});
jQuery(’#ctype’).clicked(function(){ <------ changed from “change”
event
jQuery(’#discount_order__requested_codes’).attr(‘disabled’,
!jQuery(’#discount_order__requested_codes’).attr(‘disabled’));
if (jQuery(’#discount_order__code_type_affiliate:checked’).val() ==
‘affiliate’) {
jQuery(’#discount_order__requested_codes’).val("")
}
})
})

I got this tip from the jQuery in Action book written by Bear Bibeault
and Yehuda K… They document it on page 114. Thank you gentlemen.

One thing that I am learning as a new Javascript/jQuery developer is
that not everything works in a cross-platform manner even in a
supposedly cross-browser library as jQuery.

Bharat

mostly try to avoid Jquery.
if you Jquery some functions prototype won’t work.
I have faced this problem earlier.