#javascript #jquery #ruby-on-rails
#javascript #jquery #ruby-on-rails
Вопрос:
У меня есть следующая функция, которая должна вызываться после формы, которую я отправил (этот метод в моем application.js папка в моем приложении rails):
var addToTopics = function() {
var result = "";
var checkedTopics = $(".topic-checkbox:checked");
$.each(checkedTopics, function(i, topic) {
if(i == 0) {
result = result $(topic).attr('value');
}
else {
result = result ", " $(topic).attr('value');
}
});
return resu<
};
$("#new_comment").submit(function() {
var ListOfTopics = addToTopics();
$('#comment_topics').val(ListOfTopics);
alert($('#comment_topics').val());
return true;
});
HTML
<form method="post" id="new_comment" class="new_comment" action="/comments" accept-charset="UTF-8"><div style="margin:0;padding:0;display:inline"><input type="hidden" value="✓" name="utf8"><input type="hidden" value="8vLhtuco TAkeB 9kQ0gERvA54BD/BnjJuguWxuXWHQ=" name="authenticity_token"></div>
<div class="field">
<label for="comment_comment">Comment</label>
<br>
<textarea rows="20" name="comment[comment]" id="comment_comment" cols="40"></textarea>
</div>
<div class="field">
<input type="hidden" value="28" name="comment[review_id]" id="comment_review_id">
</div>
<div class="field">
<input type="hidden" value="1" name="comment[user_id]" id="comment_user_id">
</div>
<div class="field">
<input type="hidden" value="" name="comment[topics]" id="comment_topics">
</div>
<div class="actions">
<input type="submit" value="Create Comment" name="commit" id="comment_submit">
</div>
</form>
Но, похоже, это не вызывается, так как предупреждение dosent даже отключается, когда я отправляю свою форму.
Есть идеи, почему? Спасибо
Комментарии:
1. не могли бы вы, пожалуйста, опубликовать свой html-файл, а также функцию addToTopics().
2. @Sean Пожалуйста, опубликуйте отрисованный HTML-код, а не исходный код.
3. Есть ли у вашей кнопки отправки name =’отправить’? Это нарушило бы работу вашего метода submit().
4. можете ли вы опубликовать свой html-код, связанный с приведенным ниже кодом $ («#new_comment») // new_comment html, пожалуйста
5. Добавлен отрисованный HTML-код
Ответ №1:
Вам нужно убедиться, что код, подключающий прослушиватель, запускается после того, как форма была отображена в dom. это один из способов сделать это:
$(function() {
$("#new_comment").submit(function() {
var ListOfTopics = addToTopics();
$('#comment_topics').val(ListOfTopics);
alert($('#comment_topics').val());
return true;
});
});
Комментарии:
1. Отлично сработало, спасибо! Могу я просто попросить вас объяснить, что происходило раньше и как это теперь исправлено, добавив
$(function(){....}
пожалуйста, если вы не возражаете? Спасибо2. Добавляя оболочку $(function() {}), вы указываете jQuery выполнять код только после завершения загрузки всей страницы. В тот момент, когда будет выполнен $ («#new_comment»), он сможет его найти.
Ответ №2:
был ли добавлен элемент с идентификатором new_comment в dom до того, как вы запустили $(«#new_comment»).submit(функция(){…});
Если нет, то $ («#new_comment») не вернет никаких выборок, и jquery автоматически завершится ошибкой.
Комментарии:
1. Если я правильно понимаю ваш вопрос, то да, я уверен, что он был загружен раньше. Как еще я мог бы отправить форму, если она еще даже не отправлена?
2. Думаю, теперь я понимаю, что вы имеете в виду, запускается ли файл javascript до того, как форма комментария появится в dom? Я думаю, что это так, могу ли я гарантировать, что функция subit загружается только после загрузки документа?
Ответ №3:
вчера у меня была такая же проблема, моя проблема заключалась в несвязанной ошибке javascript на странице добавить простое предупреждение над этой строкой
$("#new_comment").submit(function() {
для проверки (или проверьте консоль js вашего браузера)
Ответ №4:
Попробуйте изменить $ («#new_comment»).submit(функция() на $ («#comment_form»).submit(функция(), из того, что я вижу в вашем коде, эти два селектора не совпадают. Надеюсь, это поможет. Приветствия
И поскольку у вас в форме есть атрибут action «action = ‘/Comment'», либо удалите его, если у вас нет веской причины, по которой он у вас есть, либо предотвратите поведение по умолчанию, которое заставит форму перенаправлять на ваш текущий URL /Comment
Таким образом, код будет выглядеть следующим образом :
$("#comment_form").submit(function(evt) {
evt.preventDefault();
// rest of function below
});
Комментарии:
1. Я пытался присвоить ему значение $ («#comment_form»), но все еще не работает. Однако я не понимаю, что вы имеете в виду под действием?