在Angular JS中选择另一个时禁用输入字段答案

【问题标题】：Disable input field when selecting another in Angular JS在Angular JS中选择另一个时禁用输入字段
【发布时间】：2015-10-27 03:51:47
【问题描述】：

我有一个文本字段和一个下拉选择，如下所示。

<section class="popupBody"  data-ng-controller="PostController">
 <form>
    <input class="form-control col-sm-2" type="text" ng-model="buyer_cname" placeholder="Enter Buyer's Company Name" >

    <label style="text-align:center;">Or,</label>

    <select ng-model="buyer_cname_dropdown" required>
             <option  value="">Select the Buyer From Drop Down</option>
             <option value="test1">Test1</option>
             <option value="test2">Test2</option>
             <option value="test3">Test3</option>
    </select>
 </form>
</section>

控制器

  function PostController($scope, $http, $cookieStore) {
      var token = $cookieStore.get('token');
      var conId = $cookieStore.get('Cont_Id');
      var exId = $cookieStore.get('ex_Id');
      $scope.submit_pt = function() {
          var buyer_name = $scope.buyer_cname;
          var buyer_cname = $scope.buyer_cname_dropdown;  
          var seller_name = $scope.seller_cname;
          var seller_cname = $scope.seller_cname_dropdown; 
          var description = $scope.description;
          var amount = $scope.amount;
          amount = (amount*100);
          var p_types = $scope.post_typess;
          $scope.post_transaction = [];
          var post_tran = "http://www.smple.mobi/account/post_member_transaction.html?contactid="+conId+"&exchangeid="+exId+"&token="+token+"&buyerid=21458&seller_name=eBarter%20Master%20Account&desc="+description+"&amount="+amount+"&sellerid=2951";
    $http.get(post_tran)
        .success(function(response) {
            $scope.post_transaction = response;
            console.log($scope.post_transaction);
            $('.posted').show();
            $('.posted').html('Transaction Posted');
            $('.posted').delay(4000).fadeOut();
                $scope.description = "";
            });
    }
}

文本字段和选择都将返回相同的值，所以我想要一个选项来在用户在文本字段中输入名称时禁用选择，反之亦然。用户不应该能够在文本字段中输入名称并从下拉列表中选择另一个。您的想法将不胜感激。

【问题讨论】：

标签： javascript jquery html angularjs

【解决方案1】：

我会那样做。它是纯 Javascript，但如果我做对了，应该可以完成工作：

function input(object){
    if (object.id=="text"){
       if (object.value!=""){
         document.getElementById("select").style.visibility="hidden";
         document.getElementById("select").removeAttribute("required"); 
         document.getElementById("select").setAttribute("disabled","");  
         document.getElementById("lable").style.visibility="hidden";  
       }else{
         document.getElementById("select").style.visibility="visible";  
         document.getElementById("lable").style.visibility="visible";  
         document.getElementById("select").setAttribute("required","");  
         document.getElementById("select").removeAttribute("disabled");  
       }
     }else{
       if (object.value!=""){
         document.getElementById("text").style.visibility="hidden";  
         document.getElementById("lable").style.visibility="hidden";  
         document.getElementById("text").removeAttribute("required");  
         document.getElementById("text").setAttribute("disabled","");  
       }else{
         document.getElementById("text").style.visibility="visible";  
         document.getElementById("text").setAttribute("required","");  
         document.getElementById("lable").style.visibility="visible";  
         document.getElementById("text").removeAttribute("disabled");  
       }  
     }
    
  }

<form>
    <input class="form-control col-sm-2" id="text" type="text" ng-model="buyer_cname" placeholder="Enter Buyer's Company Name" onkeyup="input(this)" required>

    <label style="text-align:center;" id="lable">Or,</label>

    <select ng-model="buyer_cname_dropdown" id="select" onchange="input(this)" required>
             <option  value="">Select the Buyer From Drop Down</option>
             <option value="test1">Test1</option>
             <option value="test2">Test2</option>
             <option value="test3">Test3</option>
    </select>
 </form>

【讨论】：