[英]Respond_to js returns a part of the html page along with the JavaScript instead of js.erb file
我正在尝试重写表单以显示为模态表单。 为此,我使用了 popper 和 bootstrap lib,它们都包含在项目中并且可以正常工作。 但是我没有成功,总是出现同样的错误:
VM44399:1 Uncaught SyntaxError: Unexpected token '<'
at DOMEval (jquery3.self-74ad.js?body=1:112)
at Function.globalEval (jquery3.self-5af507e253c37e9c9dcf65064fc3f93795e6e28012780579975a4d709f4074ad.js?body=1:346)
at text script (jquery3.self-5af507e253c37e9c9dcf65064fc3f93795e6e28012780579975a4d709f4074ad.js?body=1:9641)
at ajaxConvert (jquery3.self-5af507e253c37e9c9dcf65064fc3f93795e6e28012780579975a4d709f4074ad.js?body=1:8788)
at done (jquery3.self-5af507e253c37e9c9dcf65064fc3f93795e6e28012780579975a4d709f4074ad.js?body=1:9256)
at XMLHttpRequest.<anonymous> (jquery3.self-5af507e253c37e9c9dcf65064fc3f93795e6e28012780579975a4d709f4074ad.js?body=1:9549)
我的 js 库:
// app/assets/javascripts/application.js
/* External libraries */
//= require jquery3
//= require jquery_ujs
//= require popper
//= require bootstrap
在 controller 我使用 respond_to 返回我的 js 文件:
def new
respond_to do |f|
f.js
end
end
添加到index.slim模态类并将链接更改为 remote=true:
= link_to new_article_path, { remote: true,
'data-toggle' => "modal",
'data-target' => '#modal-window',
class: 'btn btn-outline-success' }
#modal-window.modal.fade[role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"]
.modal-dialog.text-left[role="document"]
.modal-content
将 new.slim 重命名为_new.slim并向它们添加模态类:
# ArticlesController
.card.modal-header
.card-body.w-100
h5.card-header New Article
= render 'form'
使用 js 创建new.js.erb ,添加并调用模态 window:
$("#modal-window").find(".modal-content").html("<%= j (render 'new') %>");
$("#modal-window").modal();
结果,我仍然得到一些难以理解的 html 的一部分,其中有一堆脚本标签,如<script src="/assets/jquery-ui/
据我所知,这只是整个应用程序页面的一部分,其中有使用 new.js.erb 的代码只是以代码的形式。
这里可能是什么问题?
感谢您的回答!
可能在 controller 中遵循更多的导轨约定:
def new
@article = Article.new
end
def create
@article = Article.create!(article_params)
respond_to do |format|
format.js
end
end
该问题通过在 format.js 或 respond_to 方法之前添加render layout: false
来解决:
def new
respond_to do |format|
format.js { render layout: false }
end
end
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.