DISCLAIMER: While this content has been left online for learning purposes, Ops machine specifically recommends NOT using Adalo, ad it's been shown to be frighteningly insecure, incomplete, and generally near impossible to deliver with, in the time that we used it.

Further, the Pragmaflow component library is no longer maintained after having been broken repeatedly by adalo platform updates.

‍

‍

‍

In this video we go through creating a form that does not use the standard Adalo form that will still validate the required fields.
‍

‍

Transcripts

‍

We're gonna show how to make field validation on custom form so that you can create custom items and still have field validation. So we'll go to the standard form first. So this is just where you drag and drop the form component onto the screen and wire it up. If I go create my collection, it says the field is required.

If I type something in it will finish it. Blank out. We'll just go back. We can see that it created the record, but what if we wanted to do that without using the stock standard form so we can create something better than this field is required and the user and name we want to edit. So the way we do that is we can create a custom form ourselves where when we create the record, it'll give us the errors that we want.

And when we type something in, so right now I was just playing around with it. So this would have an error message. We'll go into the app to figure out why that didn't pop up, but it was because I deleted collections and added collections. So I choose one. When I create a record, go now have the second one.

So we had error validation on the second one. So the standard form, you just drag drop the form. It's a collection of my collection. I wanna create a new record. We say this field is required and we can change the text. This field is required and we can change the text. The reason why we gotta drop down here is because my database structure, I have a link to the user.

So when you have a link to the user where a user can only have, or this collection can only belong to one user, then it shows up as a dropdown menu. So you're done. Let's actually just figure out this one here. I'll go through all of these, actually, let's go through it together. We'll figure it out together.

So now what we do is we can just put our own text box. This is a plain text box. We put our own text input, pretty this up, please enter a name. So we have the error here. This error will show up. It's sometimes visible. If the text error is equal to true. So let's actually jump over and figure out what's going.

We made an unlinked page here. So if we see there's no links coming into this and we're using text inputs to just do the input validation. So if we sit this value here to true, it will show this here because it's sometimes visible. We don't need that. So for every input field we have here on the validation page, we'd have one of these.

So this one belongs to this belongs with this. So we put in the text, choose a user. We have the dropdown is the list of users. We can, pretty this out, however we want. And then here, this will be sometimes visible. If the item error is equal to true. So if this here is equal to true, oh, sorry.

This one. Reverse the orders. So this one's for this one's for this. So we have sometimes visible. Now what we do is when we click on create a record, we're gonna change these values. So actions happen in cascading orders. So this will happen before this, which happens before this, which happens before this, which happens before this.

So we're gonna change the item error. So this one right here. To true if there that's why it wasn't showing. Cause I had deleted something. If the action will only happen, if the selected user is equal to empty. So if this is empty, we set the item error, which is this to the word. True. The next thing we do is set the item error to empty.

If. Fix this problem. If the selected user is equal to is not equal to empty. So if they have selected a value, then we're gonna set this to blank and we do the same thing. So you're gonna have for every input field, which is why it takes a bit more work, but you can make some really nice UX with it for every single input field you have here, you will have two actions, one to set it to, one to set that there's an error.

One to set that there's not an error. So we do the same thing, set the text error to true. If the input is equal to empty set the text error to empty. If the input is not equal to empty. And then what we do is we have another thing here. I left it visible for now, but we'll make it invisible. So the default value for this text box is item error.

Text error and you'll have every one of these. So if you have four validation fields, five validation fields, you'd have five of these here. And this way we can create my collection. The name that we're gonna associate is this field here. And the user we're gonna associate is from this dropdown here, but this will only happen sometimes if the form error is equal to empty, which means that if this step here set the item error to true, this value here will have the word true in it.

So we'll do it again. Custom form. Create the record already. Default. Let's actually unselect this. There you must. So we have true and true here. So because we have two, so this is not equal to empty. If we solve this problem,

only this one's there. So we only have a single true, but this true is making this pop up. We select a user create record. Then we blanked the form out after actually let's do that step now. I'm not gonna bother you guys can do it. This is long enough. So when we did that, we now have the record added.

It was added only once and only one record because the other ones didn't get created because this was not equal to true. So that's it just a quick tip on how to make some nicer forms instead of the stock Adela form. This way you can actually go put things side by side. Make a nicer experience.

You can make the cascading list. Anything you want.