Hello,

Thank you for reaching out. To better assist you, could you please check the console log for any JavaScript errors when you click "Save Changes"? This will help us identify if there are any issues with the execution of the JavaScript code.

You can open the browser's developer tools (usually by pressing F12 or right-clicking on the page and selecting "Inspect"), go to the "Console" tab, and look for any error messages.

Once you identify any errors, please share them with us.

Looking forward to resolving this issue for you.

Hi,

There are a couple of steps you can take to address the problem.

In your controller, make sure you include the 'formrepeater' vendor by using the addVendors method. This step is essential for loading the necessary JavaScript files for the form repeater plugin.

// Example in your controller
use App\Core\Layout\BaseController;

class YourController extends BaseController {
 public function yourMethod() {
 // Add "formrepeater" vendor
 $this->addVendors(["formrepeater"]);

 // Your other code...
 }
}

module.exports = [
 "node_modules/jquery.repeater/src/lib.js",
 "node_modules/jquery.repeater/src/jquery.input.js",
 "node_modules/jquery.repeater/src/repeater.js",
];

Hi Faizal, thank you so much for helping me out.
Everything is working perfectly now. Thanks again, brother!

I am using first solution without $this

// Example in your controller
use App\Core\Layout\BaseController;

class YourController extends BaseController {
 public function yourMethod() {
 // Add "formrepeater" vendor
 addVendors(["formrepeater"]);

 // Your other code...
 }
}

It seems that you are trying to use Quill.js and submit its contents in a form. However, using a div element as the editor container will not work, because div elements are not part of the form data. You need to use a hidden input element instead, and update its value with the editor’s innerHTML whenever the content changes. Here is an example of how you can do that:

<form method="post" >
 <!-- Create the toolbar container -->
 <div >
 <button class="ql-bold">Bold</button>
 <button class="ql-italic">Italic</button>
 </div>

 <!-- Create the editor container -->
 <div >
 <p>Hello World!</p>
 </div>

 <!-- Create a hidden input element -->
 <input type="hidden" name="description" >

 <input type="submit" value="Save">
</form>

<!-- Initialize Quill editor -->
<script>
 var editor = new Quill("#editor", {
 modules: {
 toolbar: "#toolbar"
 },
 theme: "snow"
 });

 // Update the hidden input value whenever the editor changes
 editor.on("text-change", function() {
 var html = editor.root.innerHTML;
 document.getElementById("hiddenInput").value = html;
 });
</script>