У меня есть пара элементов формы, которые при нажатии обновляют базу данных и исчезают.
Сначала у меня есть кнопка, которая читает чек. После нажатия на нее база данных обновляется, и вместо кнопки отображается выпадающий список. В раскрывающемся списке есть местоположения для пользователя, которые имеют значения своего соответствующего номера местоположения, которые после нажатия на обновление базы данных. Последний параметр помечен как "Отъезд", а при нажатии на него база данных должна обновляться в последний раз, а затем появляется красный текст с сообщением "Checked Out".
Проблема состоит в том, что существует несколько наборов вышеупомянутого процесса (имеется в виду, что есть много кнопок "Проверить", которые превращаются в выборки, а затем читают Checked Out, которые все работают индивидуально). Так что мне нужен способ передать идентификатор каждого набора в базу данных, в то же время я обновляю базу данных. Я думал о чем-то вроде скрытого поля под каждой кнопкой, заполненной идентификатором, а затем, когда нажала кнопка Check In, ajax отправил бы с ней скрытое поле?
Вот мой html:
<button class="checkIn">Check In</button>
<form method='post' class='myForm' action=''>
<select name='locationSelect' class='locationSelect'>
<option value='1'>Exam Room 1</option>
<option value='2'>Exam Room 2</option>
<option value='3'>Exam Room 3</option>
<option value='4'>Exam Room 4</option>
<option value='CheckOut'>Check Out</option>
</select>
</form>
и вот jQuery
<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.locationSelect').hide();
$('.finished').hide();
});
$('.checkIn').click(function(){
$e = $(this);
$.ajax({
type: "POST",
url: "changeloc.php",
data: "checkIn="+$(this).val(),
success: function(){
$('.checkIn').css("display","none");
$('.locationSelect').show();
}
});
});
$('.locationSelect').change(function(){
$e = $(this);
$.ajax({
type: "POST",
url: "changeloc.php",
data: "locationSelect="+$(this).val(),
success: function(){
}
});
});
$('.locationSelect option[value="CheckOut"]').click(function(){
$e = $(this);
$.ajax({
type: "POST",
url: "changeloc.php",
data: "checkOut="+$(this).val(),
success: function(){
$('.locationSelect').css("display","none");
$('.finished').show();
alert('done');
},
error: function(request){
alert(request.responseText);
}
});
});
</script>
Я не уверен, что мое решение будет жизнеспособным, поэтому, пожалуйста, не стесняйтесь предлагать другие решения. Если вам нужны какие-либо другие детали, пожалуйста, просто спросите!
Спасибо за любую помощь!