Question

我试图允许用户输入ISBN号并接收有关该书的数据。这在用户第一次输入ISBN号时有效，但是当他/她尝试更改它时，无法更新该值（在尝试更改值后，它会将其自身更改回第一个ISBN号）。

我有一个_form.html.erb部分，在input#isbn_field输入内容时会更新。如果ISBN有效，则会更新信息以使用id: 'isbn-lookup-results-container'替换div中的其他信息（作者姓名，标题等）。

如何在加载isbn_lookup_result部分后允许更改ISBN？

listings_controller.rb

def lookup
   @listing = Listing.new
   @isbn_lookup_result = Listing.amazon_lookup(params[:isbn])
   render partial: 'isbn_lookup_result'
  end

lookup.js.coffee

$(document).ready ->
  TIMEOUT = null
  $(document).on 'keyup', 'input#isbn_field', ->
    clearTimeout TIMEOUT
    TIMEOUT = setTimeout((->
      ajaxResponse = $.ajax(
        url: '/listings/lookup'
        type: 'GET'
        data:
          isbn: $('input#isbn_field').val())
      ajaxResponse.success (data) ->
        $('#isbn-lookup-results-container').html data
        $('#form-unfilled').hide()
        return
      ajaxResponse.error (data) ->
        alert 'Not a valid ISBN'
        return
      return
    ), 2000)
    return
  return

_isbn_lookup_result.html.erb

<%= form_for(@listing, :html => {class: "form-horizontal" , 
    role: "form"}, method: :get) do |f| %>
       <div class="form-group">
        <%= f.text_field :isbn , class: "form-control" , 
              id: "isbn_field", placeholder: "ISBN (10 or 13 digits - no dashes)",         
              value: @isbn_lookup_result[:isbn], autofocus: true %>
        </div>
        # More stuff
<% end %>

Answer 1

如果我正确地理解你，并且我想我是，那你只是遇到了一个javascript问题。

现在，您正在将事件绑定到加载页面时DOM中的选择器。相反，您希望根据事件绑定到文档的body及其内容。

我会尝试用$(document).on 'keyup', 'input#isbn_field',

替换$('body').on 'keyup', 'input#isbn_field',

比我更聪明的人在这里讨论Jquery Event won't fire after ajax call - 一个好的Google foo会像ajax之后的绑定事件

ajax调用

1 个答案: