CodeIgniter Forums
CI 4/Alpinejs/htmx/vitejs - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: CodeIgniter 4 (https://forum.codeigniter.com/forumdisplay.php?fid=28)
+--- Forum: CodeIgniter 4 Discussion (https://forum.codeigniter.com/forumdisplay.php?fid=31)
+--- Thread: CI 4/Alpinejs/htmx/vitejs (/showthread.php?tid=88823)



CI 4/Alpinejs/htmx/vitejs - FabriceL - 11-15-2023

Hello team,

I'm working on a tool developed with Codeigniter 4, alpinjs, htmx, Tailwindcss and vitejs.
I have a Core module that integrates the BO, with notifications, Forms, Storage, images, Job, etc, ...
I started with a npm installation for everything that is alpinejs, htmx and others, all compiled with vitejs.
I have 4 modules at the moment, Invoices/Quotes, Clients, Media, and Front.
So far so good with cell_view() It's great with hx-boot.

Small problem since yesterday on my client module, I want to add a "calendar" entry with an Alpinejs insertion.
The script is between


PHP Code:
<?php $this->section('scripts'?>
document.addEventListener("alpine:init", () => {
        Alpine.data("calendar", () => ({})
})
<?php $this->endSection(); ?>


And it doesn't work.
It works if I put it directly in the "master.php" layout file

I'm making a comparison with laravel and its @push which has to restart Alpine start on each insertion, no?

Can you do the same with Codeigniter 4?

Thanks guys


RE: CI 4/Alpinejs/htmx/vitejs - luckmoshy - 11-15-2023

you should extend the main layout 

PHP Code:
<?php $this->extend('master'?>
<?php $this
->section('scripts'?>
document.addEventListener("alpine:init", () => {
        Alpine.data("calendar", () => ({})
})
<?php $this->endSection(); ?>


<!doctype html>
<html>
<head>
<title>My Layout</title>
</head>
<body>
<?php $this->renderSection('scripts') ?>
</body>
</html>


RE: CI 4/Alpinejs/htmx/vitejs - FabriceL - 11-15-2023

Thank you, but I've listened carefully. Ca no soucI
My script appears in the right place.
But as I'm using HTMX's hx-boost with alpine js and renderSection() for my js scripts, I have the impression that what's in my script isn't working.

Do you have an idea? Thank you, but I've listened carefully. Ca no soucI
My script appears in the right place.
But as I'm using HTMX's hx-boost with alpine js and renderSection() for my js scripts, I have the impression that what's in my script isn't working.

Do you have an idea?


RE: CI 4/Alpinejs/htmx/vitejs - dgvirtual - 11-29-2024

(11-15-2023, 10:14 AM)FabriceL Wrote: Thank you, but I've listened carefully. Ca no soucI
My script appears in the right place.
But as I'm using HTMX's hx-boost with alpine js and renderSection() for my js scripts, I have the impression that what's in my script isn't working.

Do you have an idea? Thank you, but I've listened carefully. Ca no soucI
My script appears in the right place.
But as I'm using HTMX's hx-boost with alpine js and renderSection() for my js scripts, I have the impression that what's in my script isn't working.

Do you have an idea?
Could it be that, despite you putting the include and naming it scripts, you still need to put the js code inside <script> tag?