HTMX Forms Served From PHPRunner

This is pretty cool! Never worked with HTMX before, seems quite interesting.

I added several new examples of embedding both HTMX and HTML documents in PHPRunner containers.

You can see the results at https://customdataservices.net/site/HTMX_Forms_list.php?goto=7

FYI, the Calendar & Day Planner, Event Budget, Gantt Chart, Sales Chart examples were Excel templates that Claude Opus 4.8 converted to HTML.

Given a SQL schema, an interface example, and a little A.I...

Hope you find this useful!

This looks great, I've never worked with htmx before either, I'll need to have a look at this.

hi

It looks really beautiful. Is it possible to provide a complete project with all the examples?

gr
Jacques

Not exactly sure how to do that but this is very easy to recreate.

Create a table in your database as shown in sql.png. Create a PHPRunner project that connects to the database and configure the container field view like custom.png.

Several of the the examples were Excel templates that Claude Opus 4.8 converted to HTML. Insert the generated HTML into the container field. Boom.

In contrast, the Order Management example (https://customdataservices.net/site/HTMX_Forms_list.php?goto=14) was generated by providing Claude a database schema (ordermanagement.sql) and giving it the prompt "generate a tabbed HTMX order entry and product management application based on ordermanagement.sql. encapsulate in a Shadow DOM so it can be served from a PHPRunner container. please use PDO and incorporate as many HTMX design features as possible, this is a demonstration interface. please make all php endpoints point to the https://yourserver/ordermanagement/ directory."

You may have to go through a few iterations but eventually it produces the HTMX code to insert into the container field, the PDO code, and a detailed description and deployment README.

Again, the Shadow DOM is used to seperate the form CSS from PHPRunners. It may be beneficial to provide Claude access to PHPRunners CSS so forms adapt to style changes in PHPRunner. I haven't tried that yet. Attached are copies of the original output and their Shadow Dom-enabled versions for experimentation.

I added quite a few more examples that expand on the idea of serving HTML or HTMX form interfaces from PHPRunner container fields.

New examples can be seen starting at https://customdataservices.net/site/HTMX_Forms_list.php?goto=11

In the process, I found that you can start with an Excel file, a PDF file, a screenshot of a form, or a text description of what you'd like to build. Claude Opus 4.8 does a great job configuring the necessary logic and rendering the initial interface.

If it's not what you like or you see errors in the first pass then you can iterate, passing Claude detailed prompts, console errors, or screenshots of things you'd like to fix or change.

Also, Claude can generate the SQL schema and connecting PHP script(s) if you'd like to save form data to a database or perform other scripted processes. You can also provide it a SQL schema and have it generate an initial interface and connecting PHP script(s).

Over all, it's very flexible way to integrate highly-customizable user interfaces backed by PHPRunner-generated admin interfaces, and being able to utilize PHPRunner authentication functions to share HTMX or HTML forms with registered users is a major bonus.

Hope this is useful to you!

Greetings PHPRunners,

I created a new demonstration site with more examples (https://hypertextforms.com).

Each form has a dedicated table in order to utilize PHPRunner's Permissions configuration.

Still figuring out things as I go but this is pretty fun stuff. I hope you find it useful.

Looking good, the crm demo didn't show so guess that's one you're working on.

Thanks for the heads-up. This is an early version of the CRM example with React components that apparently had loading issues.

Seems to be working correctly now but I have requested an updated React-free HTMX-based version.

All fixed, now the crm example uses a locally installed version on htmx.min.js instead of downloading React-related code.

Also, while that was happening, I requested an updated version of the filter grid example with export controls.

If you are interested you can see it in action here... https://hypertextforms.com/filtergridexportexample_list.php

Hi,
It’s getting more and more interesting.
Is it possible to export something from your project so I can learn from it more easily?
I’m finding it difficult to recreate right now, and I haven't been able to get it working with AI either.

Sure. Here's a list of steps to build a demo dashboard system based on a SQL schema.

Use cPanel to create a database like classicmodels.sql (see attached classicmodels.sql)
Create a host database to serve HTMX files from. Create a table in the host database (sql.png)
Connect to host database with PHPRunner, configure a Custom view for Container field (custom.png)
Log in to Claude, select Opus 4.8, insert prompt (prompt.png), generate HTMX, PHP, JavaScript bundle
Open bundle, upload generated PHP and JavaScript files to designated folders on server.
Copy HTMX code from bundle tile and paste into the Container field.

Log in to host server and database to test, iterate in Claude, re-upload updated or additional files as required.

Most of the examples at https://hypertextforms.com follow this approach in one form or another.

Only the input files (Excel templates, PDF forms, screenshots, SQL schemas...) and prompts change.