Rails Ajax意外的标记<在位置0的JSON中

问题描述：

我希望我的索引根据价格降序和价格升序进行更改，就像亚马逊一样。Rails Ajax意外的标记<在位置0的JSON中

现在，我发送一个ajax请求到站点，用select的新值请求数据。该网站从数据库获取数据并对其进行分类。之后，我的javascript重新绘制了我的索引页中的排序书籍响应。

但是，当我console.log结果我得到整个HTML页面。
下面这行代码给我的错误：

var books = JSON.parse(result);

Unexpected token < in JSON at position 0 BookController.rb

如何我只得到@books？
下面是我的代码：

BookController.rb

def index 
    if params.dig("book", "title").nil? && params.dig("users", "university").nil? 
    @books = Book.where({title: params.dig("book", "title")}) 
    .joins(:user).where(users: {university: params.dig("users", "university")}) 
    elsif !params.dig("book", "title").nil? && params.dig("users", "university").nil? 
    @books = Book.where({title: params.dig("book", "title")}) 
    elsif params.dig("book", "title").nil? && !params.dig("users", "university").nil? 
    @books = Book.joins(:user).where(users: {university: params.dig("users", "university")}) 
    else 
    @books = Book.all 
    end 
    case params[:sort] 
    when "Price Descending" 
     @books.order(price_cents: "DESC") 
    when "Price Ascending" 
     @books.order(price_cents: "ASC") 
    else 
     @books.sort_by(&:created_at) 
    end 
    respond_to do |format| 
    format.html 
    format.json { render json: @books } 
    end 
end

书Index.html.erb

<select id="priceSelect"> 
    <option value="Best Results" selected="selected">Best Results</option> 
    <option value="Price Descending">Price Descending</option> 
    <option value="Price Ascending">Price Ascending</option> 
</select> 
. 
. 
. 
<div class="books-info"> 
    <% @books.each do |book| %> 
    <div class="col-xs-12 selectable-card"> 
     <%= link_to book_path(book.id) do %> 
     ... 
     <% end %> 
    </div> 
    <% end %> 
</div> 

<script> 
    $('#priceSelect').change(function(){ 
    $.ajax({ 
     url: "books", 
     type: "GET", 
     data: {sort: $('#priceSelect :selected').val()}, 
     success:function(ret){ 
     console.log(ret); 
     var books = JSON.parse(ret); 
     var length = books.length; 
     var html = ""; 
     for (var i = 0; i < length; i++) { 
      html += "<div class='col-xs-12 selectable-card'>"; 
      html += "<a href='" + books[i].id + "'>" + books[i].name + "</a>"; 
      html += "</div>"; 
     } 
     $('.books-info').innerHTML = html 
     }, 
    }) 
    }); 
</script>

而且最后我的routes.rb

resources :books do 
    resources :users 
end

的错误意味着响应包含XML或HTML，而不是JSON作为你告诉它期待 –

是，它给我的整个HTML

.. ....但它真的很奇怪，因为我不应该只从我的@books获取对象，因为我说从BooksController.rb获取索引？ –

答

我想你错过了你的Ajax请求的接受头，所以你实际上得到的HTML页面又回来了。

尝试：<！DOCTYPE HTML>

$.ajax({ 
    dataType: 'json', 
    ... 
});

好吧，我这样做，错误更改为未捕获的SyntaxError：意外的JSON输入结束。这是否意味着我的控制器或javascript代码中有语法错误？此外，如果我console.log（ret）它给了我一个数组[]与长度= 0 –

当我只是做var books = ret;它给了我没有错误。但它说数组的长度为0.我接受了Aditya Mittal的回答：https：//stackoverflow.com/a/33489715/1438029 –

听起来像您正在查询的内容有问题。尝试在那里调试代码，以确保你实际上从数据库中获取任何东西。 –

答

更改此

respond_to do |format| 
    format.html 
    format.json { render json: @books } 
end

到：

render json: {data: @books}

它变暖了。当我这样做时，整个html都消失了，但它显示了我真正想要的所有@books对象。在右上角，我可以切换原始和解析 –

Rails Ajax意外的标记<在位置0的JSON中

相关推荐