Display value of a textbox inside another textbox using AngularJs on button click

Question

New in AngularJs. Finding it complex a little. I have created two text box and a button. Now I want, first I will write something inside the first text box. Then I will click on the button. After that the value of the first text box will get displayed inside the second text box. I have written very little code, I didn't even mentioned the button click function as I am confused on that. Please help me to go further.

<script src="../../Scripts/angular.min.js" type="text/javascript"></script>
</head>
<body>
    <div ng-app="">
        <input type="text" ng-model="type">
        <br />
        <br />
        <input type="button" value="button" onclick="myFunction()" />
        <br />
        <br />
        <input type="text" ng-model="display" />
    </div>
</body>

Debasish Mohapatra · Accepted Answer · 2015-06-16 07:54:11Z

3

in your controller do ,

$scope.myFunction = function () {
    $scope.display = $scope.type;
}

in your html you have to change onclick to ng-click,

<input type="button" value="button" ng-click="myFunction()" />

see this plunk for example, http://plnkr.co/edit/c5Ho1jlixwZFx7pLFm9D?p=preview

edited Jun 16, 2015 at 7:54

answered Jun 16, 2015 at 7:40

Debasish Mohapatra

8564 silver badges8 bronze badges

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

3 Comments

Amit Over a year ago

Can you please explain because I am not understanding that in controller where should I place the code..

Debasish Mohapatra Over a year ago

i have attached the plunk, see it to understand

Amit Over a year ago

I am working in mvc, and in webapplication, in both of then ng-click, ng-app this all are showing error. Why? What thing i need to add to remove the errors from the "ng" tag

Umesh Kolapkar · Accepted Answer · 2015-06-16 09:09:31Z

0

Check whether you have included angular js file in your HTML.

//add below snippet in your HTML head tag

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js">     </script>

edited Jun 16, 2015 at 9:09

answered Jun 16, 2015 at 8:50

Umesh Kolapkar

224 bronze badges

4 Comments

Umesh Kolapkar Over a year ago

//add below snippet in your HTML head tag <script src="ajax.googleapis.com/ajax/libs/angularjs/1.3.14/…>

Umesh Kolapkar Over a year ago

if not..donwload angular js file and save it locally and add the local path in your HTML head tag

Amit Over a year ago

I have downloaded angular.min.js file and added it in my project.

Amit Over a year ago

Let us continue this discussion in chat.

Collectives™ on Stack Overflow

Display value of a textbox inside another textbox using AngularJs on button click

2 Answers 2

3 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related