$msg
私はMacの初心者プログラマーであり(つまり、私はieを持っていません) 、データベースに格納されているものに基づいてフォーム要素(ボタン、選択/ドロップダウンなど)を表示する比較的単純なajaxjqueryアプリケーションを構築しました、または単にテキストとリンク)をクリックすると、データベースに戻ってを変更し$msg
ます。
私のコードはChromeとFirefoxでうまく機能しますが、フォーム要素(5秒遅れ)は、IEのすべてのバージョンでテストしたときにページを読み込んだときの状態に戻ります。イライラした後、SOの回答を調べて、Doctypeが問題になることがあることを読んだので、doctypeをhtml5 doctypeに変更しましたが、何も変更されていません。
これが私のコードです:
$(document).ready(function() {
$('.checkIn').click(function() {
var $e = $(this);
var data = $e.data("param").split('_')[1] ;
// gets the id of button (1 for the first button)
// You can map this to the corresponding button in database...
$.ajax({
type: "POST",
url: "checkin.php",
// Data used to set the values in Database
data: { "checkIn" : $(this).val(), "buttonId" : data},
success: function() {
// Hide the current Button clicked
$e.hide();
var $container = $e.closest("div.jcontainer");
// Get the immediate form for the button
// find the select inside it and show...
$container.find('.locationSelect').fadeIn();
}
});
});
$('.reset').click(function() {
var $e = $(this);
var data = $e.data("param").split('_')[1] ;
// gets the id of button (1 for the first button)
// You can map this to the corresponding button in database...
$.ajax({
type: "POST",
url: "reset.php",
// Data used to set the values in Database
data: { "reset" : $(this).val(), "buttonId" : data},
success: function() {
// Hide the current Button clicked
$e.fadeOut();
var $container = $e.closest("div.jcontainer");
// Get the immediate form for the button
// find the select inside it and show...
$container.find('.finished').fadeOut();
$container.find('.checkIn').fadeIn();
}
});
});
$('.locationSelect').change(function(e) {
if($(this).children(":selected").val() === "CheckOut") {
$e = $(this);
var data = $e.data("param").split('_')[1] ;
$.ajax({
type: "POST",
url: "checkout.php",
// Data used to set the values in Database
data: { "checkOut" : $(this).val(), "buttonId" : data},
success: function() {
// Hide the current Button clicked
$e.fadeOut();
var $container = $e.closest("div.jcontainer");
// Get the immediate form for the button
// find the select inside it and show...
$container.find('reset').fadeIn();
$container.find('.finished').fadeIn();
}
});
}
else{
$e = $(this);
var data = $e.data("param").split('_')[1] ;
// gets the id of select (1 for the first select)
// You can map this to the corresponding select in database...
$.ajax({
type: "POST",
url: "changeloc.php",
data: { "locationSelect" : $(this).val(), "selectid" : data},
success: function() {
// Do something here
}
});
}
});
setInterval(function(){
$('.jcontainer').each(function() {
var $e = $(this);
var dataid = $e.data("param").split('_')[1] ;
$.ajax({
url: 'heartbeat.php',
method: 'POST',
contentType: "application/json",
cache: true,
data: { "dataid": dataid },
success: function(data){
var msg = $.parseJSON(data);
if (msg == ""){ //after reset or after new patient that is untouched is added, show checkin
$e.find('.checkIn').show();
$e.find('.locationSelect').hide();
$e.find('.finished').hide();
$e.find('.reset').hide();
}
if ((msg < 999) && (msg > 0)){ // after hitting "Check In", Checkin button is hidden, and locationSelect is shown
$e.find('.checkIn').hide();
$e.find('.locationSelect').show();
$e.find('.finished').hide();
$e.find('.reset').hide();
$e.find('.locationSelect').val(msg);
}
if (msg == 1000){ //after hitting "Checkout", Option to reset is shown and "Finished!"
$e.find('.checkIn').hide();
$e.find('.locationSelect').hide();
$e.find('.finished').show();
$e.find('.reset').show();
}
}
});
});
},5000);
});
私はできるだけ多くのコードにコメントしようとしましたが、基本的に最初の部分は$msg
、フォーム要素との相互作用のタイプごとにphpページにアップロードするだけです(ボタンがクリックされ、オプションが選択され、リンクがクリックされます) 。次に、2番目の部分は5秒ごとの更新であり、現在コンピューター1に表示されているフォーム要素がコンピューター2に表示されていることを確認します(5秒の遅延あり)。
すべての助けに感謝します、そしてあなたがより多くの詳細/情報を必要とするならば、ただ尋ねてください!ありがとう!