2016-09-26 11 views
1

問題があります。angular.jsを使用して動的にテキストフィールドを有効にする必要があります。私は以下のコードを説明しています。Angular.jsを使用してテキストフィールドを動的に有効にできません

<tr ng-repeat="gl in galleryDatas"> 
<td><input type="checkbox" ng-change="clickedRow(gl.checked,$index)" name="" ng-model="gl.checked"> {{$index+1}}</td> 
<td><img ng-src="upload/{{gl.image}}" border="0" name="image" style="width:100px; height:100px;" /></td> 
<td><textarea id="address" name="desc" class="form-control oditek-form" placeholder="Add comment" rows="6" ng-model="gl.description" style="height:70px" ng-readonly="gl.galComnt"></textarea></td> 
<td> 
<a class="btn btn-xs btn-success" title="Edit" ng-click="editComment(gl.gallery_id,$index,gl.description)"><i class="fa fa-pencil-square-o fa-fw"></i>{{gl.galEDit}}</a> 
</td> 
</tr> 

マイコン側のコードを以下に示します。

$http({ 
       method:'POST', 
       url:"php/customerInfo.php", 
       data:imageData, 
       headers: { 'Content-Type': 'application/x-www-form-urlencoded' } 
      }).then(function successCallback(response){ 
       $scope.formDiv=false; 
       $scope.gallery=true; 
       $scope.galleryDatas=[]; 
       for(var i=0;i<response.data.length;i++){ 
        var data={'gallery_id':response.data[i]. gallery_id,'subcat_id':response.data[i].subcat_id,'image':response.data[i].image,'description':response.data[i].description,'galComnt':true,'galEDit':"Edit"}; 
        $scope.galleryDatas.push(data); 
       } 
      } 

ここでは、ユーザーが編集ボタンをクリックしている間に、それぞれの行記述フィールドが編集可能になります。私のコードは以下の通りです。

$scope.editComment=function(galid,index,comnt){ 
     if($scope.galleryDatas[index].galEDit=="Edit"){ 
      $scope.galleryDatas[index].galEDit="Update"; 
      $scope.galleryDatas[index].galComnt=false; 
     } 
} 

しかし、ここでは機能しません。ここで私はユーザーが任意の行の編集ボタンをクリックする必要がある、それぞれの行のテキスト領域が編集可能になります。私を助けてください。

+0

あなたのコードが正常に動作しているはずです。コンソールログを参照してください。 –

+0

コンソールでエラーが表示されません。 – subhra

+0

私はplunkerのデモデータであなたのコードをチェックしました。正常に動作していた –

答えて

0

あなたはだけでなくeditComment関数にglオブジェクトを渡し、(あなたがng-repeatに複数のフィルタを使用する場合でも、より多くの)混乱で終わるだろうというindexで遊んでするべきではありません。オブジェクト内で変更されたものは、オリジナルのリファレンスとビューに反映されます。

ng-click="editComment(gl)" 

コード

$scope.editComment=function(gl){ 
    if(gl.galEDit=="Edit"){ 
     gl.galEDit="Update"; 
     gl.galComnt=false; 
    } 
} 

clickedRow機能のために同じことを実行します。

+0

いいえ、動作しません。 – subhra

+0

他の関数clickedRowについても同じ変更をしました –

+0

'clickedRow'関数が呼び出され、チェックボックスがオンになっています。しかし、ここでは、最初にチェックボックスをチェックする必要はありません。 – subhra

関連する問題