フォームのdivのスクロール位置を維持するsubmit - Django

ユーザーがフォームを送信するときのスクロール位置を維持するために必要な非常に長いdivがあります。私はJavaScriptを適切に使用したことがないので、これを行う方法についての手がかりはありません。答えを探しても役に立つ答えは得られていません。私が収集したことは、jQueryを使用するため、.scrollTop（）を使用できる可能性がありますが、それ以上のことはわかりません。 htmlページのラフスケッチの下フォームのdivのスクロール位置を維持するsubmit - Django

、それがどのように見えるか：

<html> 
<head> 
<title>Untitled Document</title> 
<style> 
#article-text { 
    height: 100px; 
    overflow: scroll; 
} 
</style> 
</head> 
<body> 
<div> 
Some random text. 
</div> 
<div id="article-text"> 
Very, very long text. 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
Even more text. 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
That is how long the text is 
</div> 
<div class="form-nav"> 
    <input type="submit" name="add_event" value="Add Event"> 
</div> 

</body> 
</html>

「イベントを追加」クリックすると、POSTリクエストが送信され、ページがリロードされる：
views.py

elif 'add_event' in request.POST: 

       cp = request.POST.copy()

"article-text" divにスクロールの進行状況を保存するにはどうすればよいですか？ページ全体ではなく、具体的にdivです。ここにはどんな指針も大好きです。

出典

2016-06-27 LukasKawerau

... – rnevius

位置をlocalstorageに格納することも、URLにアタッチすることもできます。これは既にここで答えられています：Refresh Page and Keep Scroll Position。

出典

2016-06-27 15:32:52

あなたのページにフォームがないので、JS/jQueryを使用してPOSTリクエストを開始していると思います。

最良の方法：AJAX経由でリクエストを送信します。

$.post(url, data, function(response){ /* success */ });

このように、ページをリロードする必要はなく、以前のスクロール位置に正確に留まります。

あなたがリロードする必要があるいくつかの理由のために、あなたは.scrollTop()からlocalStorageにし、その値のすべてのページのロードチェックのlocalStorageに現在のスクロール位置を保存することができます。あなたは

localStorage.setItem('my-scroll-pos', $(window).scrollTop());

でフォームを提出し、ページを再読み込みした後に、戻って値を取得する前に値を設定するには

は、それを行います。

より良いオプションは、ページが全くリロードされないように、AJAXでフォームを送信することであろう

var pos = localStorage.getItem('my-scroll-pos', 0); 
if (pos) 
    $(window).scrollTop(pos)

出典

2016-06-27 16:06:04 C14L

私はフォームを持っている、私は申し訳ありませんが、上記のコードでそれを入れている必要があります。私は悲しいことにAJAXを使うことができないので、フォームを送信した後に同じページにリダイレクトする必要があります。どこに 'localStorage'パーツを置くのですか？そして、それはその特定のdivのスクロール位置を取るか？ – LukasKawerau

フォームのdivのスクロール位置を維持するsubmit - Django

答えて

関連する問題