根据所选值设置默认值

What I am trying to do is when the user selects a city, by default the miles is entered and the zip code is just left alone, blank.

我想要做的是当用户选择一个城市时,默认情况下输入里程并且邮政编码只是单独留空。

The following is code I allows a user to select a city based on a list that will display. I also provided the zipcode and the miles and how they are generated as well.

以下是代码我允许用户根据将要显示的列表选择城市。我还提供了邮政编码和里程以及它们的生成方式。

<div class="form-group">
  <select class="form-control" id="city" 
          ng-model="searchParam.City" 
          ng-options="City.value for City in Cities">
        <option disabled="disabled" selected="selected" value="">City</option>
  </select>
</div>

<div class="row">
  <div class="col-xs-7 no-padding-right">
    <div class="form-group">
      <div class="input-group">
        <select class="form-control" name="distance" 
        ng-model="searchParam.Distance" 
        ng-options="mile.value for mile in miles"></select>
        <div class="input-group-addon">miles</div>
      </div>
    </div>
  </div>

  <div class="col-xs-5 no-padding-left">
    <div class="form-group">
      <input allow-pattern="[\d\W]" class="form-control" 
             id="zip" maxlength="5" ng-model="searchParam.Zip" 
             placeholder="Zip code" type="text" />
    </div>
  </div>
</div>

I am trying to do the following with what I am understanding:

我正在尝试按照我所理解的方式执行以下操作:

<script>
   function citySelected(){
      if(searchParam.City.selected){
          not sure how to set miles to default 
          not sure how to say leave zip code blank
      }
   }
</script>

2 个解决方案

#1

You know, that you are using angularjs?

你知道吗,你正在使用angularjs?

For your model, you need a controller like this

对于您的型号,您需要这样的控制器

module.exports = function($scope) {
    var default = '50';
    $scope.Distance = default;
    $scope.Zip = '';
};

Can't see your angularJS implementation. You did copy+paste? Maybe this did help you, if you have the basics.

看不到你的angularJS实现。你复制+粘贴?如果你有基础知识,也许这对你有所帮助。

#2

Well, what I've got of your question: is that you want to change the miles accordingly to city selected, is it?

那么,我对你提出的问题是:你想要相应地改变里程数,是吗?

I'm not sure if my interpretation was correct, but I made this snippet:

我不确定我的解释是否正确,但我做了这个片段:

(function() {
  "use strict";
  angular.module('app', [])
    .controller('mainCtrl', function($scope) {
      $scope.cities = [  
         {  
            "name":"Alabama",
            "distance":"400"
         },
         {  
            "name":"Arkansas",
            "distance":"600"
         },
         {  
            "name":"New York",
            "distance":"800"
         }
      ];
    })
})();

<!DOCTYPE html>
<html ng-app="app">

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" type="text/javascript"></script>
  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" type="text/javascript"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script>
</head>

<body ng-controller="mainCtrl">
  <div class="form-group">
    <select class="form-control" id="city" ng-model="city" ng-options="city as city.name for city in cities">
      <option value="">--Select city--</option>
    </select>
  </div>
  <div class="row">
    <div class="col-xs-7 no-padding-right">
      <div class="form-group">
        <div class="input-group">
          <input type="text" class="form-control" id="distance" ng-model="city.distance">
          <div class="input-group-addon">miles</div>
        </div>
      </div>
    </div>
    <div class="col-xs-5 no-padding-left">
      <div class="form-group">
        <input type="text" class="form-control" id="zip" maxlength="5" ng-model="zip" placeholder="Zip code">
      </div>
    </div>
  </div>
</body>

</html>

#1