angularjs total rows

Just putting this out there.  My example is there a way to have a total but after the total I can only change the total amount.
So if  flag: true it will total the last 2 textboxes.  But after it totals I want to change the total.  For some cases a user will change the total and some cases the user will not.  If you have a better way or even another object I can add to help this problem, will be greatly appreciated.

https://jsfiddle.net/sevensnake/faoc0Lrj/3/
LVL 9
Seven priceFull StackAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Pravin AsarPrincipal Systems EngineerCommented:
One way to control what can be edited or not is use of "readonly" attribute with text box.

e.g.

<input  name="tb1" type="text" value="123'  readonly>

Only thing is dynamically assign/remove the attribute based on the flag value.
Is the flag value changes when user is working in the form ??
Seven priceFull StackAuthor Commented:
Have example
leakim971PluritechnicianCommented:
<input type="text" ng-model="total" ng-readonly="flag" />

Open in new window

Your Guide to Achieving IT Business Success

The IT Service Excellence Tool Kit has best practices to keep your clients happy and business booming. Inside, you’ll find everything you need to increase client satisfaction and retention, become more competitive, and increase your overall success.

Seven priceFull StackAuthor Commented:
Doesn't work
BigRatCommented:
I'm sorry but I don't understand the problem, and this is probably because the data is inconsistant.

The most important thging about develop,ment with Angular is the MVC paradign and the Model part is paramount.

Your data is an array of inconsistant rows, unit_price and quantity appearing in the first element, but quantity appears never again. mytotal appears only when flag is true, and it appears that you have in fact four groups - since group takes on four values. It looks like you want to display each element of the group with a total for that group, and a total for all the groups. And it appears from the question that for some groups the totals are not allowed to change.

I would suggest "redesigning" the data into an array of groups, each group being an object with the rows as an array, a total for that group and a flag or whatever to designate what you want to do  with it. Once again, get the Model correct and the rest will be simple.

Hope that helps
Seven priceFull StackAuthor Commented:
Well that is the purpose of asking if someone have a better idea on the design. everyone want the quick answer but cannot help solve the problem. Sometime if you like to help like I do on occasion I take time to see if there is a better way or more efficient way. Dont worry a true expert will help me figure a good way to design this function instead of quick ideas and bunch of talk. Thanks
BigRatCommented:
I'm sorry, but I meant that in the nicest possible way. One needs to start with the data, and before I can add code I need to understand what the data represents. Obviously unit_price and quantity are clear, but what is the purpose of flag and group?
Seven priceFull StackAuthor Commented:
Well the flag is just to identify the total of the group. But a user sometime needs to change the price manually of the total. They will only touch the total field if it changes. they will not touch the false input unless the want the total to match. I ask if another field or object can be added to get this working. I can invoke a object.
Seven priceFull StackAuthor Commented:
Maybe using the $index but not sure to implement this with this function.
BigRatCommented:
$index just tells you the row number. I don't see how that helps.

In a group of entries you want a subtotal which initially is the sum of the unit_prices times the quantities. The total at the end should be the sum of the subtotals. I presume that the user is not allowed to change the total at the end, but may change the subtotal. Does he do this by altering the quantity or price, or is he allowed to alter the subtotal field?
Pravin AsarPrincipal Systems EngineerCommented:
Abiding to your current  model, here is one attempt. I am just checking the value of mytotal,


    <div class="form-control2" ng-repeat="row in rows">
        <!-- Attribute  mytotal is set to 'total'-->
        <span ng-if="row.mytotal == 'total'">
            Total Group: {{row.group}}
            <input type="number"  style="font-weight: bold;" readonly class="form-control" ng-model="row.unit_price" ng-change="setTotals()"/>{{row.mytotal}}
        </span>
        <!-- No Attribute mytotal -->
        <span ng-if="!row.mytotal">
            Group Item {{row.group}}: <input type="number" class="form-control" ng-model="row.unit_price" ng-change="setTotals()"/>
        </span>
        <br/>
    </div>
    <div style="padding-top:20px;">Total of all rows: {{total | currency:'€'}}</div>
Seven priceFull StackAuthor Commented:
https://jsfiddle.net/sevensnake/g6r3rcxf/1/

Ok I added it to to the demo. but
Pravin AsarPrincipal Systems EngineerCommented:
Please clarify  your statement

 For some cases a user will change the total and some cases the user will not.

What cases user will change and when he will not be allowed to change,
What he is changing ? Individual  item in a group or group total ?

Also your has  post. I see only Ok I added it to to the demo. but

Are there supposed be any more words ?
Seven priceFull StackAuthor Commented:
Sorry. the user will change the total only when a user enters into the total field. Other than that the total will calculate if a user types in any group that is false. Now the other problem is if there is a total in a single group and you type into group 1 and there is a single group like group 4. As soon as you type into group 1 group 4 goes blank or retrieves the total of group 1.  Which is even weirder. ( if that is a word )
Pravin AsarPrincipal Systems EngineerCommented:
Okay,

Look at this

https://jsfiddle.net/pravinasar/frLrydtu/1/

<< Code added from jsfiddle by MR Wolfe>>
JAVASCRIPT
/**
 * Created by Pravin on 12/28/2015.
 */
var app = angular.module('myApp', []);
app.controller('MainCtrl', function ($scope) {
    $scope.total = 0;
    $scope.rows = [
        {
            unit_price: 1,
            quantity: 1,
            flag: false,
            editable: true,
            group: 1
        },
        {
            unit_price: 2,
            quantity: 1,
            flag: false,
            editable: true,
            group: 1
        },
        {
            unit_price: 2,
            quantity: 1,
            mytotal: 'total',
            editable: false,
            flag: true,
            group: 1
        },
        {
            unit_price: 3,
            quantity: 1,
            editable: true,
            flag: false,
            group: 2
        },
        {
            unit_price: 4,
            quantity: 1,
            editable: true,
            flag: false,
            group: 2
        },
        {
            unit_price: 0,
            quantity: 1,
            flag: true,
            mytotal: 'total',
            editable: false,
            group: 2
        },
        {
            unit_price: 2,
            quantity: 0,
            flag: true,
            editable: true,
            mytotal: 'total',
            group: 3
        },
        {
            unit_price: 1,
            quantity: 0,
            flag: true,
            mytotal: 'total',
            editable: true,
            group: 4
        }
    ];
    $scope.showtotal = function () {

    }
    $scope.setTotals = function () {
        $scope.total = 0;
        angular.forEach($scope.rows, function (row) {
            if (!row.editable) {
                var sum = 0;
                row.sum = sum;
                for (var rx=0; rx <$scope.rows.length; rx++) {
                    var cRow = $scope.rows[rx];
                    if (row.group == cRow.group) {
                        sum += cRow.sum;
                    }
                }
                row.sum = sum;
            }
            else {
                row.sum = row.quantity * row.unit_price;
                $scope.total += row.sum;
            }
        })
    }
    $scope.setTotals();
    /*
     $scope.$watch('rows', function () {
     $scope.total = 0
     angular.forEach($scope.rows, function(row){
     $scope.total += row.unit_price * 1
     })
     }, true) */
});

Open in new window

HTML
<div ng-controller="MainCtrl">
    <div class="form-control2" ng-repeat="row in rows">
        <!-- Attribute  editable is set to false -->
        <span  ng-if="!row.editable" style="padding-left: 200px;">
            GROUP TOTAL {{row.group}} : <input type="number"  style="color: #ff9933; font-weight: bold;"  class="form-control" ng-model="row.sum" ng-change="setTotals()"/>
        </span>
        <!-- Attribute editable is set as true -->
        <span ng-if="row.editable == true">
            <span>
                QTY:<input type="number" class="form-control" ng-model="row.quantity" ng-change="setTotals()"/>
                * PRICE :{{row.unit_price}}=
            </span>
            <span>
                <input type="number" class="form-control" ng-model="row.sum" ng-change="setTotals()"/>
            </span>
        </span>
        <br/>
    </div>
    <div style="padding-top:20px;">Total of all rows: {{total}}</div>

</div>

Open in new window


If this works for you. For demo, purpose, I have set Quantity field also.
Have to update your model definition.
So before implementing/adapting the content of this comment, look at the model (javascript) too,

Good Luck!

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Seven priceFull StackAuthor Commented:
Close my friend. but not just the single total editable but the other group totals must be editable also.
the algorithm is very difficult to come up with.
BigRatCommented:
I see Pravin that you have added extra data to the original model. It seems to be that the data model consists of a set of groups with a summation. Each group consists of a set of objects each being a field quantity and a field unit_price. Each group has a summation of quantity times unit_price. This field is either editable or not. One presumes that the quantity and unit_price fields are not editable (?) and one presumes that quantity times unit_price need to be displayed(?)

The questioner has flattened this structure and in consequence added a group number. To denote the end of a group, a flag has also been added (as far as I can see)

So the data = { groups: [ ], total: 0} where the array is an array of {rows:[ ], subtotal:0, flag: true} (flag is false if the subtotal is not editable) and the rows array is an array of {unit_price:123, quantity: 0}

With this data structure it is relatively easy to generate the appropiate HTML (two iterations together with a test for editable or not).
Seven priceFull StackAuthor Commented:
BigRat This structure is way beyond of a single row of data. Add a object to the json but adding additional input boxes defeats the purpose of what is needed to accomplish this. Theres another developer expert want to jump on this really bad. but he needs a day to come back into the country. The answer to this problem is not easy nor can anyone solve it. I found a problem looks like someone top of there game can only solve or bill gates.
BigRatCommented:
>>This structure is way beyond of a single row of data.

Who said anything about a SINGLE row of data? I'm sorry to say, but your English is so bad we just don't understand the problem. This sentence, for example, makes no sense, sorry

>> I found a problem looks like someone top of there game can only solve or bill gates.
Seven priceFull StackAuthor Commented:
Understand this. You have an example of the obvious. I am not trying to be engrossed you but my mistake it is dyamic rows with on column. not 2 or 3. you have to be a little slow. Let me explain it like a baby Rat.
Like to edit the GROUP TOTAL. That means change the value after the total has been calculated for each group. CHANGE THE TOTAL IN GROUP TOTAL. CHANGE THE TOTAL IN GROUP TOTAL. CHANGE THE TOTAL IN GROUP Total can you understand that.
BigRatCommented:
I'm sorry you feel that way, but if you must insult me, please try to get the English correct.
 
>> I am not trying to be engrossed you but my mistake it is dyamic rows with on column.

This sentence again makes no sense. Would you care to try in your own language, maybe I'd stand a better chance?
Pravin AsarPrincipal Systems EngineerCommented:
SevenSnake77,

Until now, I was very patient with you. But now looks like you have crossed the limit and using unacceptable language.

At the end of year, instead of thanking experts, you seem to be using curse word


From the trail of comments, one may conclude you were wasting everyone time and would like  Bill Gates to answer your prayers

Normally I do not try to show off who I am. Definitely time permitting from your ranting and insulting others, check out my credentials at http://www.pravinasar.com

I have and can solve much tough problems.

Definitely you were not receptive and do not deserve advice from EE community.

I will recommend EE Admin to suspend or blacklist you for a while. Also I appeal other to send similar request to EE Admin. One bad apple can definitely ruin entire crop :)


Everyone: Have a wonderful year ahead. We look forward to Excellent 2016
Seven priceFull StackAuthor Commented:
what ever. I been on here for 8 years and helped thousands and never been insulted. recommend what you want.
Seven priceFull StackAuthor Commented:
Pravin Asar I have no problem with you. I think you came up with a great way I can see how I can possibly fix my problem .
You on the other hand have tried to help me and I do apologize. very unprofessional and I was having a bad day. Please forgive the out burst.  Some guys just come on here to prove they can talk the talk but cannot walk the walk. I met a lot of guys in this business who get the job because of the articulate words but cannot program for anything.
again forgive me.
Seven priceFull StackAuthor Commented:
Thanks again.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.