2015-06-15 48 views
1

我有兩個列表框,我必須將項目從一個列表框移動到另一個列表框。我能夠實現這一部分。現在我想將第二個列表框中的所有項目列表與該ID一起保存到數據庫中。 我沒有收到第二個列表框中的ID。 獲取列表框中的所有項目並將其發送給控制器的最佳方法是什麼? 代碼:未從多選列表框中的選定值中獲取ID Angular JS

HTML:

<div class="control-group"> 
    <div class="selector"> 
     <select multiple="multiple" id="SelectLeft" ng-model="TaxId" ng-options="tax.TaxId as tax.TaxName for tax in Taxes"></select> 
    </div> 
    <input id="MoveRight" type="button" value=" >> " ng-click="MoveTaxes()" /> 
    <input id="MoveLeft" type="button" value=" << " ng-click="MoveTaxes()" /> 
    <div class="selector"> 
     <select id="SelectRight" ng-model="SelectRight" multiple="multiple"> 
     </select> 
    </div> 
</div> 

JS代碼如下:

$("#MoveRight,#MoveLeft").click(function (event) { 
    var id = $(event.target).attr("id"); 

    var selectFrom = id == "MoveRight" ? "#SelectLeft" : "#SelectRight"; 
    var moveTo = id == "MoveRight" ? "#SelectRight" : "#SelectLeft"; 
    var selectedItems = $(selectFrom + " :selected").toArray(); 
    $(moveTo).append(selectedItems); 
    selectedItems.remove; 
}); 
+4

不要在'AngularJS'中使用'jQuery' – Tushar

+0

Angular在哪裏? –

+0

JS的邏輯應該移動到你的'MoveTaxes()'功能 – Michael

回答

0

首先,我不建議在角使用jquery。 其次,當你說「發送給控制器」時,你正在考慮jquery。

現在來你的問題 -

在第二格定義ng選項。

<div class="control-group"> 
    <div class="selector"> 
     <select multiple="multiple" id="SelectLeft" ng-model="TaxId" ng-options="tax.TaxId as tax.TaxName for tax in Taxes"></select> 
    </div> 
    <input id="MoveRight" type="button" value=" >> " ng-click="MoveRight()" /> 
    <input id="MoveLeft" type="button" value=" << " ng-click="MoveLeft()" /> 
    <div class="selector"> 
      <select id="SelectRight" ng-model="SelectRight" ng-options="tax.TaxId as tax.TaxName for tax in TaxesSecond"> 
      </select> 
</div> 

立即推入第二陣列taxesSecond元件每當從左至右移動,並使用拼接反之亦然除去從第一個數組該元素。

$scope.MoveRight = function(){ 
     $scope.TaxesSecond.push($scope.selectedLeft); 
     $scope.Taxes.splice($scope.Taxes.indexOf($scope.selectedLeft),1); 
    } 

希望你可以自己寫MoveLeft。

相關問題