How to append input box value between scopes in AngularJS

Question

I was reading this example http://jsfiddle.net/7n8NR/3/ in this example once you click on add to list it added your entered data in Unchecked: array below with check item button and when you press check item button it pushes the values in Checked item array. This is very simple example. What I am going to trying is I have added new input text box in Unchecked: array and trying to send their value to the Checked item array but it is not updating. My working demo is here http://jsfiddle.net/7n8NR/240/

Controller:

// Add a Item to the list
$scope.addItem = function () {

    $scope.items.push({
        amount: $scope.itemAmount,
        name: $scope.itemName,
        //This one I have added
        qty: $scope.qty
    })

HTML:

     <table>
         <tr ng-repeat="item in items" class="item-unchecked">
            <td><b>amount:</b> {{item.amount}} -</td>
            <td><b>name:</b> {{item.name}} -</td>
             /*This is one I have added*/
            <td><b>qty:</b> <input type="number" ng-model="qty" /></td>
         </tr>
     </table>
        <button ng-click="toggleChecked($index)">check item</button>

I am just attempting but don't know the correct way of doing this. Please any one can help on this. Thanks in advance.

I don't see any qty stuff in that fiddle, and it's not really clear to me what "it is not updating" means. — ivarni
– ivarni, Commented Aug 14, 2014 at 7:41
Not updating means once enter any value in the input box which I had added in the Unchecked array it should added in the Checked array. — tutorialfeed
– tutorialfeed, Commented Aug 14, 2014 at 8:00

Rabi · Accepted Answer · 2014-08-14 08:08:11Z

1

I just made some changes to your code (added qty filed to the model) . now its working .

But the main reason it was not working was - since this line :

<button ng-click="toggleChecked($index)">check item</button>

was outside of ng-repeat, toggleChecked($index) doesn't get the index value .

here is the updated script : http://jsfiddle.net/7n8NR/242/

edited Aug 14, 2014 at 8:08

answered Aug 14, 2014 at 7:47

Rabi

2,23019 silver badges18 bronze badges

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

2 Comments

tutorialfeed Over a year ago

Thanks for your reply Rabi. Can you share js fiddle url I am not able to see the changes.

tutorialfeed Over a year ago

Looks great but I don't want to repeat the check item button that's why I had kept outside the table. Is there any way that button should not repeat. Thanks.

Collectives™ on Stack Overflow

How to append input box value between scopes in AngularJS

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related