DomTemplate

DomTemplate is an open-source PHP library that binds dynamic data to HTML documents using data attributes, custom-element templates, and reusable HTML components, built on the PHP.GT Dom library.

What is DomTemplate?

DomTemplate is a PHP data-binding engine that takes an HTML document and a PHP data structure — key-value pairs, arrays, lists of associative arrays, or nested lists — and injects the data into the document via data-bind and data-template attributes. It outputs the fully rendered HTML with the binding markup removed when you call cleanupDocument(). The library is developed by the PhpGt project, runs in any PHP environment with the DOM extension, and is distributed as a Composer package.

Key Features

• Key-value binding — Use the data-bind:text attribute to replace an element's text content with a single value, as shown in the "Hello, you!" greeter example.
• List binding — Mark an element with data-template and bind an array of strings or objects to automatically repeat that element once per item.
• Attribute injection — Insert values into HTML attributes such as href, src, and alt using curly-brace placeholders like {{id}}, demonstrated in the user-list example.
• Nested data support — Bind lists of associative arrays so each repeated element can populate multiple fields at different locations within the template.
• HTML components — Store reusable chunks of markup in separate HTML files and include them with custom HTML tags, enabling component-based page assembly.
• Page templating — Create partial HTML documents that extend others, allowing shared layouts and inheritance.
• CSS modularization — Target custom element tag names in stylesheets to keep component-specific CSS co-located with the components.
• Cleanup method — cleanupDocument() removes all data-bind and data-template attributes after data injection, leaving clean HTML output.

Who is DomTemplate for?

• PHP developers who want to keep HTML views free of PHP logic and separate presentation from application code.
• Teams building database-driven pages that need to repeat structured results into lists, grids, or other repeating markup.
• Component-oriented projects that want to define reusable HTML pieces as custom elements and assemble pages from them.
• Developers migrating from string-based templates who prefer working with a real DOM for more precise, maintainable injections.

What can you do with DomTemplate?

• Render dynamic lists: Bind an array of strings to a single data-template list item to generate a complete shopping list or menu.
• Inject form submissions: Bind a submitted form field (like a name) into an element's text with data-bind:text after the page loads.
• Bind database query results: Pass a list of associative arrays to a repeating template to render user profiles with fields placed in links, images, headings, and text.
• Build pages from components: Include separate HTML component files and bind data into them, keeping templates modular and reusable.

How does DomTemplate work?

The workflow starts with loading an HTML file into a GT\Dom\HTMLDocument object, then instantiating a GT\DomTemplate\DocumentBinder with that document. You call bindKeyValue() to inject a single value, bindList() to repeat a template over a data array, or more targeted bind methods for nested data. Finally, cleanupDocument() strips all binding attributes so the echoed HTML is clean.

FAQ

Is DomTemplate free?

DomTemplate is an open-source library published on GitHub under the PhpGt project and available through Packagist. The project is sponsored by JetBrains as part of its open-source support program, and no paid tier or license fee is mentioned.

Does DomTemplate require a specific framework?

No. DomTemplate is a standalone PHP library that works with the DOM extension built into PHP. It does not depend on any specific framework, so it can be added to plain PHP applications or integrated into existing MVC setups via Composer.

Can I bind values into HTML attributes?

Yes. The user-list example shows attribute injection into href, src, and alt using curly-brace placeholders such as {{id}} within the markup. When binding a list of associative arrays, each named field can populate its corresponding placeholder in the attribute.

What happens after I call cleanupDocument()?

cleanupDocument() permanently removes the data-bind and data-template attributes from the rendered DOM. This produces a clean HTML document with no leftover template markup, ready for output to the browser. After cleanup, the document cannot be re-bound with the same template.