Dynamic Form in Modal

I am trying to learn how to add dynamic buttons to my catalog page that 1.) opens a larger view of the image when clicked on and 2.) the "Order’ button opens the page’s modal that includes an order form that I want pre-populated with the catalog’s item data. If anyone can give me info about how to do this or steer me toward a tutorial would be really appreciated. Here is a simple example of what I’m looking to do in Wappler:


See attached graphic.

Use Lightbox on the anchor as in

1 Like

As Ben mentioned, using Lightbox for your first question is the way to go. As for the second answer check this thread:


Could you explain how the Data Region Region would work for me and how I would access this?


This worked very well. I’ve never used Lightbox before and it’s pretty neat! Thank you for providing your detail.

1 Like

Try having a look at this tutorial. Should give you enough to go on.

I am nearly done building my online e-cart and the last major part of the suit of pages is the critical insert data and send email alert page.

Rather than try to explain what this page is to do, I’m including a graphic. it is the most complex page in my site and I am going to need a lot of guidance to where related tutorials are and tips on how to include all the functions on this one page. I’ve done this numerous times in Dreamweaver using PHP but have no idea how to get this to work in Wappler since I don’t know where all the needed “bodies are buried”. Any help or direction would be greatly appreciated.

Put your form in a data detail region and populate the ‘Your Order’ fields that way. However, I wouldn’t add that part as a form. Anyone can change the pricing etc. Just add that as regular data bindings in a data detail region.

Don't I need to place the detail region in a form if I also want that data to be inserted into my order dB along with the customer-entered contact info collected on this form?

You can put your entire form inside a detail region. If you need to add that content along with your customer details then I would add them as hidden form fields - not ones that can be edited by the customer.

Hidden is nice for info the customer doesn’t need to see. The customer would need to see the catalog item details to confirm their order is correct: like the item’s SKU (Item Number), Description, Size and Price.

So show the item details with just regular text data bindings. But for the form put the values in hidden fields in your insert form.