On my index page I have made a chatbox. There I have a form element in my Vue component which executes an inertia post via "UseForm".
The problem I have is, because I make the post on "/chatbox/send", that I have to make a redirect to "index/home" afterwards, because otherwise the URL-header remains "/chatbox/send", which I don't want.
In addition, the page automatically scrolls up again when rendering.
My question; How can I re-render the page so that the URL-header is set to "/home" again and the page does not scroll up ?
public function sendChatMessage(Request $request) {
$msg = $request->input('text');
$username = Auth::user()->only('name')['name'];
if($this->createChatMessage($msg, $username)) {
return redirect('index/home');
}
return false;
}
CodePudding user response:
you have to define it during your route in your vuejs I suppose you use.
Normally it should look like this:
this.$inertia.post(route('chatbox.send'), {text: this.text}, { preserveState: false, preserveScroll: true })
preserveState: it is used to say if you want to refresh the page if you return the same route in your php controller.
preserveScroll: is used to say that you want to stay at the same scrolling as at the time of the send.
more information: https://inertiajs.com/manual-visits
And in your controller I would do:
public function sendChatMessage(Request $request) {
$msg = $request->input('text');
$username = Auth::user()->only('name')['name'];
if($this->createChatMessage($msg, $username)) {
return redirect()->route('home');
}
}