在laravel中提交表单后，请记住滚动条位置

问题描述：

Is it possible to remember scrollbar position after form submit and returning back to the home page?

Here is my form:

<form method="post" action="{{Route('sites.liking')}}">
  <input name="_token" value="{{csrf_token()}}" type="hidden">
  <input type="hidden" value="{{$meme->likes}}" name="likes">
  <input type="hidden" value="{{$meme->id}}" name="likeid">
  <input type="hidden" value="{{Auth::user()->name}}" name="sendeduser">
  <button class="linking">+ {{$meme->likes}}</button>
</form>

Routing:

Route::post('/', ['uses' => 'LikingComments@liking', 'as' => 'sites.liking']);

Controller function:

public function liking(Request $request) {
  //Function guts
  return redirect('/')->with('status', $id);
}

I've tried several scripts but it always scrolls to the top of the page.

Is there a some way to go back to the same place of the page ?

表单提交并返回主页后是否可以记住滚动条位置？ p>

这是我的表单 strong>： p>

 ＆lt; form method =“post”action =“{{Route（'sites.liking  '）}}“＆gt; 
＆lt; input name =”_ token“value =”{{csrf_token（）}}“type =”hidden“＆gt; 
＆lt; input type =”hidden“value =”{{  $ meme-＆gt; likes}}“name =”likes“＆gt; 
＆lt; input type =”hidden“value =”{{$ meme-＆gt; id}}“name =”likeid“＆gt; 
＆lt;  ; input type =“hidden”value =“{{Auth :: user（） - ＆gt; name}}”name =“sendeduser”＆gt; 
＆lt; button class =“linking”＆gt; + {{$ meme-  ＆gt; likes}}＆lt; / button＆gt; 
＆lt; / form＆gt; 
  code>  pre> 
 
  路由 strong>： p> 
 
  
  Route :: post（'/'，['uses'=＆gt;'LikingComments @ liking'，'as'=＆gt;'sites.liking']）;  code>  p>  
 
 
 控制器功能 strong>： p> 
 
 
 公共功能喜欢（请求$请求）{
 //功能guts 
返回重定向 （'/'） - ＆gt; with（'status'，$ id）; 
} 
  code  >  pre> 
 
 我尝试了几个脚本，但它总是滚动到页面顶部。   p> 
 
 
  有没有办法回到页面的同一位置？ em>  strong>  p> 
  div  >

答

Okay I've solved up that problem by adding an id to an element, new routing and changing main function.

<div id="{{$meme->id}}">
 <form method="post" action="{{Route('sites.liking')}}">
  <input name="_token" value="{{csrf_token()}}" type="hidden">
  <input type="hidden" value="{{$meme->likes}}" name="likes">
  <input type="hidden" value="{{$meme->id}}" name="likeid">
  <input type="hidden" value="{{Auth::user()->name}}" name="sendeduser">
  <button class="linking">+ {{$meme->likes}}</button>
 </form>
</div>

Changed function:

public function liking(Request $request)
{
 //Function guts


 return redirect()->action('LikingComments@indexliking', ['id' => $id])->with('status', $id);
}

Routing:

Route::get('/#{id}' , ['uses' => 'LikingComments@indexliking', 'as' => 'indexliking']);

It don't work perfectly but it's fine for me. Thank you for your answers especially @kerbholz

答

You can use localStorage or sessionStorage to save current scroll position (scrollTop). and then assign it to scrollTop when you reload that previous page.

在laravel中提交表单后，请记住滚动条位置

相关推荐