Switch form from View to Edit: best practice

Need help
1

Hi all,

Here’s what I’m trying to do:

  • User fills a form that create a new thing
  • User clicks “Save” > New Thing is created
  • User is redirected to a page displaying all the New Things Fields

So far, so good.

What I don’t understand how to do:

(On the page displaying all the fields)

  • User clicks “EDIT”
  • Text blocks are transformed into Inputs
  • User modifies fields
  • User clicks “SAVE”
  • Changes to the Thing are made
  • Inputs go back to text blocks.

The easy way to do this would be to redirect user to an Edit page when clicking edit, and that page would contain the initial form but the Thing would be called and fields would be pre-filled.

But I’d like the user to be able to do this all on the same page.

I guess I need to use custom states but I can’t get my head around how to.

Thanks!

2

@smonbrun
Can you show an example??

3

Well I actually found an answer.
For those interested:

  • On the page that displays the Thing’s fields
  • Add an “Edit” Button
  • Create a group with the same fields but with inputs instead of text blocks
  • Check “Enable auto-biding”
  • Click on the group, uncheck “visible on page load”

Then on workflow: when clicking Edit Button, show Edit Group.

That does it for me but maybe there’s a better way to do it.

4

@smonbrun
Great idea!

5

You have at least two options.

  1. You duplicate the elements (text and input) and you alternate the visibility between them.

  2. You use the same input element for both things and with conditionals you change the style and disable the input(to view).

You can do this via parameter, custom state or whatever other thing you come up with. Just make sure you are taking care of permissions while doing this.

6

Thanks for the input @JonL

1 Like
7

This video might help:

2 Likes
8

Thanks Marcus.

9

In relation to my second option and @romanmg video as both use the same approach.
Make sure you are handling security on a server workflow. This is not covered by the video.

If the user shouldn’t be able to edit you shouldn’t let him run the “make change to a thing workflow”. So use “only when” condition.

Do not rely exclusively on the disabled input(or hiding/showing elements) because it(they) can be enabled on the client side very easily.

Security, on the client side, is not security :slight_smile:

10

Thanks for bringing that up.
As regards to security, how secure is the simple “if user is logged out” > back to index page ?

11

Not the best as it is quite erratic at some points. There are several posts about this.
Sometimes there is a delay between the render of the page and the redirect so someone not logged in can see the contents and the source of the page.

If you are basing all security on “logged in” because you only have one type of user(this is logged in user) you may as well add to any create/edit/delete workflow the condition “only when user is logged in”.

Besides the initial redirect.

12

Ok @JonL Thanks for these informations!

1 Like
13

This topic was automatically closed after 70 days. New replies are no longer allowed.