リフレッシュ後にドロップダウン値を保持する方法

Question

2つのドロップダウンと2つのボタンがある場合、ドロップダウン1とドロップダウン2を選択して開始ボタンを押すと、ボタンを無効にする必要があります。秒を有効にする必要があります。また、ドロップダウンも無効にする必要があります。私はリフレッシュを行うときに、同じ状態を続ける必要があります。私は両方のドロップダウンを選択し、開始をヒットすると、ドロップダウンは無効になり、開始もそうですが、後でフォームをリフレッシュすると停止が有効になりますリフレッシュするには、同じである必要があります。私はlocalStorageを使用することができ、ボタンのためにそれをすることができますが、ドロップダウンのために同じことをする方法を知ることができません。以下は私のjsです。

$(document).ready(function() { 
    if (typeof (Storage) !== "undefined") { 
     var stat = localStorage.getItem("clickStat"); 
     if (stat == "start") { 
      $('#Start').attr("disabled", true); 
      $('#Stop').attr("disabled", false); 

     } else { 
      $('#Start').attr("disabled", false); 
      $('#Stop').attr("disabled", true); 
     } 
    } 
    var form = $('#formSec'); 
    var task = document.getElementById('task'); 
    var subtask = $('#subtask'); 

    $('#Start').on("click", function() { 
     if (typeof (Storage) !== "undefined") { 
      localStorage.setItem("clickStat", "start"); 
     } 
     $.ajax({ 
      type : "post", 
      url : "UpdateStartTime", 
      data : form.serialize(), 
      success : function() { 
       $('#task').attr("disabled", true); 
       $('#subtask').attr("disabled", true); 
       $('#Start').attr("disabled", true); 
       $('#Stop').attr("disabled", false); 
      } 
     }); 
     return false; 
    }); 

    $('#Stop').on("click", function() { 
     if (typeof (Storage) !== "undefined") { 
      localStorage.setItem("clickStat", "stop"); 
     } 
     var form = $('#formSec'); 
     var task = document.getElementById('task'); 
     var subtask = $('#subtask'); 
     $.ajax({ 
      type : "post", 
      url : "UpdateEndTime", 
      data : form.serialize(), 
      success : function() { 
       $('#task').attr("disabled", false); 
       $('#subtask').attr("disabled", false); 
       $('#Start').attr("disabled", false); 
       $('#Stop').attr("disabled", true); 
      } 
     }); 
     return false; 
    }); 

}); 

ここはフィドルです。 https://jsfiddle.net/fx9azgso/2/

どうすればいいですかこれを修正できますか？

おかげ

Answer 1

この情報がお役に立てば幸いですが、私はコメントは私が行った変更のアイデアを得るために、開始タグと終了タグを探して、あなたのためのコードを更新しました。

代わりに以下のコードを参照してくださいhttps://jsfiddle.net/fx9azgso/24/

@ワーキングサンプルをご覧ください。

$(document).ready(function() { 
    /*Set the variables with appropriate references [START]*/ 
    var form = $('#formSec'); 
    var task = $('#task'); 
    var subtask = $('#subtask'); 
    /*Set the variables with appropriate references [END]*/ 

    if (typeof(Storage) !== "undefined") { 

     /*Extract values from localStorage [START]*/ 
     var stat = localStorage.getItem("clickStat"); 
     var taskVal = localStorage.getItem("taskVal"); 
     var subtaskVal = localStorage.getItem("subtaskVal"); 
     /*Extract values from localStorage [END]*/ 

     if (stat == "start") { 
      $('#Start').attr("disabled", true); 
      task.attr("disabled", true); 
      subtask.attr("disabled", true); 
      $('#Stop').attr("disabled", false); 

     } else { 
      $('#Start').attr("disabled", false); 
      task.attr("disabled", false); 
      subtask.attr("disabled", false); 
      $('#Stop').attr("disabled", true); 
     } 
    } 

    /*If locaStorage values are assigned property i.e. App has been started at least once, assign values [START]*/ 
    if (taskVal !== null) 
     task.val(taskVal); 

    if (subtaskVal !== null) 
     subtask.val(subtaskVal); 
    /*If locaStorage values are assigned property i.e. App has been started at least once, assign values [END]*/ 


    $('#Start').on("click", function() { 
     if (typeof(Storage) !== "undefined") { 
      /*Store values in localStorage [START]*/ 
      localStorage.setItem("clickStat", "start"); 
      localStorage.setItem("taskVal", task.val()); 
      localStorage.setItem("subtaskVal", subtask.val()); 
      /*Store values in localStorage [END]*/ 
     } 
     $.ajax({ 
      type: "post", 
      url: "UpdateStartTime", 
      data: form.serialize(), 
      success: function() { 
       $('#task').attr("disabled", true); 
       $('#subtask').attr("disabled", true); 
       $('#Start').attr("disabled", true); 
       $('#Stop').attr("disabled", false); 
      } 
     }); 
     return false; 
    }); 

    $('#Stop').on("click", function() { 
     if (typeof(Storage) !== "undefined") { 
      /*Store values in localStorage [START]*/ 
      localStorage.setItem("clickStat", "stop"); 
      localStorage.setItem("taskVal", task.val()); 
      localStorage.setItem("subtaskVal", subtask.val()); 
      /*Store values in localStorage [END]*/ 
     } 
     $.ajax({ 
      type: "post", 
      url: "UpdateEndTime", 
      data: form.serialize(), 
      success: function() { 
       $('#task').attr("disabled", false); 
       $('#subtask').attr("disabled", false); 
       $('#Start').attr("disabled", false); 
       $('#Stop').attr("disabled", true); 
      } 
     }); 
     return false; 
    }); 

});