繁体   English   中英

流星:如何根据数据库中的值设置单选按钮的值

[英]Meteor: How to set a radio button’s value depending on the value in the Database

网站的管理员可以创建新的学术出版物(例如: 已发表的论文pp )或书籍章节bc ))。 发布的类型由单选按钮确定。 有四种不同的类型。

问题:管理员也可能在以后的阶段中编辑一个已经存在的条目。 为此,我需要检索type的值并将其传递给template.html以预先选择正确的单选按钮。

这怎么可能? 任何帮助表示赞赏。

这是JSON,带有来自Publications集合的type字段:

{
    "_id" : "t4Zc23YSB9fJc8rW4",
    "authors" : [ 
        {
            "lastName" : "Whittington",
            "firstName" : "Richard"
        }, 
        {
            "lastName" : "Cailluet",
            "firstName" : "Ludovic "
        }, 
        {
            "lastName" : "Douglas",
            "firstName" : "Basak Yakis "
        }
    ],
    "title" : "Opening strategy: Evolution of a precarious profession",
    "outlet" : "British Journal of Management, 22 (3)",
    "year" : "2011",
    "abstract" : "No Abstract ...",
    "type" : "pp"
}

helper.js:

Template.adminPublicationsEdit.helpers({
  pubEntry: function () {
    return Publications.findOne({_id: this._id});
  }
});

和template.html:

<template name="adminPublicationsEdit">
    <div class="container extra-spacing-bottom">
    <div class="putdown extra-spacing-bottom">
            <h1 class="extra-spacing-bottom">EDIT ENTRY</h1>
            <hr>
      {{#with pubEntry}}
      <form class="form-horizontal" id="addPub" role="form">
        <div class="form-group">
            <label for="title" class="col-sm-2 control-label">Title</label>
          <div class="col-sm-10">
              <input type="text" class="form-control" id="title" name="title" value="{{title}}" placeholder="Enter Title">
            </div>
        </div>

        <div class="form-group">
            <label for="year" class="col-sm-2 control-label">Year</label>
            <div class="col-sm-10">
                <input type="text" class="form-control" id="year" name="year" value="{{year}}" placeholder="Enter Year of Publication">
            </div>
        </div>

       <div class="form-group">
          <label for="abstract" class="col-sm-2 control-label">Abstract</label>
          <div class="col-sm-10">
          <div name="abstract" id="abstract">
            {{{abstract}}}
          </div>
          </div>
      </div>

            <div class="form-group js-radios">
                <label for="Outlet" class="col-sm-2 control-label">Outlet</label>
                <div class="col-sm-10">
                    <label class="radio-inline"><input type="radio" name="outlet-type" id="wp" value="wp">Working Paper</label>
                    <label class="radio-inline"><input type="radio" name="outlet-type" id="pp" value="pp">Published Paper</label>
                    <label class="radio-inline"><input type="radio" name="outlet-type" id="bk" value="bk">Book</label>
                    <label class="radio-inline"><input type="radio" name="outlet-type" id="bc" value="bc">Book Chapter</label>
                </div>
            </div>

              {{#if ppSelected}}
               <div class="form-group">
                  <label for="journal" class="col-sm-2 control-label">Journal</label>
                  <div class="col-sm-10">
                      <input type="text" class="form-control" id="journal" name="journal" placeholder="Enter Name of Journal">
                  </div>
              </div>

              <div class="form-group">
                  <label for="pages" class="col-sm-2 control-label">Pages</label>
                  <div class="col-sm-10">
                      <input type="text" class="form-control" id="pages" name="pages" placeholder="Enter Pages">
                  </div>
              </div>
              {{/if}}

            {{#if bkSelected}}
             <div class="form-group">
                <label for="publisher" class="col-sm-2 control-label">Publisher</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" id="publisher" name="publisher" placeholder="Enter Publisher">
                </div>
            </div>

            <div class="form-group">
                <label for="location" class="col-sm-2 control-label">Location of Publisher</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" id="location" name="location" placeholder="Enter Location of Publisher">
                </div>
            </div>
            {{/if}}

            {{#if bcSelected}}
             <div class="form-group">
              <label for="publisher" class="col-sm-2 control-label">Publisher</label>
              <div class="col-sm-10">
                  <input type="text" class="form-control" id="publisher" name="publisher" placeholder="Enter Publisher">
              </div>
            </div>

            <div class="form-group">
              <label for="location" class="col-sm-2 control-label">Location of Publisher</label>
              <div class="col-sm-10">
                  <input type="text" class="form-control" id="location" name="location" placeholder="Enter Location of Publisher">
              </div>
            </div>

             <div class="form-group">
                <label for="editors" class="col-sm-2 control-label">Editor(s)</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" name="editors" id="firstEditor"  placeholder="Enter Book Editor(s)">
                </div>
              </div>


            <div class="form-group">
              <label for="pages" class="col-sm-2 control-label">Pages</label>
              <div class="col-sm-10">
                <input type="text" class="form-control" id="pages" name="pages" value="{{pages}}">
              </div>
            </div>
            {{/if}}

            <div class="form-group">
              <div class="col-sm-offset-2 col-sm-10">
                <button type="submit" id="js-addEntry" class="btn btn-primary admin-button">UPDATE ENTRY</button>
              </div>
            </div>

          </form> <!-- end form -->

      {{/with}}
    </div> <!-- putdown -->
  </div> <!-- container -->
</template>

如果我理解您的问题,则想在Outlet form-group选择一个特定的单选按钮,该按钮与pubEntry对象的type的值相对应。 如果是这种情况,您可以实现一个Meteor帮助器并将类型作为函数参数传递。

例如:

if (Meteor.isClient) {
  Template.adminPublicationsEdit.helpers({
    // ...
    isChecked: function(type) {
      return (this.type === type) ? "checked" : "";
    }
    // ...
  });
}

<template name="adminPublicationsEdit">
  <!-- ... -->
  <div class="form-group js-radios">
    <label for="Outlet" class="col-sm-2 control-label">Outlet</label>
    <div class="col-sm-10">
      <label class="radio-inline">
        <input type="radio" name="outlet-type" id="wp" value="wp" {{isChecked 'wp'}}>Working Paper</label>
      <label class="radio-inline">
        <input type="radio" name="outlet-type" id="pp" value="pp" {{isChecked 'pp'}}>Published Paper</label>
      <label class="radio-inline">
        <input type="radio" name="outlet-type" id="bk" value="bk" {{isChecked 'bk'}}>Book</label>
      <label class="radio-inline">
        <input type="radio" name="outlet-type" id="bc" value="bc" {{isChecked 'bc'}}>Book Chapter</label>
    </div>
  </div>
  <!-- ... -->
</template>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM