2012-05-13 3 views
1

Следующая строка генерируется JQuery в DOM, когда пользователь щелкает, чтобы сделать рейтинг 5 звезд:Jquery Raty звезда рейтинг по форме Rails

<input type="hidden" name="review[answer01]" id="review_answer01" value="5"> 

Как-то мой контроллер не подбирая это значение для Params [: review] [: answer01]

Мне кажется, что когда я нажимаю кнопку отправки, скрытое значение не отправляется вообще. Форма не знает о скрытом поле, потому что ее нет в начале? Как это исправить.

Все работает отлично с помощью простой кнопки выбора радио.

BTW Я вручную добавил ту же строку кода в свою форму, и это сработало. Я поставил

<%= f.hidden_field :answer01, :value => 5 %> 

который произвел HTML:

<input id="review_answer01" name="review[answer01]" type="hidden" value="5"> 

Я просто не понимаю ...

EDIT:

Вот источник JS Вот это JS: https://github.com/wbotelhos/raty/blob/master/js/jquery.raty.js

Входные теги генерируются строкой 62, которую я слегка изменил, чтобы дать идентификатор (Я не был уверен, что это проблема).

Моя линия 62: self.score = $('<input />', { type: 'hidden', name: self.opt.scoreName, id: self.opt.scoreId}).appendTo(self);

Я также добавил scoreID : 'blank' в $.fn.raty.defaults {}, чтобы обеспечить возможность установить идентификатор.

Теперь внутри мой взгляд у меня есть:

<table class='table'> 
    <tbody> 

    <%= simple_form_for @review, :html => { :multipart => true } do |f| %> 

    <td style='width:115px; padding-top:10px;'><div id="s1"></td> 
    <td><h3 style = 'padding-bottom:3px;'><%= @questions[0] %></h3></td> 

    [...] (repeated for other questions) 

    </tbody> 
</table> 

    <div style='margin-left:80px; margin-top:20px; margin-bottom:200px;' id='subbut'> 
    <%= f.button :submit, "Submit Review", :class=>'btn btn-large' %> 
    </div> 
    <% end %> 

<script> 
$('#s1').raty({ 
    scoreName : 'review[answer01]', 
    scoreId : 'review_answer01' 
}); 
</script> 

То, что я вижу в Firebug анализа DOM с 5/5 звезды выбранной:

<td style="width:115px; padding-top:10px;"> 
<div id="s1" style="cursor: pointer; width: 100px; "> 
    <img src="/assets/star-on.png" alt="1" title="bad">&nbsp; 
    <img src="/assets/star-on.png" alt="2" title="poor">&nbsp; 
    <img src="/assets/star-on.png" alt="3" title="regular">&nbsp; 
    <img src="/assets/star-on.png" alt="4" title="good">&nbsp; 
    <img src="/assets/star-on.png" alt="5" title="gorgeous"> 
    <input type="hidden" name="review[answer01]" id="review_answer01" value="5"> 
</div> 
</td> 

ФОРМА TAG:

<form accept-charset="UTF-8" action="/reviews" class="simple_form new_review" enctype="multipart/form-data" id="new_review" method="post" novalidate="novalidate"></form> 
+0

Это кажется хорошо, мы могли бы иметь JS, что делает его и/или окружающая форма HTML? –

ответ

1

Ваша структура HTML неправильная ... Посмотрите:

<table class='table'> 
    <tbody> 

    <%= simple_form_for @review, :html => { :multipart => true } do |f| %> 

    <td style='width:115px; padding-top:10px;'><div id="s1"></td> 
    <td><h3 style = 'padding-bottom:3px;'><%= @questions[0] %></h3></td> 

    [...] (repeated for other questions) 

    </tbody> 
</table> 

    <div style='margin-left:80px; margin-top:20px; margin-bottom:200px;' id='subbut'> 
    <%= f.button :submit, "Submit Review", :class=>'btn btn-large' %> 
    </div> 
    <% end %> 

form начинается внутри стола, но заканчивается снаружи. это приведет к анализу HTML, поскольку он не включает все input и некоторые общие странности, потому что браузер не может понять, что вы имели в виду.

Кстати, используя HAML бы обойти такого рода проблемы, но каждому свое :)

+0

Приятно, у меня была другая строка вне формы, которая семантически там не принадлежала .. поэтому таблица началась раньше. Однако теперь у меня есть это в форме, и все работает нормально. Спасибо Феликс! – Abram

+0

Ну, чтобы быть педантом, стол не семантически нигде не стоит здесь :) –

+1

Все, но твитерские бутстрапы делают формы такими хорошими! – Abram