用引导模式渲染编辑的部分表单(Rendering an edit partial form with bootstrap modals)

用引导模式渲染编辑的部分表单(Rendering an edit partial form with bootstrap modals)

我正在开发一个与Dropbox具有相似功能的Ruby on Rails项目。 我使用的宝石：

carrierwave：上传文件 acts_as_tree：文件夹目录 苗条：更清洁的HTML 引导4

我试图合并引导编辑窗体的引导模式，以便用户能够编辑我在模型中具有的file_name属性。

- @documents.each do |document| = link_to document.file.filename, document.file.url b = document.file_name = number_to_human_size(document.file.size, :precision => 2) = document.content_type = document.updated_at = link_to "Download", document.file.url #renameButton.button.btn.btn-primary data-toggle="modal" data-target="#renameModal" Rename #renameModal.modal.fade tabindex="=1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" .modal-dialog role="document" .modal-content .modal-header #exampleModalLabel.h5.modal-title Rename folder button.close data-dismiss="modal" aria-label="Close" span aria-hidden="true" × .modal-body = form_for document do |f| = f.label :name = f.text_field :file_name = f.submit .modal-footer button.btn.btn-outline-success data-dismiss="modal" aria-hidden="true" Close button.btn.btn-outline-danger Save changes = link_to "Delete", document, :confirm => 'Are you sure?', :method => :delete

我遇到的问题是，无论何时点击我的“重命名”按钮，模态中的渲染编辑窗体都会指向第一个文件条目而不是选定的文件条目。

我认为在我的do-loop中有一个模式会导致这个问题。

有没有解决的办法？

I am working on a Ruby on Rails project that has similar functionalities as dropbox. The gems I use:

carrierwave: Uploading files acts_as_tree: Folder directory slim: cleaner html bootstrap 4

I am trying to incorporate bootstrap modals that renders the edit form so that users are able to edit the file_name attribute I have in my model.

- @documents.each do |document| = link_to document.file.filename, document.file.url b = document.file_name = number_to_human_size(document.file.size, :precision => 2) = document.content_type = document.updated_at = link_to "Download", document.file.url #renameButton.button.btn.btn-primary data-toggle="modal" data-target="#renameModal" Rename #renameModal.modal.fade tabindex="=1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" .modal-dialog role="document" .modal-content .modal-header #exampleModalLabel.h5.modal-title Rename folder button.close data-dismiss="modal" aria-label="Close" span aria-hidden="true" × .modal-body = form_for document do |f| = f.label :name = f.text_field :file_name = f.submit .modal-footer button.btn.btn-outline-success data-dismiss="modal" aria-hidden="true" Close button.btn.btn-outline-danger Save changes = link_to "Delete", document, :confirm => 'Are you sure?', :method => :delete

The problem I have is that whenever I click on any of my "rename" button, the rendered edit form inside the modal always point to the first file entry instead of the selected one.

I think having a modal inside my do-loop causes this issue.

Is there a way around this?

最满意答案

这个问题可能是因为你正在使用相同的data-target来重命名按钮来打开模型，每个Modal都有相同的ID

尝试使用迭代器到每个ID

data-target="#renameModal#{index}"

并与您的模型ID应该是：

id: "#renameModal#{index}"

我不知道很多关于slim语法使用，所以请使用你的苗条语法。 这只是一个基本的Bootstrap概念。

希望这可以帮助...

The issue could be that you are using same data-target for rename buttom click to open model and every Modal have same id

Try using an iterator to each id

data-target="#renameModal#{index}"

and also with your model id should be:

id: "#renameModal#{index}"

I dont know Much About slim Syntax use so please use your slim syntax. This is just a basic Bootstrap Concept.

Hope This Helps...