编辑时模态 window 上的流星变化值

Question

我想在 meteor 应用程序中使用模态对话框添加 'Edit' 功能。在 .html 我有

<template name="edit_deal">
    <button id="edit_btn" class="edit">Edit</button>
    <div id="edit_dialog" title="Edit opportunity">
     {{> Edit }}
    </div>
</template>

<template name="Edit">
 <form class="edit-deal">
    <input type="text" name="cuname" placeholder="Customer Name">
  </form>
</template>

在 .js 中我有

Template.edit_deal.rendered = function() { 
 $( "#edit_dialog" ).dialog({
  height: 240,
  width: 800,
  modal: true,
  resizable: false,
  autoOpen: false,
  dialogClass: 'no-close add-dialog'
 });
}

Template.edit_deal.events({
 'click #edit_btn': function(event, template) {
 $( "#edit_dialog" ).dialog('open');
 }
});

Template.Edit.events({
 "submit .edit-deal": function (event) {
  event.preventDefault();

  var cuname = event.target.cuname.value;

  Deals.insert({
   customerName: cuname
  });

 }

});

在 Template.edit_deal.events 中我可以获得当前名称，但无法将其写回表单。如何更改表单值？

Answer 1

您可以使用jQuery's .val()方法来设置模态框输入框的值：

Template.edit_deal.events({
    'click #edit_btn': function(event, template) {
        $("#edit_dialog").dialog('open');
        $('input[name="cuname"]').val("foo bar");
    }
});

但是，我个人更喜欢创建一个辅助函数来设置 HTML input value 属性：

Template.Edit.helpers({
    cunameValue: function() {
        return "foo bar";
    }
});

<template name="Edit">
    <form class="edit-deal">
        <input type="text" name="cuname" placeholder="Customer Name" value="{{cunameValue}}">
    </form>
</template>

请注意，自 Meteor 版本 1.0.4 起，Template.edit_deal.rendered = function(){}; 已被弃用，因此您应该改用 Template.edit_deal.onRendered(function(){});。

编辑时模态 window 上的流星变化值

Meteor change value on modal window when editing

javascript

modal-dialog

meteor