在数据库

Question

我正在为父母工作，以照顾他们的新生儿。 我有三个按钮用于每个任务，比如一个进度流程，它将显示他们受教育的给定任务的距离（例如尿布更换的三个步骤（指示＆gt;完成帮助＆gt;我自己完成））。 单击按钮时，它将更改颜色以指示此步骤已完成。

现在回答问题; 父母必须登录才能看到此“清单”并单击按钮。假设他们第一次点击他们被指示的按钮，颜色会发生变化。但是下次他们登录进入“核对清单”时，他们仍然会看到点击了“指示”按钮。

Here's a picture how the checklist looks like unclicked

Here's a picture how the checklist looks like with some clicked options.

按钮的代码：

      <div class="container" id="checkcontainer">
  <h2>Diaper change</h2>


  <input type="button" value = "Instructed" style= "color:black" onclick="setColor(this)";/>
  <input type="button" value = "Done with help" style= "color:black" onclick="setColor(this)";/>
  <input type="button" value = "Done by myself" style= "color:black" onclick="setColor(this)";/>
  </div>

更改颜色的脚本（抱歉格式不正确）：

 function setColor(element) {
    if(!element.hasAttribute('data-count')){
    element.setAttribute('data-count', 1);
  }var count = element.getAttribute('data-count');

    if(count == 0){
    element.style.backgroundColor = '#ffffff';
    element.setAttribute('data-count', 1);
  } else{
    element.style.backgroundColor = '#7fff00';
    element.setAttribute('data-count', 0);
  }
}

我希望将所选选项存储在我的phpmyadmin（MySQL）数据库中，以便父母在下次看到按钮更改。 任何想法如何将代码存储在我的数据库中并将其显示在下一次？

Answer 1

Matsson

我同意Victor，你可以添加一个字段作为status_button然后当用户来时该页面知道它是否被点击或者没有。

例如，在whitin Javascript部分，您可以编写如下内容：

<script type="text/javascript">
 var instructed = '<?php echo $data['status_instructed'];?>';
 var help = '<?php echo $data['status_help'];?>';
 if( instructed == true ){
  var a = document.getElementById('button_instructed');
  a.style.backgroundColor = '#7fff00'';
 } 
 if( help == true ){
  var b = document.getElementById('button_help');
  b.style.backgroundColor = '#7fff00'';
 }
</script>

$data是mysqli结果并带来状态。

你可以改变你的html代码：

<input type="button" id="button_instructed" value = "Instructed" style= "color:black" onclick="setColor(this)";/>
 <input type="button" id="button_help" value = "Done with help" style= "color:black" onclick="setColor(this)";/>
 <input type="button" id="button_myself" value = "Done by myself" style= "color:black" onclick="setColor(this)";/>

You can read more here和here