Rails 部分模态(从不同模型渲染部分)

2023-06-21前端开发问题
1

本文介绍了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.

  1. 如何在弹出的modal中直接显示验证错误?

  1. 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 部分模态(从不同模型渲染部分)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

The End

相关推荐

ajax请求获取json数据并处理的实例代码
ajax请求获取json数据并处理的实例代码 $.ajax({ type: 'GET', url: 'https://localhost:44369/UserInfo/EditUserJson',//请求数据 data: json,//传递数据 //dataType:'json/text',//预计服务器返回的类型 timeout: 3000,//请求超时的时间 //回调函数传参 suc...
2024-11-22 前端开发问题
215

js删除数组中指定元素的5种方法
在JavaScript中,我们有多种方法可以删除数组中的指定元素。以下给出了5种常见的方法并提供了相应的代码示例: 1.使用splice()方法: let array = [0, 1, 2, 3, 4, 5];let index = array.indexOf(2);if (index -1) { array.splice(index, 1);}// array = [0,...
2024-11-22 前端开发问题
182

layui 单选框、复选框、下拉菜单不显示问题如何解决?
1. 如果是ajax嵌套了 页面, 请确保 只有最外层的页面引入了layui.css 和 layui.js ,内层页面 切记不要再次引入 2. 具体代码如下 layui.use(['form', 'upload'], function(){ var form = layui.form; form.render(); // 加入这一句});...
2024-11-09 前端开发问题
313

JavaScript小数运算出现多位的解决办法
在开发JS过程中,会经常遇到两个小数相运算的情况,但是运算结果却与预期不同,调试一下发现计算结果竟然有那么长一串尾巴。如下图所示: 产生原因: JavaScript对小数运算会先转成二进制,运算完毕再转回十进制,过程中会有丢失,不过不是所有的小数间运算会...
2024-10-18 前端开发问题
301

JavaScript(js)文件字符串中丢失"\"斜线的解决方法
问题描述: 在javascript中引用js代码,然后导致反斜杠丢失,发现字符串中的所有\信息丢失。比如在js中引用input type=text onkeyup=value=value.replace(/[^\d]/g,) ,结果导致正则表达式中的\丢失。 问题原因: 该字符串含有\,javascript对字符串进行了转...
2024-10-17 前端开发问题
437

layui中table列表 增加属性 edit="date",不生效怎么办?
如果你想在 layui 的 table 列表中增加 edit=date 属性但不生效,可能是以下问题导致的: 1. 缺少日期组件的初始化 如果想在表格中使用日期组件,需要在页面中引入 layui 的日期组件,并初始化: script type="text/javascript" src="/layui/layui.js"/scrip...
2024-06-11 前端开发问题
455