Rails渲染部分Ajax错误但是调试器中显示正确的响应

I'm trying to trigger an additionnal ajax query on an existing link using unobstrusive Javascript.

我正在尝试使用不引人注目的Javascript在现有链接上触发一个额外的ajax查询。

The Query is going to the server and processed, returning for the test the string "javascript template ok".

Query将进入服务器并进行处理，为测试返回字符串“javascript template ok”。

But, the ajax "success" function is never called. In place, it is the "error" function that is triggered...

但是，ajax“成功”功能从未被调用过。在适当的位置，它是触发的“错误”功能......

I looked in the Chrome Debugger and I can see the response text coming back from the server, but never is the "success" method called... :-(

我查看了Chrome调试器，我可以看到从服务器返回的响应文本，但从来没有被称为“成功”的方法... :-(

My call is

我的电话是

jQuery.ajax({
    type: 'POST',

    success: function(response) {   
        $("#details").html(response);
        console.log(response);
    },
    error: function(){ 
        alert("Error\nData could not be retrieve from the server");
    },
    url: '/treeview/show/1538.js',
    cache: false,
});

(url is harcoded in this example). The same Url in the browser gets the correct data with no layout :-)

（在此示例中，url被编码）。浏览器中的相同Url获取没有布局的正确数据:-)

Removing the ".js" in the url returns the html template with layout and the update of the "details" div is achieved correctly...

删除url中的“.js”会返回带有布局的html模板，并且正确地实现了“details”div的更新...

The controller is

控制器是

    respond_to do |format|
      format.html # show.html.erb
      format.js   { render :inline => "JAVASCRIPT TEMPLATE !" }
    end

Thank you

谢谢

EDIT :

编辑：

Here is the object returned from the ajax query (first argument of error: function(jqXHR) ):

这是从ajax查询返回的对象（错误的第一个参数：function（jqXHR））：

Object
    abort: function ( statusText ) {
    always: function () {
    complete: function () {
    done: function () {
    error: function () {
    fail: function () {
    getAllResponseHeaders: function () {
    getResponseHeader: function ( key ) {
    overrideMimeType: function ( type ) {
    pipe: function ( /* fnDone, fnFail, fnProgress */ ) {
    progress: function () {
    promise: function ( obj ) {
    readyState: 4
    responseText: "JAVASCRIPT TEMPLATE !"
    setRequestHeader: function ( name, value ) {
    state: function () {
    status: 200
    statusCode: function ( map ) {
    statusText: "OK"
    success: function () {
    then: function ( /* fnDone, fnFail, fnProgress */ ) {
    __proto__: Object

So I get the correct response text ??!! Where can be the error then ? :-s

所以我得到了正确的回复文本?? !!哪里可以出错呢？：-s

6 个解决方案

#1

You do not explicitly specify the dataType option for jQuery.ajax so jQuery infers it to be script (relying on MIME type served by Rails). Since JAVASCRIPT TEMPLATE ! is not a valid Javascript statement, parser error is thrown. There are two options to get success callback called instead of error:

您没有为jQuery.ajax显式指定dataType选项，因此jQuery将其推断为脚本（依赖于Rails提供的MIME类型）。自JAVASCRIPT TEMPLATE！不是有效的Javascript语句，抛出了解析器错误。调用成功回调而不是错误有两种选择：

Explicitly specify dataType as text:

将dataType明确指定为文本：

jQuery.ajax({
    type: 'POST',
    dataType: 'text',
    // ...
});

Or return valid Javascript from controller:

或者从控制器返回有效的Javascript：

respond_to do |format|
  format.html # show.html.erb
  format.js { render :inline => "{}" }
end

#2

Have you considered that the response might get evaluated as javascript code and therefore throwing an error which gets caught?

您是否认为响应可能会被评估为javascript代码并因此抛出一个被捕获的错误？

#3

Okay, I am not sure about this one, but maybe one of this helps:

好吧，我不确定这个，但也许其中一个有帮助：

Use done() and fail() instead of error/success. Like this:

使用done（）和fail（）而不是错误/成功。喜欢这个：

$.ajax({ ...}).done(...).fail(...);

要么

Try using the correct function arguments in the success/error callbacks. Maybe jQuery doesn't like the signature and thus does not call the function?

尝试在success / error回调中使用正确的函数参数。也许jQuery不喜欢签名，因此不调用函数？

#4

to your ajax call, add

到你的ajax电话，添加

dataType: 'json',

and, controller

和，控制器

format.js   render :text => { :some_data => "JAVASCRIPT TEMPLATE !" }.to_json

#5

Edit your error call to pass the error data to the DOM:

编辑错误调用以将错误数据传递给DOM：

error: function(data){ console.log(data); }

Then you will see exactly what is happening.

然后你会看到到底发生了什么。

#6

This is what you should do:

这是你应该做的：

$.post('/treeview/show/1538.js', function(response, data){
  $("#details").html(data.responseText);
}).error(function(){
  alert("Error\nData could not be retrieve from the server");
})

Optional in your controller

在控制器中可选

respond_to do |format|
  format.html # show.html.erb
  format.js   { render text: "JAVASCRIPT TEMPLATE !" }
end

Try it.

尝试一下。

#1