在每个show(）上创建新的模态对话框

Create new modal dialog on every show()

本文关键字：创建 模态 对话框 show      更新时间：2023-09-26

Meteor js中的反应模态

请帮我处理Meteor js中的反应模态，首先我注意到，如果我从模态模板中的jQuery选择器中取一些值，我只在第一个模态"show（）"上得到了正确的值，在第一个之后，他每次点击都会给我相同的值。然后我查看代码，发现有许多模式具有不同的id，比如（id="rm-1e7385aa-4ca8-491b-be4e-81baa2affbc"），这可能会导致问题。我尝试使用模板保护，但没有成功。你能帮我解决这个问题吗？

代码类似于此，

// Reactive Table events
  Template.reactiveTebleList.events({
      'click .reactive-table tbody tr': function (event) {
      var rd_editorder = ReactiveModal.initDialog(rm_EditOrder);
      rd_editorder.show();
     }
 });
   var rm_EditOrder = {
    type: 'type-default',  
    template: Template.tmp_EditOrder, 
     title: "Edit Order",
     removeOnHide: true,
     closable: true,
     buttons: {
          "cancel": {
            class: 'btn-danger',
            label: 'Cancel'
          },
          "ok": {
            closeModalOnClick: true, 
            class: 'btn-info',
            label: 'Back'
          }
      }
    }; 
Template.tmp_EditOrder.events({
'click #saveposition': function(e){
      var selectedPosition = $('#selectPosition').find(":selected").text();
      console.log("selectedPosition: " + selectedPosition);
      rm_EditOrder.hide();
},

<template name="tmp_EditOrder">
    <select class="form-control" id="selectPosition">
                {{#each position}}
                     <option>{{this}}</option>
                {{/each}}
     </select>
 <button type="submit" id="saveposition" class="btn btn-primary">Save Position</button>
</template>

在每个模式关闭时使用$(".modalClass").remove()；或者使用一个为你处理这个过程的流星包。我一直在使用https://github.com/pahans/reactive-modal。正如您在该包的文档中所看到的，在关闭模态时，将为您删除模态dom。注意removeOnHide，如果您想保留模态的dom，也可以将其设置为true。

var shareDialogInfo = {
template: Template.appShareDialog,
title: "Share the app",
modalDialogClass: "share-modal-dialog", //optional
modalBodyClass: "share-modal-body", //optional
modalFooterClass: "share-modal-footer",//optional
removeOnHide: true, //optional. If this is true, modal will be removed from DOM upon hiding
相关文章：