使用表單元素多次更新數據庫

Question

我一直在爲醫生辦公室工作。我對HTML/CSS和一些PHP非常好，但我仍然在學習Javascript/JQuery。所以最簡單的方式來描述我的問題（我的問題，對我來說，至少是相當複雜的）是與圖像（如果這不是描述這一點的最佳方式，請告訴我，我會描述它更詳細）：

我有PHP代碼，它傳遞給它的值（這是位置號碼），並將位置號碼與用戶的時間一起插入到數據庫中。

這裏是PHP代碼：

<?php 
    date_default_timezone_set('America/Denver'); 

    $apptid = $_REQUEST['apptid']; 
    $currentlocation = $_REQUEST['currentlocation']; 
    $currentlocationstart = date("Y-m-d H:i:s"); 

    /*** mysql hostname ***/ 
    $hostname = '******'; 

    /*** mysql username ***/ 
    $username = '***********'; 

    /*** mysql password ***/ 
    $password = '***************'; 


    $conn = new PDO("mysql:host=$hostname;dbname=sv", $username, $password); 
    /*** The SQL SELECT statement ***/ 
    $sql = "UPDATE schedule SET currentlocation = ?, currentlocationstart = ? WHERE apptid= ? "; 

    $q = $conn->prepare($sql); 
    $q->execute(array($currentlocation,$currentlocationstart, $apptid)); 

?> 

下面是HTML代碼（充滿一點點的PHP，填充）：

$sql = "SELECT * FROM locations order by patientlocation ASC"; 

echo "<td><select name=location>"; 
foreach ($dbloc->query($sql) as $row2) 
    { 
    echo "<option>".$row2['patientlocation']."</option>"; 
    } 
      echo "<option value='Check Out'>Check Out</option>"; 
    echo "</select></td>"; 

所以我的問題是怎麼做的這與Javascript/JQuery和如果我的PHP將與Javascript/JQuery的工作。我還希望存儲從最初的「簽入」按鈕到用戶點擊退出時的所有內容。

另一個問題是我需要這個與AJAX自動發生，而不是刷新頁面很多次。

非常感謝所有人和任何幫助。如果我沒有很好地解釋我的問題，請告訴我，我會填寫更多的細節！

Answer 1

只是一個快速的問題首先，你能夠使領域變成一種形式，而不是讓他們消失onchange？

通過這種方式，當他們點擊登記時，您可以使表格出現，填充表格，當他們在表單底部按下結賬時，我們可以使用AJAX提交表單並顯示回覆。

因此，這將是這樣的：

<script type="text/javascript"> 
$(document).ready(function() { 
    // Hide the form on load  
    $('#myForm').hide(); 
    // Hide the completed message 
    $('#finished').show(); 
}); 

// When someone clicks checkin this function will be called 
$('#checkIn').click(function(){ 
    $e = $(this); 
    $.ajax({ 
     type: "POST", 
     url: "[URL OF PHP PAGE HERE]", // this page should add date to the database 
     data: "checkIn="+$(this).val(), // This will send $_POST['checkIn'] 
     success: function(){ 
      // Display the form once the AJAX is finished 
      $('#myForm').show(); 
     } 
    }); 
}); 

// This function will be called when someone uses the select field 
$('.[yourClassName]').change(function(){ 
    $e = $(this); 
    $.ajax({ 
     type: "POST", 
     url: "[URL OF PHP PAGE HERE]", 
     data: "yourFieldName="+$(this).val(), 
     success: function(){ 
      // Display the form once the AJAX is finished 
      alert('Done'); 
     } 
    }); 
}); 

// When someone clicks checkOut this function will be called 
$('#checkOut').click(function(){ 
    $e = $(this); 
    $.ajax({ 
     type: "POST", 
     url: "[URL OF PHP PAGE HERE]", // this page should save data to db 
     data: "example="+$('select#exampleId').val(), 
     success: function(){ 
      // Hide the form again 
      $('#myForm').hide(); 
      // Show the finished div with your success msg 
      $('#finished').show(); 
     } 
    }); 
}); 
</script> 

<input type="button" value="Check In" id="checkIn" /> 
<form method="post" id="myForm" action=""> 
    // Build the rest of your form here 
    <select name="example" id="exampleId"> 
     <option value="1">Test</option> 
    </select> 

    <input type="button" value="Check Out" id="checkOut" /> 
</form> 
<div id="finished" style="color:#ff0000;">Checked Out</div> 

這應該是，除了你當然會需要建立自己的形式在我的例子之一是。使用PHP頁面發送AJAX，這應該是一個普通的PHP頁面，它接受$_POST數據，就像正常發佈表單時一樣。