想要实现下拉选择后,另一个输入框自动匹配输入的功能

如下:

【angularjs】ng-change小实例

下面是代码:

物料编码下拉框的html:

                    <th class="rth">
                        <label>物料编码:</label>
                    </th>
                    <td>
                        <select ng-model="vm.code" class="form-control" ng-options="x.DefID for x in vm.codes"  ng-disabled="vm.strFlag=='Edit'" ng-change="vm.codechange()">
                            <option value="">请选择</option>
                        </select>                    
                    </td>

物料编码的js:

             //物料编码下拉显示
             var strWhere0 = "ClassID='CS'";
             $http({
                 params: { "ajaxMethod": "getGridDataBySQL", "columns": "*", "table": "[SITMesDB].[dbo].[MMvdDefinitions]", "strWhere": strWhere0, "orderby": "" },
                 method: 'GET',
                 url: 'mom.situi/handler/Public.ashx'
             }).then(function successCallback(response) {
                 console.log(response);

                 if (response.data.rows.length == 0) {
                 }
                 else {
                     self.codes = response.data.rows;

                 }
             }, function errorCallback(response) {
                 // 请求失败执行代码
             }
         );

物料名称的html:

                    <th class="rth">
                        <label>物料名称:</label>
                    </th>
                    <td>
                        <input id="DefName" type="text" class="form-control" ng-model="vm.DefName" placeholder="根据物料编码显示" autocomplete="off" ng-disabled="true">
                    </td>

物料名称的js:

             this.codechange = function () {
                 if ($.trim(self.code) == "" || self.code == "请选择" || self.code == null) {
                     self.DefName = "";
                 }
                 else {
                 console.log(self.code);
                 self.DefName = self.code.DefName;
                 }
             }

 

相关文章:

  • 2022-12-23
  • 2021-06-23
  • 2021-12-15
  • 2022-12-23
  • 2021-05-05
  • 2021-05-15
猜你喜欢
  • 2021-06-12
  • 2022-12-23
  • 2021-06-05
  • 2021-08-16
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
相关资源
相似解决方案