javascript - 将数据从 2 个集合传递到 2 个下拉菜单 - Meteor

Question

我是 Meteor 的新手..我有 2 个下拉菜单，每个下拉菜单都位于多个集合中。第一个:客户集合中的客户名称。第二:Addresses 中的地址。因此，当我在第一个下拉列表中选择客户名称时，该客户的地址应显示在下一个下拉列表中。

注意:我使用另外 2 个模板在两个下拉列表中插入数据。我没有使用任何库&我使用铁路由器

template name="newOrder">
  <div class="title">
    <h2>New Orders: </h2>
    <input type="button" class="new" value="&plus; New Customer">
  </div>
  <form class="newOrder">
    <p>{{> selectClient}}</p>
  <p>Mobile number:<br> <input type="tel" class="Mobile" placeholder="Enter your mobile number.."
    required></p>
  <p>Products:<textarea rows="3" cols="35"></textarea></p>
  <p>Address: {{> selectAddress}}</p>
  <p>Date:   <input type="date" name="date" ></p>
  <p>Status:
    <select>
      <option>Pending</option>
      <option>Preparing</option>
      <option> Delivering</option>
    </select></p>
  <input type="button" name="create" class="done" value="Done">
</form>
</template>

<template name="selectClient">
  Client Name :
<select class="select">
  <option selected disabled>Choose client name</option>
  {{#each custom}}
  <option>{{clientName}}</option>
  {{/each}}
</select>
</template>
<template name="selectAddress">
  Address:
<select class="select" name="Choose the address">
  <option selected disabled>Choose the address</option>
  {{#each address}}
  <option>{{addressName}}</option>
  {{/each}}
</select>
</template>

main.js

Template.selectClient.helpers({
    'custom': function(){
        return Customers.find();
    }
  });
  Template.selectAddress.helpers({
    'address': function(){
        return Addresses.find();
    }
});

Answer 1

您需要处理客户端下拉列表上的更改事件，在处理程序中找到 Addresses 集合中的地址并使用 jQuery 选择地址中的地址。