HTMX get reloads empty form

[kharabela]

A HTMX button click triggers API and loads formData.
I intend to not lose previously typed formData.

Sample Code

<button id="account_nav"
       hx-get="/account"
       hx-target="#canvas"
       hx-on::before-request="
       let btnclr;
       let navlinks = [];
       navlinks.push('account_nav');
       navlinks.push('policyinfo_nav');

       navlinks.forEach((navlink) => 
       {
         btnclr=document.getElementById(navlink);
         btnclr.classList.remove('dark:bg-indigo-600');
       }); "
       hx-on:htmx-after-on-load="
       let current_btn = document.getElementById('account_nav');
       current_btn.classList.add('dark:bg-indigo-600');
       current_btn.classList.add('dark:text-white');
       "
<p class="text-base leading-4">Account</p>
       </button>

<div id="canvas"><div>

Have tried hx-trigger="onload" , but it breaks application

[Telroshan]

Hey,

To be honest I don't really understand what your sample code above is about (removing/restoring some classes, but nothing to do with form data to preserve right?), but for this

I intend to not lose previously typed formData.

• You can use hx-include to carry the form values around and reuse them in your backend. For example, putting hx-include="closest form" on your button, will include all of your form's values in your button's request
• hx-preserve might also be helpful here depending on your usecase

Hope this helps! Otherwise, would you mind providing more detail so we can understand the situation better?