2017-01-19 5 views
1

私は、ユーザーが見て変更するためのデータテーブルを持っています。必要に応じて行を削除するオプションがあります。行を削除すると、削除する行がdbに返されます。ユーザーの場合、行はすぐには削除されませんが、削除されていることをユーザーに知らせるためのスタイルを持つ新しいクラス 'deleted'が作成されます。私はまた、10分ごとにページをリフレッシュし、新しいリフレッシュされた「削除された」クラスがなくなる。ページがJavaScriptでリフレッシュされたときにクラスに加えられた変更を保持する方法

ページが更新されたときにクラスが行に留まるようにするにはどうすればよいですか?

ここでは、タイマーがページを更新するタイミングを知るためのタイマー機能があります。私はページを更新するためにajaxを使用しています。

 function startClock() { 
      // Get the time to stop the effect 
      var stopTime = new Date(); 
      stopTime.setMinutes(stopTime.getMinutes() + 10); 
      // Get a reference to the timer so it can be cancelled later 
      timer = setInterval(function() { 
       // Check to see if the timer should stop 
       var currentTime = new Date(); 
       if (currentTime < stopTime) { 
        triggerDataTable(); //refresh dataTable 
        var randomnumber = Math.floor(Math.random() * 100); 
       } else { 
        // Stop the timer 
        clearInterval(timer); 
       } 
      }, 600000); 
     } 

私はlocalStorageを使用しますか?もしそうなら、私は実際にそれをどうやって行うのですか?私はローカル値やそのようなものを格納するのに慣れていません。

+0

実際にデータベースから行を削除するのではなく、実際に行にステータスタイプ(アクティブ、削除済みなど)の列を付けることができます。こうすることで、ページをリフレッシュするときに行のステータスに基づいてクラスを変更することができます。 – Bram

+0

@Bram私は、行に「削除された」クラスを与えます。しかし、ページをリフレッシュすると、そのクラスをどのように保持しますか? – JBaldwin

+0

の代わりに行を更新するデータベースから行を削除する代わりに、削除されたことを示すステータス(アーカイブなど)を与えます。そうすれば、削除された行はまだデータベースに残っています。リフレッシュすると、すべての行がロードされ、異なるステータスの行が異なるクラスが取得されます。 – Bram

答えて

2

私はこの約100%わからないが、どのようなこのような何かやっについて:

セッション保存性が与えられたそれぞれの起源のために別々のストレージ領域を維持

のlocalStorage上

var deletedRow = $(".deleted"); 
localStorage.setItem(deletedRow, $(".deleted").val()); 
+0

私は同意すると、そのためにローカルストレージを使用します... – Paul

2

をのsessionStorageを使用して試してみて、セッションのために。

ローカルストレージは同じことを行いますが、ブラウザを閉じて再度開いても保持されます。

sessionStorage.setItem('item', value); 
sessionStorage.getItem('item'); 
+0

'item'は変更されている行のクラスですか? – JBaldwin

+0

itemは任意のキー(String)にすることができます。 valueは任意のもの(文字列、数値、オブジェクト、配列)になります。だからあなたの要件に応じてあなたまで。 –

+0

だからこのようなもの:var deletedRow = $( "。deleted"); \t \t \t sessionStorage.setItem(deletedRow、$( "。deleted")。val()); \t \t \t sessionStorage.getItem(deletedRow); – JBaldwin

関連する問題