Как получить значение, которое было передано модалу начальной загрузки в AngularJS

Я пытаюсь реализовать список Todo с помощью Angular JS и связать его с MySQL и PHP. У меня есть рабочий код, где кнопка, используемая для открытия модального режима, передает переменную php этому модальному модулю. Я поместил это значение в скрытое поле ввода (в модальном). Теперь я хочу получить это значение, чтобы использовать его AngularJS, потому что я снова передам его через AJAX на отдельной странице PHP. Дело в том, что он всегда возвращает неопределенное. Куда я иду с этим не так?

Код JQuery для передачи переменной и значения php в модал:

<script>
    $(document).ready(function(){
      $('#editModal').on('show.bs.modal', function (e) {
        var id = $(e.relatedTarget).data('id');
        $("#new-taskID").val(id); // e.g. 3
       });
    });
</script>

"EditModal" (форма внутри начальной загрузки)

<form class="cmxform" id="editTask" name="dasd" onsubmit="return false" method="post" action="" role="form">
    <div class="col-md-12">
       <div ng-app>
             <div id="todoapp" ng-controller="TodoCtrl"> 
                <div class="form-group form-animate-text" style="margin-top:15px !important;">
                    <input type="text" class="form-text" id="new-todo" ng-model="todoText" name="allotted_time_edit" ng-keyup="addTodo()" required>
                    <span class="bar"></span>
                    <label>What needs to be done?</label>
                    <input type="hidden" class="form-text" id="new-taskID"  value = "" name="new-taskID" required> //the passed value is placed here
                </div>

            <section id="main" style="display: block;">
                <div ng-show="isTodo()">
                    <input id="toggle-all" type="checkbox" ng-model="markAll" ng-click="toggleMarkAll()"/>
                    <label for="toggle-all">Mark all as complete</label>
                </div>

                <ul id="todo-list" class="unstyled">
                    <li ng-repeat="todo in todos" ng-dblclick="toggleEditMode()">
                    <div class="view" ng-keyup="editTodo()">
                        <input type="checkbox" ng-model="todo.done"/>
                        <span class="done-{{todo.done}}" >{{todo.text}}</span>
                    </div>
                    <input class="edit" type="text" ng-model="todo.text" ng-keyup="editOnEnter(todo)"/>
                    </li>
                </ul>
            </section>

            <footer style="display: block;">
                <div class="todo-count">{{remaining()}} of {{todos.length}} remaining</div>
                <a id="clear-completed" ng-click="clear()" ng-show="hasDone()">
                Clear <span >{{(todos.length - remaining())}} {{itemText()}}</span>.</a>
            </footer>
        </div>
    </div>
    </div>
    <center>
        <button id="send" type="submit" class="btn btn-primary" name="dasd">Update</button>
        <button type="button" class="btn btn-danger"data-dismiss="modal">Cancel</button>
    </center>
</form>

Код AngularJS

<script>
    function TodoCtrl($scope, $http) {

        $scope.todos = [];
        $scope.markAll = false;


        $scope.addTodo = function(item) {
        var name = $scope.todoText;
        var id = document.getElementById('new-taskID').val;
        alert(id); //return undefined
        if(event.keyCode == 13 && name){
            $http.post("ajax-search/add_checklist.php?item="+name).success(function(data){ $scope.todos.push({text:$scope.todoText, done:false});                                
            $scope.todoText = '';
             });
           }
         };

        $scope.isTodo = function(){
            return $scope.todos.length > 0;  
        }
         $scope.toggleEditMode = function(){
             $(event.target).closest('li').toggleClass('editing');
         };
        $scope.editOnEnter = function(todo){
            if(event.keyCode == 13 && todo.text){
             $scope.toggleEditMode();
            }
        };

        $scope.remaining = function() {
            var count = 0;
            angular.forEach($scope.todos, function(todo) {
                count += todo.done ? 0 : 1;
            });
            return count;
        };

        $scope.hasDone = function() {
            return ($scope.todos.length != $scope.remaining());
        }    

        $scope.itemText = function() {
            return ($scope.todos.length - $scope.remaining() > 1) ? "items" : "item";     
        };

        $scope.toggleMarkAll = function() {
         angular.forEach($scope.todos, function(todo) {
        todo.done =$scope.markAll;
        });
         };

        $scope.clear = function() {
            var oldTodos = $scope.todos;
            $scope.todos = [];
            angular.forEach(oldTodos, function(todo) {
            if (!todo.done) $scope.todos.push(todo);
            });
            };

        }
    </script>

Мне действительно нужно получить значение, но оно возвращает неопределенное. Ваша помощь будет высоко ценится. Огромное спасибо!!

0 ответов

Другие вопросы по тегам