Как заставить событие JS onpaste работать с формой Rails?
У меня есть форма поиска, и я хотел бы, чтобы при вставке чего-либо в форму она автоматически отправляла форму. Я также хотел бы сохранить функциональность, поэтому, если я не вставляю что-то, а скорее набираю это вручную, мне нужно нажать кнопку ввода/поиска, чтобы это сработало.
Вот моя форма:
<h1 class = "CustomerTitle">Search Tool</h1>
<%= form_with url: "/support/search_res", class: "form", method: :get do |form| %>
<%= form.text_field :query, class: "input", placeholder: "Search for a user..." %>
<%= form.submit "Search", class: "submit_button", id: "pasteSubmit", onpaste: 'pasteAndGo()' %>
<% end %>
<script>
function pasteAndGo() {
document.getElementById('pasteSubmit').submit();
}
</script>
Может ли кто-нибудь сказать мне, почему это не работает?
Обновлено: я пробовал подход Серкана Тирнавали:
<h1 class = "CustomerTitle">Revuto Customer Support Tool</h1>
<%= form_with url: "/support/search_res", class: "form", onpaste: 'pasteAndGo()', method: :get do |form| %>
<%= form.text_field :query, class: "input", placeholder: "Search for a user..." %>
<%= form.submit "Search", class: "submit_button" %>
<% end %>
<script>
function pasteAndGo() {
document.getElementsByClassName('form')[0].submit();
}
</script>
без прогресса. Любые другие идеи/решения приветствуются.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Вы должны выбрать форму и отправить ее, а не кнопку.
<script>
function pasteAndGo() {
document.getElementsByClassName('form')[0].submit();
}
</script>
Также вы можете использовать эту библиотеку js для функциональности этого типа https://select2.org/data-sources/ajax
Следует ли использовать submit или requestSubmit?
requestSubmit тоже не помогает.
Я считаю, что у вас есть onpaste не в том месте.
Пожалуйста, попробуйте это:
<h1 class = "CustomerTitle">Revuto Customer Support Tool</h1>
<%= form_with url: "/support/search_res", class: "form", method: :get do |form| %>
<%= form.text_field :query, class: "input", placeholder: "Search for a user...", onpaste: 'pasteAndGo()' %>
<%= form.submit "Search", class: "submit_button" %>
<% end %>
<script>
function pasteAndGo() {
document.getElementsByClassName('form')[0].submit();
}
</script>
Это определенно помогло. это работает сейчас. Однако он не принимает информацию текстового поля. Это всегда "пустая" паста. Сейчас это может сводиться к самой функции JS.
@MislavRukonic, пожалуйста, обратитесь к этому другому вопросу: stackoverflow.com/a/10972973/587518 кажется, что событие onpaste запускается до того, как значение поля получает вставленное значение.
Спасибо за ответ. Я проверил этот пост, и кажется, что это было именно то, что я искал. Ваше здоровье!
К сожалению, это не работает. По крайней мере, на этот раз я не получаю никаких ошибок в консоли. Тем не менее спасибо за ваш ответ.