簡體   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