您好我正在寻找邮政编码查询(英国)的帮助。
我一直试图让这个工作一段时间。基本上我喜欢Ideal Postcode Jquery方面,但我想让它与我的表单一起工作。任何人都可以推荐一些适用于英国地址的东西。
或者也许建议我如何让这个工作?如将结果保存到类delivery_addres1,2,3等。
.col-md-8
.panel.panel-default
.panel-heading
%h3.panel-title Delivery Address:
%span.pull-right.clickable
%i.glyphicon.glyphicon-chevron-up
.panel-body
%h2 To place a new order we require some additional information please fill that in below:
= simple_form_for @order do |f|
= f.input :delivery_name, :label => 'Delivery recipient full name', :required => true
%p
= f.input :company_name
%p
= f.input :delivery_address1, :label => 'Address line 1'
%p
= f.input :delivery_address2, :label => 'Address line 2'
%p
= f.input :delivery_address3, :label => 'Address line 3'
%p
= f.input :delivery_city, :label => 'City', :required => true
%p
#postcode_lookup_field
:javascript
$('#postcode_lookup_field').setupPostcodeLookup({
// Set your API key
api_key: 'apikey',
// Pass in CSS selectors pointing to your input fields to pipe the results
output_fields: {
delivery_address1: '#first_line',
delivery_address2: '#second_line',
delivery_address3: '#third_line',
delivery_city: '#post_town',
delivery_postcode: '#postcode'
}
});
%p
= f.input :delivery_postcode, :label => 'postcode', :required => true
%p
= f.input :phone, :label => 'Contact/phone number', :required => true, :limit => 12
%p
= f.input :description_content, :label => 'Description of contents.'
%br
= f.input :restricted_items, :label => 'I have read and agree to the restricted item list.', :required => true, :input_html => { :checked => true }
%br
= f.input :terms_conditions, :label => 'I agree to the T&C.', :class => 'checkbox', :required => true, :input_html => { :checked => true }
%br
= f.input :insurance, :label => 'If in need of insurance tick this box'
%br
= f.input :contents_value, :label => 'Estimated value', :limit => 12, :hint => "Should be in Pounds."
%p
/ = f.input :cf_reference, :label => 'Consignment reference', :hint => 'This will be automatically entered'
%p
= f.input :service, :label => 'Service Level', :required => true, :as => :select, :collection => [['DMS Express', 'DMS Express'], ['DMS 10.00', 'DMS 10.00'], ['DMS 12.00', 'DMS 12.00'], ['DMS Saturday & Sunday', 'DMS Saturday & Sunday']]
%p
= f.input :reference_number
%p
= f.button :submit, :class => 'btn-primary'
:css
.panel-heading span {
margin-top: -20px;
font-size: 15px;
}
.row {
margin-top: 40px;
padding: 0 10px;
}
.clickable {
cursor: pointer;
}
:javascript
jQuery(function ($) {
$('.panel-heading span.clickable').on("click", function (e) {
if ($(this).hasClass('panel-collapsed')) {
// expand the panel
$(this).parents('.panel').find('.panel-body').slideDown();
$(this).removeClass('panel-collapsed');
$(this).find('i').removeClass('glyphicon-chevron-down').addClass('glyphicon-chevron-up');
}
else {
// collapse the panel
$(this).parents('.panel').find('.panel-body').slideUp();
$(this).addClass('panel-collapsed');
$(this).find('i').removeClass('glyphicon-chevron-up').addClass('glyphicon-chevron-down');
}
});
});
答案 0 :(得分:0)
所以对此感兴趣的人都是我做的。
添加现有的课程 ,:input_html => {:id => “first_line”}
first_line ect是jQuery postcode finder建立的id。 这样它会自动放入插件找到的字段。
示例
%p
= f.input :delivery_address1, :input_html => { :id => "first_line" }, :label => 'Address line 1'