Rails partial in modal (render partial from different model)(Rails 部分模态(从不同模型渲染部分))
问题描述
我尝试将部分包含在类似于此 Rails 的模式中管理员当您点击创建语言"时.
I have tried to include a partial into a modal something similar to this Rails Admin when you click on "create language".
现在我还没有真正了解代码是如何在那里工作的,我尝试在这之间进行混合 Rails - AJAX 一个模态对话框? 和自己的东西.
Now as I have not really found out how the code works there, I tried to do a mix between this Rails - AJAX a Modal Dialog? and something own.
问题是,部分现在被渲染到模态中.但是当我点击保存"时,验证将返回到正常"的新建视图,并且不会直接在模式中显示验证错误.
The thing is, the partial gets rendered now into the modal. But when I hit "save", the validation will go back to the "normal" create-new view and not show the validation errors directly within the modal.
如何在弹出的modal中直接显示验证错误?
How can I show the validation errors in the popped up modal directly?
当我保存时,我应该以某种方式区分来自此模式的保存和正常保存,因为此部分将从其他地方调用,并且需要将新创建的对象直接设置为 a 中的新对象落下.我想我需要区分响应格式,然后使用 JS 将新 id 设置为 DropDown id?
When I save, I should somehow distinguish between a save from this modal and a normal save, as this partial will be called from somewhere else and would need to set the new created object directly as a new Object within a drop down. I guess i would need to distinguish from a response format and then use JS to set the new id to the DropDown id?
这里有一些到目前为止写的代码.在我包含部分的视图中,它看起来像这样,我调用另一个控制器(因为我在不同的控制器新视图上).
Here some code written so far. In the view where I include the partial it looks like this where i call another controller (as I am on a different controllers-new-view).
$.get('<%= url_for :controller => 'customers', :action => 'new' %>',
function(data) {
$('#customer-modal').html(data);
}
);
然后customres"控制器中的new区分不同的请求格式并呈现不同的部分(在本例中为_ajax_form.html.erb"):
Then the new in the "customres" controller distinguishs between the different request format and renders the different partial (in this case "_ajax_form.html.erb"):
if request.xhr?
render "_ajax_form", :layout => false
在这部分中,我使用simple_form_for @customer, :remote => true do |f]....",所以我猜最后提交看起来应该与标准不同,因为这称为正常的创建" 在控制器上?
In this partial, I use "simple_form_for @customer, :remote => true do |f]....", so I guess at the end the submit should look different than standard, as this calls the normal "create" on the controller?
<div class="modal-footer">
<%= f.button :submit, :class => 'btn primary' %>
<a id='cancel-form' class= "btn small info">cancel</a>
</div>
感谢任何帮助澄清我做错了什么或应该如何做,因为我在 Rails 和 JS/AXAX 方面的经验还不是太有经验.. ;)
Thanks for any help which clarifies what I am doing wrong or how it should be done as my experience in Rails and JS/AXAX are not yet too experienced.. ;)
- 已我现在有一个版本,在我的特殊部分中加载到模式中,将在 simple_form_for 中调用名为new_from_sale"的单独操作:
simple_form_for @customer, :url =>url_for(:action => 'new_from_sale', :controller => 'customers') 做 |f|
然后在控制器中,当这个新对象的保存正常时,我重定向到第一个调用的视图,并将新的 id 作为参数,然后填充下拉列表.在其他情况下,当无法保存新对象时,我需要以某种方式显示仍在该模式中的错误.到目前为止,两者都尝试直接渲染部分 render :partial =>"customers/ajax_form"
或回馈 JS 代码 render :js =>"$('#sale_customer_id').val(#{@customer.id});"
还不行.. 但我会继续试试我的运气..
Then in the controller, when the save is ok of this new object, I redirect to the first called view with the new id as a param which then fills the dropdown. In the else case, when the new object can not be saved, I need somehow to show the errors still in that modal.
So far both tries to either directly render the partial render :partial => "customers/ajax_form"
or give back JS code render :js => "$('#sale_customer_id').val(#{@customer.id});"
would not yet work.. but I'll keep on trying my luck..
推荐答案
这是一个基本示例,说明我将如何做一个模态表单,我写了一个类似的问题 (Rails 和模态 jquery 对话框表单):
Here's a basic example of how I'd do a modal form which I wrote in response to a similar question (Rails and modal jquery dialog form):
https://github.com/ramblex/modal-form
你需要添加 :remote =>true
到加载到对话框中的表单.这将导致从创建操作呈现 JS 格式.然后,您可以在 create.js.erb 中处理响应.
You need to add :remote => true
to the form that gets loaded into the dialog. That will cause the JS format to be rendered from the create action. You can then handle the response in a create.js.erb.
这篇关于Rails 部分模态(从不同模型渲染部分)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:Rails 部分模态(从不同模型渲染部分)
基础教程推荐
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 直接将值设置为滑块 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01