Editable Row in Axure RP 8

Hi Friends, I have just started learning Axure, and got a project which involves more editable tables. The scenario is given below.

  1. I have a page with a drop down list.
  2. Selecting a list item will show a corresponding table with 2 to 3 rows of data and more than 5 to 6 columns, below the drop down list.
  3. I have 2 action links on top of the page. One is “Edit” and another one is “Save”.
  4. This table with 2 rows become editable when i click on Edit link.
  5. I can change the content in the rows and click Save link on top.
  6. Here is the problem i face. The changed content in the editable mode is not getting updated in the actual data display in the table.

Can somebody please help me out in this? Thanks!

I think this is what you need?

https://www.axure.com/support/training/add-delete-update-repeater-rows-tutorial

Hi ensiva2012,

If you post a sample file, showing how you’ve got everything set up, it will be easier to help figure out what’s going wrong. Are you using a repeater?

-skb

Hi Murray & SKB,

  • I am attaching a file with both repeater and normal show hide to achieve this.
  • I have given Option 1 with just Show and Hide technique that shows as if it is a table data.
  • In Option 2 i used a repeater. In the drop down you have to select an option and the table appears.
  • Then click on Edit icon link and the table enters to editable mode.
  • Update the content for whichever cell and click Save icon link. Now, i need a background color for only those cells that are editted. Not for full row. This is 1 requirement.
  • Another requirement is, Not only highlighting the updating cells, but also on mouse over we need to show the previous value.
    For example the first row and first column initially had A text. After updating the cell value to B text. This first row and first column cell should have a highlighted background color with B Text. On mouseover of it, it should show “Previous Value: A” in a tooltip.
    Hope you understand the requirement.Testing_Table.rp (130.1 KB)
1 Like

I am working on a repeater table with multiple columns. Some of the items in one of the columns need to be different colors. (red for failed, green for completed jobs etc.) This column is also filterable so one can see all the “X” jobs at once. Is there any way to do this?
Thanks!!
JFB

Hi jboo777!

Yep, you can do this by adding a Selected interaction style to the repeater widget to say red, when its default color is green. Using the OnItemLoad of the repeater, add a conditional case to set the selected of the widget to “true” if the value in the column == x. You could then also use the column with the x value for the filter interaction:

[[Item.Failed == ‘x’]]

I’ve added an example file to demonstrate this. Lmk if you have any questions!

RepeaterX.rp (56.8 KB)

Hello ensiva2012… I realize this is late in the game but I have/had an issue trying to get an inline edit functionality working for Axure and your design ( Testing_Table.rp ) seems to work best of all that I have seen, and it basically includes all that I am looking to do with my prototype. I have a couple of questions on this model though. When updating a cell in the “edit mode” what exactly is being updated… is it the label or the TF? I wish to know because I want to carry the value saved to another page. I know I can store values in the Global vars but I am not sure what to pass to the vars to save.