2017-02-07 1 views
0

부모님이 신생아를 돌볼 웹 응용 프로그램을 만들고 있습니다. 나는 기저귀 교체를위한 3 단계 (지시> 완료 됨> 나 혼자서 수행)와 같이 주어진 과제에서 얼마나 길게 교육을 받았는지 보여줄 것입니다. 버튼을 클릭하면 색상이 변경되어이 단계가 완료되었음을 나타냅니다.복수의 buttonclicks를 데이터베이스에 저장하십시오.

지금 질문하기; 부모는이 "체크리스트"를보고 버튼을 클릭하기 위해 로그인해야합니다. 그들이 지시 한 곳의 버튼을 처음 클릭 할 때 색상이 변한다고 가정 해보십시오. 그러나 다음에 로그인하여 "점검 목록"을 진행할 때, 그들은 여전히 ​​"지시 된"버튼이 클릭되었음을 볼 것입니다.

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에 저장 될 선택된 옵션 부모는 다음 번에 buttonchange를 볼 수 있습니다. 코드를 내 데이터베이스에 저장하고 다음에 표시하는 방법에 대한 아이디어가 있습니까? 사용자가 클릭 또는 어떤 경우 페이지가 알고 올 때

+1

당신이 (당신이하지 않는 가정) 페이지를 새로 고침하지 DON 경우 그 색상을 변경하려면 먼저 데이터베이스에 값을 저장하는 PHP 스크립트에 아약스 호출을하고이 호출이 성공하면 색상을 변경할 수 있습니다. 그런 다음 결과를 표시하기 전에 데이터베이스에서 상태를 쿼리하십시오. –

답변

0

Matsson 내가 빅터 동의

는, 당신은 다음 status_button으로 필드를 추가 할 수 있습니다.

<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> 

$datamysqli 결과 및 상태를 가지고 :

는 자바 스크립트 부분 whitin 예를 들어, 당신은 이런 식으로 뭔가를 쓸 수 있습니다.

그리고 당신은 조금 당신의 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 herehere

관련 문제