[英]Obtaining data asynchronously using $.ajax() in rails 3.2.2
I'm trying to learn how to 'GET' data from my rails 3.2.2 project asynchronously. 我正在尝试学习如何从rails 3.2.2项目中异步“获取”数据。 I am new to both javascript and jquery but I've learned, javascript cannot GET data from a server in a different domain. 我是javascript和jquery的新手,但我已经了解到,javascript无法从不同域中的服务器获取数据。 To get around that I've read about using $.ajax(), $getJSON(), and/or $.jsonp(), so my first question is when should you use one over another? 为了解决这个问题,我已经阅读过使用$ .ajax(),$ getJSON()和/或$ .jsonp(),所以我的第一个问题是你何时应该使用另一个?
I'm trying to get one technique to work (eg $.ajax() within my rails 3.2.2 project. I have a simple scaffold consisting of one controller => Images and one field => t.string:name. 我正在尝试使用一种技术(例如我的rails 3.2.2项目中的$ .ajax()。我有一个简单的脚手架,由一个控制器组成=>图像和一个字段=> t.string:name。
class ImagesController < ApplicationController
# GET /images
# GET /images.json
def index
@images = Image.all
respond_to do |format|
format.html # index.html.erb
format.json { render json: @images }
end
end
# GET /images/1
# GET /images/1.json
def show
@image = Image.find(params[:id])
respond_to do |format|
format.html # show.html.erb
format.json { render json: @image }
end
end
# GET /images/new
# GET /images/new.json
def new
@image = Image.new
respond_to do |format|
format.html # new.html.erb
format.json { render json: @image }
end
end
# GET /images/1/edit
def edit
@image = Image.find(params[:id])
end
# POST /images
# POST /images.json
def create
@image = Image.new(params[:image])
respond_to do |format|
if @image.save
format.html { redirect_to @image, notice: 'Image was successfully created.' }
format.json { render json: @image, status: :created, location: @image }
else
format.html { render action: "new" }
format.json { render json: @image.errors, status: :unprocessable_entity }
end
end
end
# PUT /images/1
# PUT /images/1.json
def update
@image = Image.find(params[:id])
respond_to do |format|
if @image.update_attributes(params[:image])
format.html { redirect_to @image, notice: 'Image was successfully updated.' }
format.json { head :no_content }
else
format.html { render action: "edit" }
format.json { render json: @image.errors, status: :unprocessable_entity }
end
end
end
# DELETE /images/1
# DELETE /images/1.json
def destroy
@image = Image.find(params[:id])
@image.destroy
respond_to do |format|
format.html { redirect_to images_url }
format.json { head :no_content }
end
end
end
I first want to explore the index action and 'GET' a list of image names using an $.ajax() call in up.html: 我首先想要探索索引操作并使用up.html中的$ .ajax()调用'GET'一个图像名称列表:
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"> </script>
</head>
<body>
<script>
$(document).ready( function (){
$("button").click(function(){
$.ajax({
dataType: 'jsonp',
url: "http://localhost:3000/images",
success: function(response) {
console.log(response);
}
});
});
});
</script>
<button id ="button" type ="button">Get names</button>
</body>
</html>
I received the following from the console: 我从控制台收到以下内容:
event.layerX and event.layerY are broken and deprecated in WebKit. They will be removed from the engine in the near future.
jquery.min.js:16Resource interpreted as Script but transferred with MIME type text/html: "http://localhost:3000/images? callback=jQuery15209319186636712402_1334849479698&_=1334849481034".
images:1Uncaught SyntaxError: Unexpected token <
I'm lost here. 我迷失在这里。 I'm not sure if I should be using '?callback=?' 我不确定我是否应该使用'?callback =?' in my url or if I should have additional parameters in my controller or something else entirely? 在我的网址中,或者我应该在我的控制器中还有其他参数?
$(document).ready( function (){
$("button").click(function(){
$.ajax({
dataType: 'json', // not jsonp
url: "http://localhost:3000/images.json",
success: function(response) {
console.log(response);
}
});
});
});
Ignore the first line in your console - that's a standard warning that appeared in recent Chrome/jquery versions. 忽略控制台中的第一行 - 这是最近Chrome / jquery版本中出现的标准警告。
The second line is telling you that your web app sent html, rather than json 第二行告诉你,你的网络应用程序发送的是html,而不是json
The third line is due to trying to parse html (presumably starting with " <html...
") as if it were a json string. 第三行是由于尝试解析html(可能以“ <html...
”开头),好像它是一个json字符串。
So, you need to tell rails to send you json, not html. 所以,你需要告诉rails给你发送json,而不是html。 Try changing your url in the json call to ""http://localhost:3000/images.json". 尝试将json调用中的url更改为“”http:// localhost:3000 / images.json“。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.