call div from angularjs controller

Question

I am having one div for dialog box in the html and I want that dialog box should open when the function in the controller is called.

This is my div which the function should open.

<div id="example" role="dialog" class="modal fade" 
style="top: 80px;left: 370px;right: 20px;width: 500px;
height: 600px;margin: 0;overflow: auto;">

<h6>some text</h6>
</div>

This is my function in the controller.

NumberService.getNumberList(result.auth_token).then(function(result){
                if(result.status == "success"){
                    $scope.data = result.data;
                    var Home= document.getElementById("example");
                    Home.style.display="";
                }else{
                    $scope.status = result.status;
                }
            });

I have used document.getElementByID but its not working. How to solve this problem?

You should not do DOM manipulation inside your controller. Your problem calls for using directives. You should define a custom directive to define your div and it's behavior. — Amal Antony
– Amal Antony, Commented Mar 26, 2014 at 5:06
you may use ng-show or ng-hide and set the value of varible in that your function it may works for you — Jay Bhalodi
– Jay Bhalodi, Commented Mar 26, 2014 at 5:07

Explosion Pills · Accepted Answer · 2014-03-26 05:09:02Z

1

<div id=example ng-show="data.show">

$scope.data = result.data;
$scope.data.show = true;

You can update data.show as a boolean to determine whether the element will be shown or not in the given scope.

answered Mar 26, 2014 at 5:09

Explosion Pills

192k56 gold badges341 silver badges417 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Alec Moore · Accepted Answer · 2014-03-26 05:21:46Z

0

In your html have:

<div ng-show="status == 'success'" id="example" ...>
    <h6>some text</h6>
</div>

And then in your controllers function you can manipulate the $scope.status variable:

NumberService.getNumberList(result.auth_token).then(function(result){
    if (result.status == "success"){
        $scope.data = result.data;
        $scope.status = "success";
    } 
    else {
         $scope.status = result.status;
    }
});

answered Mar 26, 2014 at 5:21

Alec Moore

1,1752 gold badges10 silver badges20 bronze badges

Collectives™ on Stack Overflow

call div from angularjs controller

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related