Repeater - need SUM with inline edit

advanced-prototyping
repeater-widget

#1

I have a need for a widget with inline editing where there are 8 fields/cells. The last 5 accept numerical values, the first two accept string values and the 3rd is a TOTAL calculating a SUM for the last 5 cells. I have a widget I put together but I cannot get it to work as I want. When clicking the "edit’ icon I want the existing values to remain in the fields and when they are updated - after clicking the ‘check mark’ - the updated fields show the current value and the ‘total’ field shows the sum for all the values in the last 5 fields/cells. I am attaching the .rp file in case someone can help.

In short - repeater loads, pulls initial values from data source, repeater has an EDIT icon (pencil) when clicked the repeater opens in EDIT mode where fields/cells can be edited. Once in edit mode the pencil icon turns to a green check… and all fields except the 3rd (total) field are editable. After all numeric fields have been updated as needed, the green check is clicked and the repeater reverts back to the start mode, and the updated values show in the numerical cells and the sum for the last 5 fields shows in the TOTAL field (3rd column).

Every time I click the pencil I get the same values populating, and it has gotten me frustrated. I have global vars set and they are updating but I cannot seem to get the updated values to show.

Axure_SUM_with-inline-edit.rp (1.1 MB)


#2

It looks like you are populating global variables, but then not updating the rows in your ‘edit mode’ repeater with those global variables. Every time you click the pencil icon, this is just loading the default repeater values from scratch, because nothing has told it to fetch the stored global variables.

I would do a check on clicking that pencil icon to see if the global variables are anything but blank. Then if they are (i.e. the values have been set), mark the rows in the repeater and update them.

You may wish to put the different dynamic panel states inside a single repeater by the way, rather than trading data back and forth between two different repeaters via global variables. Might make it a bit easier to keep track of what has changed and where…


#3

Can you show me an example of what you mean by putting the different dynamic panel states inside a single repeater, using the file I uploaded?


#4

It looks like you are overcomplicating the realization. Changing the sate of inputs much easier by “enable/disable” action – and you won’t have to create multiple copies of elements, remember and pass any states.

Check it – Axure_SUM_with-inline-edit_1.rp (1.1 MB)

However, “Add new” button will still refresh values, and there is no simple way to avoid it. You will have either to create a global variable for every cell in every repeater row (including rows which can be added by the “Add new” button), or set the “Add new” button to show already existing other element instead of modifying the existing repeater.


#5

This seems to be working better now, but only updates the TOTAL when you manually enter changed values in the cells. Why use the increment mechanism in each cell, if it does not update the TOTAL?


#6

It looks like it’s an Axure drawback that “on text change” event isn’t triggered when text is changed by increment mechanism. The control with the arrows appears automatically when you set inputs type to “number”.


#7

Agreeing with adverico, now that I’ve dug into your file a bit, you can make this a lot simpler, by having a single state and using styles to, for example, change the field borders to red. Then you don’t need to copy values back and forth between multiple versions of the same field.

In terms of the ‘Add New’, there is a way to do it without a zillion global variables, detailed by Gregor in this thread.