The preserveUrl feature doesn't work.

[Tivixo]

Hi,

I'm making an app on VILT stack. In many places I need to get subcategories and I don't want make a new Route on back-end for each one.
So I make a single Route like 'partial-data/get_subcategories' and send an category_id to it each time and get the subcategories.
It works fine, just each time my url changed to 'partial-data/get_subcategories'!

I searched and I find preserveUrl in a new merge in 2022 by @xiCO2k : #1009
But when I use "preserveUrl: true" in my watcher it doesn't work!

I'm noob in git concepts, because it is Merged so it should works, right? or should I install this branch: https://github.com/xiCO2k/inertia/tree/feat/add-preserve-url ? I read when something get merged that feature exist in master branch, so why preserveUrl doesn't work? Am I need change some settings or something?

Please guide me my friends.

Thank you.

[Shaun7036]

Hi,
Did you ever figure out a workaround to this issue?

I'm bumping this as I'm currently notcing similiar behavior.
For added context, I'm noticing this behavior on a Vue3 + Laravel stack.

const refreshConfigValues = () => {
router.visit('admin/configs/refreshValues', {
method: 'GET',
only: ['config_values'],
preserveState: true,
preserveScroll: true,
preserveUrl: true,
replace: true,
onSuccess: () => {
console.log("Config values refreshed successfully");
},
onError: (errors) => {
console.error("Error refreshing config values:", errors);
},
});
}

public function refreshConfigValues(Request $request, ConfigurationService $configuration_service)
{
    // Retrieval logic
    // Return an Inertia response with only the config_values prop
    return Inertia::render('Admin/Home', [
        'config_values' => $config_values,
    ]);
}

while the above should result in the following route 
www.mywebsite.com/admin
I instead get:     www.mywebsite.com/admin/configs/refreshValues. 

I could switch to axios but it defeats the purpose of prop driven development using inertia. We load a lot of data server side and rendering the entire page again would not work.

[ImraneAabbou]

i noticed the same thing, too... and i find out that preserveUrl is the problem on the inertiaJS server is behaving as expected.

i check net traffic. It responds with the right response, but inertiaJS doesn't consider that, or i dont know.

what i see is just the top bar loading and won't reach the end.

and if i put console.log on onSuccees or onFinish, it doesn't get printed. Besides, there are no errors related to inertiaJS on the console.

[k4l3b4]

I have the same issue while trying to make an Infinite scroll mechanism basically when i pass the preserveUrl prop the request does pass the params to the request so the data is a duplicate of the initial one.

[briankariuki]

@Tivixo @k4l3b4 Set replace to false.

   router.visit(`${url}`, {
        data: data,
        only: ['teams'],
        preserveState: true,
        replace: false, //<--- this
        preserveUrl: true,
        onStart: (_) => {
          setLoading(true);
        },
        onFinish: (_) => {
          setLoading(false);
        },
      });