Динамически создавать поля выбора и назначать значения - PullRequest
Новая
       24

Динамически создавать поля выбора и назначать значения

0 голосов
/ 22 марта 2020

Внутри angular app. js Я динамически размещаю поле множественного выбора в форме с уникальным идентификатором. Как можно получить значения, выбранные в этих полях выбора внутри контроллера.

Добавлена ​​переменная 

$scope.sibling_type = {};

Javascript код для загрузки поля выбора. 

$scope.linkSiblingFinish = function(sibling){
   var str_siblingtype = "<div class='col-sm-2' style='margin-bottom:15px'>" +
     "<select ng-model='sibling_type[" + sibling.id + "]' class='form-control' id='sibling_type_"+sibling.id+"'>" +
       "<option class='ng-binding ng-scope' value='1'>Sister->Brother</option>" +
       "<option class='ng-binding ng-scope' value='2'>Brother->Sister</option>" +
       "<option class='ng-binding ng-scope' value='3'>Sister->Sister</option>" +
       "<option class='ng-binding ng-scope' value='4'>Brother->Brother</option>" +
     "</select></div>";

    document.getElementById('div_siblings').innerHTML = str_siblingtype;
}

Приведенный выше скрипт будет вызываться по нажатию кнопки, откуда переменная 'sibling' будет каждый раз загружаться с другим 'id'. Предположим, он был вызван 2 раза с идентификатором «23» и «24». Будет 2 поля выбора, такие как 'sibling_type_23' и 'sibling_type_24'.

Кнопка «Отправить» 

$scope.saveSibling = function(data){
    dataFactory.httpRequest('index.php/students/sibling/'+$scope.form.id,'POST',{},$scope.form).then(function(data) {
    });
}

Как связать / назначить значения параметров, чтобы при отправке формы я можно получить выбранные параметры в этих полях выбора внутри Laravel контроллера.

1 Ответ

0 голосов
/ 22 марта 2020

Вы можете использовать для этого другой подход:

  1. Создать новую область видимости 'sibling_type' внутри вашего контроллера. 

    $scope.sibling_type = {};

  2. Затем обновите ng-model для всех динамических элементов c внутри linkSiblingFinish, например: 

    "<select ng-model='sibling_type[" + sibling.id + "]' 
         class='form-control' id='sibling_type_"+sibling.id+"'>" +

  3. Теперь, когда форма отправлена, вы можете получить выбранные параметры для этих выберите коробки. как: 

    var sibling_type_23 = $scope.sibling_type['23'];
var sibling_type_24 = $scope.sibling_type['24'];

DEMO: 

const app = angular.module('myApp', []);
app.controller('AppCtrl', function ($scope) {
  $scope.siblings = [{id: 23,name: 'Sibling 23'},{id: 24,name: 'Sibling 24'}];
  $scope.sibling_type = {};
});


  
    
      
        {{sibling.name}}:
        
      
    
    {{sibling_type | json }}
...