Angular JS : How i can change content of asp.net page on click button

Question

I have this page.chtml. How can I change the content with another HTML content when I click on the button "changecontent" in AngularJS using ng-click and ng-if? I call this page much time I want when I click on one I change content of one but not all the page: have you an idea, please

$scope.changeContent = function(){

    }

partial view :

<div class="container">   

                        <div class="SvgPicto col-lg-1  col-md-1  col-sm-1  col-xs-1">
                            <img src="@Url.Content("~/Resources/Common/pic_famille.svg")" />
                        </div>
                        <div class="SvgPicto col-lg-1  col-md-1  col-sm-1  col-xs-1">
                            <img src="@Url.Content("~/Resources/Common/pic_GPL_car.svg")" />
                        </div>
                    </div>
                    <br/>
                    <div class="row">
                       <div class="col-lg-4  col-md-4  col-sm-4  col-xs-4 ">
                           <button ng-click="changeContent()">Supprimer</button>
                       </div>
                     </div>
                 </div>

call view :

    <div class="container">
    <div class="row ">
        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
            <div class="row">
                @Html.Partial("~/Views/Common/ConfigurationTemplate.cshtml", new ViewDataDictionary { { "isLeft", true } })
            </div>
            <hr />

Not sure I fully understood your question. But will that answer help: stackoverflow.com/questions/35475633/… — andnik
– andnik, Commented Feb 22, 2018 at 13:17
i use a partial view 4 time in my page.chtml and i want when i click on button in my partial vue i change all the content by another content thank an advance — sani
– sani, Commented Feb 22, 2018 at 13:23

andnik · Accepted Answer · 2018-02-22 13:34:33Z

-1

If you want to make changes dynamically, I would suggest to make the following:

<div class="row" ng-show="contentToggle">
     @Html.Partial("~/Views/Common/ConfigurationTemplate.cshtml", new ViewDataDictionary { { "isLeft", true } })
</div>
<div class="row" ng-show="!contentToggle">
     @Html.Partial("~/Views/Common/ConfigurationTemplate2.cshtml", new ViewDataDictionary { { "isLeft", true } })
</div>
<input type="button" value="Toggle Content" ng-click="toggleContent()/>

And in Angular controller you would do:

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.contentToggle = true;

  $scope.toggleContent = function() {
    $scope.contentToggle = !$scopeContentToggle;
  }
});

Where ConfigurationTemplate is your first view and ConfigurationTemplate2 is a second content you want to display on click. And that you will need for four your Partial Views.

answered Feb 22, 2018 at 13:34

andnik

2,8642 gold badges26 silver badges37 bronze badges

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

26 Comments

andnik Over a year ago

@sani was it any helpful?

sani Over a year ago

yes the button is in the partial view and i need when i click in the button i change the content with another content for exemple i change all content by an <text< or <button> ...

sani Over a year ago

have you an idea please

andnik Over a year ago

if answer helped you please mark it correct. Put the button that is in my example into Partial view. I don't understand your request. Could you just provide more code to see your problem?

sani Over a year ago

I use the same partial view 4 times in the same page chtml and I want to be clicked on a button in the partial view I change the continuation of this partial view by another continues and i want to know how i can do that please

|

Collectives™ on Stack Overflow

Angular JS : How i can change content of asp.net page on click button

1 Answer 1

26 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

26 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related