S
S
Stas2016-06-08 22:29:55
Angular
Stas, 2016-06-08 22:29:55

Visibility of angularjs variables, and acardion?

Good people, tell me please, I am very weak in angularjs, and in js in general. But here we had to face it. Here is the code and markup.

<!doctype html>
<html ng-app="test">
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-resource.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-animate.js"></script>
        <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-1.3.3.js"></script>
        <script src="js/bootstrap.js" type="text/javascript"></script>
        <script src="js/skript.js" ></script>
        <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
        <link href="css/bootstrap-theme.min.css" rel="stylesheet" type="text/css"/>
    </head>
    <body ng-controller="AccordionDemoCtrl">




    <uib-accordion>
        <uib-accordion-group is-open="status.jopen">
            <uib-accordion-heading>
                SOLR <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': status.jopen, 'glyphicon-chevron-right': !status.jopen}"></i>
            </uib-accordion-heading>

            <div class="row">
                <div class="col-md-6">
                    <p class="input-group">
                        <input type="text" class="form-control" uib-datepicker-popup ng-model="fromPublishDate" is-open="popup1.opened" datepicker-options="dateOptions" ng-required="true" close-text="Close" alt-input-formats="altInputFormats" />
                        <span class="input-group-btn">
                            <button type="button" class="btn btn-default" ng-click="open1()"><i class="glyphicon glyphicon-calendar"></i></button>
                        </span>
                        <input type="text" class="form-control" uib-datepicker-popup ng-model="toPublishDate" is-open="popup2.opened" datepicker-options="dateOptions" ng-required="true" close-text="Close" alt-input-formats="altInputFormats" />
                        <span class="input-group-btn">
                            <button type="button" class="btn btn-default" ng-click="open2()"><i class="glyphicon glyphicon-calendar"></i></button>
                        </span>
                        <button ng-click="solr()" class="btn btn-default">Найти</button><br/>
                    </p>
                </div>

            </div>

        </uib-accordion-group>
        <uib-accordion-group is-open="status.open">
            <uib-accordion-heading>
                DB <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': status.open, 'glyphicon-chevron-right': !status.open}"></i>
            </uib-accordion-heading>

            <div class="row">
                <div class="col-md-6">
                    <p class="input-group">
                        <input type="text" class="form-control" uib-datepicker-popup="{{format}}" ng-model="from" is-open="popup1.opened" datepicker-options="dateOptions" ng-required="true" close-text="Close" alt-input-formats="altInputFormats" />
                        <span class="input-group-btn">
                            <button type="button" class="btn btn-default" ng-click="open1()"><i class="glyphicon glyphicon-calendar"></i></button>
                        </span>
                        <input type="text" class="form-control" uib-datepicker-popup="{{format}}" ng-model="to" is-open="popup2.opened" datepicker-options="dateOptions" ng-required="true" close-text="Close" alt-input-formats="altInputFormats" />
                        <span class="input-group-btn">
                            <button type="button" class="btn btn-default" ng-click="open2()"><i class="glyphicon glyphicon-calendar"></i></button>
                        </span>
                        <button ng-click="db()" class="btn btn-default">Найти</button><br/>
                    </p>
                </div>
            </div>
        </uib-accordion-group>
    </uib-accordion>


    <ol ng-repeat="i in j">
        <li>{{i}}</li>

    </ol>



</body>
</html>

angular.module('test', ['ngAnimate', 'ui.bootstrap', 'ngResource']);
angular.module('test').controller('AccordionDemoCtrl', function ($scope, $resource) {

    var Answer = $resource('/query-solr', {fromPublishDate: "@fromPublishDate", toPublishDate: "@toPublishDate"});
    var AnswerDb = $resource('/query-base', {from: "@from", to: "@to"}, {headers: {'something': 'anything'}});
    $scope.solr = function () {

        Answer.get({fromPublishDate: $scope.fromPublishDate , toPublishDate: $scope.toPublishDate}, function (answer) {
            $scope.answer = answer;
            $scope.j = JSON.parse($scope.answer.message);
        }, function (answer) {
            $scope.j = answer.data;
        });
    };

    $scope.db = function () {

        AnswerDb.get({from: $scope.from, to: $scope.to}, function (answer) {
            $scope.answer = answer;
        }, function (answer) {
            $scope.answer = answer.data;
        });
    };

    $scope.open1 = function () {
        $scope.popup1.opened = true;
    };

    $scope.open2 = function () {
        $scope.popup2.opened = true;
    };


    $scope.popup1 = {
        opened: false
    };

    $scope.popup2 = {
        opened: false
    };



});

The question is that the variables fromPublishDate, and toPublishDate when the input blocks are inside the accordion, are not visible, that is, they can be visible, but $scope.fromPublishDate does not get there. Tell me what's the matter, and how to solve the problem ??

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question