Я новичок rails, пытающийся создать приложение для управления переводами наборов меток с использованием Rails 3. Я не слишком зашел слишком далеко за леса, насколько я знаю, я использую javascript-библиотеки Rails 3 по умолчанию прототип, а не jQuery).Как сделать javascript в моей Rails 3 форме ненавязчивой?
У меня есть форма для имен наборов наклеек, а желаемое поведение - имена всех текущих наборов меток, которые будут заполнены в раскрывающемся списке ("label_sets"
), а когда вы выберете один, он заполняет текстовое поле :name
($('label_set_name')
) и отключает его. Если в раскрывающемся списке отображается значение :include_blank
, можно ввести новое имя набора меток. Когда форма отправляется, текстовое поле :name
снова включается, поэтому его значение будет фактически сохранено.
Эта форма выполняет желаемое поведение, но я думаю, что должен быть способ рефакторинга javascript в :onsubmit
и :onchange
в другой файл (ы) и сделать его ненавязчивым. Я просмотрел веб-материал для создания ненавязчивого javascript в Rails 3, но его честно смутили многие и не знаю, как применить его к моему делу. Может ли кто-нибудь предложить какие-либо предложения? Сокращенный источник для моего ярлыка установленной формы ниже:
# app/views/label_sets/_form.html.erb
<%= form_for(@label_set,
:html => { :onsubmit => "$('label_set_name').enable();" }) do |f| %>
# ...
<div class="field">
<%= label "label_sets", t('.label_set') %><br />
<%= select_tag("label_sets",
options_for_select(LabelSet::NAMES),
{ :include_blank => t('.new'),
:onchange => "if (this.value.empty()) {
$('label_set_name').clear();
$('label_set_name').enable();
} else {
$('label_set_name').value = this.value;
$('label_set_name').disable();
}" }) %><br />
</div>
<div class="field">
<%= f.label :name %><br />
<%= f.text_field :name %>
</div>
# ...
<% end %>
Update: Так что я думаю, что решить мою проблему, или, по крайней мере, получил мой взгляд вид глядя чище, принимая все JavaScript, и начинка его в application.js
(и написал это в jQuery, чтобы попробовать что-то новое).
Новый вид формы выглядит следующим образом:
# app/views/label_sets/_form.html.erb
<%= form_for(@label_set) do |f| %>
# ...
<div class="field">
<%= label "label_sets", t('.label_set') %><br />
<%= select_tag("label_sets",
options_for_select(LabelSet::NAMES),
{ :include_blank => t('.new') }) %><br />
</div>
<div class="field">
<%= f.label :name %><br />
<%= f.text_field :name %>
</div>
# ...
<% end %>
Новый application.js
выглядит следующим образом:
# public/javascripts/application.js
$(function() {
$('.new_label_set, .edit_label_set').submit(function() {
if ($('#label_set_name').attr('disabled') == true) {
$('#label_set_name').removeAttr('disabled');
}
});
$('#label_sets').change(function() {
if ($(this).val() == '') {
$('#label_set_name').val('');
$('#label_set_name').removeAttr('disabled');
} else {
$('#label_set_name').val($(this).val());
$('#label_set_name').attr('disabled', true);
}
});
});