以下のコード行は、ページの総数のうち、現在どのページにいるのかをユーザーに示しています。
<h1><?php echo $sessionMinus ?> OF <?php echo $_SESSION['initial_count'] ?></h1>
上記のコードは1 OF 7、3 OF 5、5 OF 6、などのように読むことができます。
しかし、問題があり、現在 Google Chrome と Mozilla firefox の間で問題が発生しています。以下に、アプリケーションhereへのリンクがあります。Firefox と chrome の両方でアプリケーションを開き、以下の手順に従っていただければ、問題を確認できます。
Chrome と Firefox の両方で提供した URL を開きます
両方のページでセッション数を入力し (7 と入力)、両方のブラウザでページを送信してください。
両方のブラウザの上部に、次の見出しがあることがわかります
"CREATING QUESTIONS AND ANSWERS: SESSION 1 OF 7"。両方のブラウザーのページで、[質問を追加] ボタンを 3 回クリックして、3 行を追加し、各行に画像ファイルの入力を含めます。
- 両方のブラウザのページの下部にある [Submit Details] ボタンをクリックします。
私があなたにしてほしいことは、見出しが何であるかを確認すること"CREATING QUESTIONS AND ANSWERS: SESSION ... OF 7"です。今は言います。Firefox では、最初のページを完了したので完全に機能し、現在は 2 番目のページにいるため、"CREATING QUESTIONS AND ANSWERS: SESSION 2 OF 7".
しかし、クロムではうまく機能しません。代わりにクロムでは、それは述べています"CREATING QUESTIONS AND ANSWERS: SESSION 5 OF 7"。これは、クロムが追加された各行に番号を追加しているためです (行を追加すると、フォームはそのセルフページにアップロードされます)。したがって、最初のページを送信した後、新しいページはそれを作成するために番号を追加します2 OF 7が、最初のページに追加された 3 行5 OF 7はクロムで作成されますが、これは完全に正しくありません。
だから私の質問は、クロムとFirefoxの動作が異なるのはなぜですか?ユーザーが次のページに移動するたびに正しいページ番号が表示されるように、クロムをFirefoxと同じように動作させる方法はありますか?
以下は完全なコードです。
<?php
session_start();
if(isset($_POST['sessionNum'])){
//Declare my counter for the first time
$_SESSION['initial_count'] = $_POST['sessionNum'];
$_SESSION['sessionNum'] = intval($_POST['sessionNum']);
$_SESSION['sessionCount'] = 1;
}
else if ($_SESSION['sessionCount'] < $_SESSION['sessionNum']) {
$_SESSION['sessionCount']++;
}
$sessionMinus = $_SESSION['sessionCount'];
if ($sessionMinus == $_SESSION['initial_count']){
$action = 'create_session2.php';
}else if($sessionMinus != $_SESSION['initial_count']){
$action = $_SERVER['PHP_SELF'];
}
?>
<script type="text/javascript">
function insertQuestion(form) {
var $tbody = $('#qandatbl > tbody');
var $tr = $("<tr class='optionAndAnswer' align='center'>");
var $image = $("<td class='image'></td>");
var $fileImage = $("<form action='imageupload.php' method='post' enctype='multipart/form-data' target='upload_target' onsubmit='return imageClickHandler(this);' class='imageuploadform' >" +
"<p class='imagef1_upload_process' align='center'>Loading...<br/><img src='Images/loader.gif' /><br/></p><p class='imagef1_upload_form' align='center'><br/><label>" +
"Image File: <input name='fileImage' type='file' class='fileImage' /></label><br/><br/><label class='imagelbl'>" +
"<input type='submit' name='submitImageBtn' class='sbtnimage' value='Upload' /></label>" +
"<iframe class='upload_target' name='upload_target' src='#' style='width:0;height:0;border:0px;solid;#fff;'></iframe></form>");
$image.append($fileImage);
$tr.append($image);
$tbody.append($tr);
}
function showConfirm(){
var confirmMsg=confirm("Make sure that your details are correct, once you proceed after this stage you would not be able to go back and change any details towards Questions, Options and Answers for your Session." + "\n" + "\n" + "Are you sure you want to Proceed?" + "\n" );
if (confirmMsg==true)
{
submitform();
}
}
function submitform()
{
var fieldvalue = $("#QandA").val();
$.post("insertQuestion.php", $("#QandA").serialize() ,function(data){
var QandAO = document.getElementById("QandA");
QandAO.submit();
});
alert("Your Details for this Session has been submitted");
}
</script>
</head>
<body>
<form id="QandA" action="<?php echo htmlentities($action); ?>" method="post">
<h1>CREATING QUESTIONS AND ANSWERS: SESSION <?php echo $sessionMinus ?> OF <?php echo $_SESSION['initial_count'] ?></h1>
<div id="detailsBlock">
<table id="questionBtn" align="center">
<tr>
<th>
<input id="addQuestionBtn" name="addQuestion" type="button" value="Add Question" onClick="insertQuestion(this.form)" />
</th>
</tr>
</table>
</div>
<hr/>
<div id="details">
<table id="qandatbl" align="center">
<thead>
<tr>
<th class="image">Image</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<p><input id="submitBtn" name="submitDetails" type="submit" value="Submit Details" onClick="myClickHandler(); return false;" /></p>
</form>
<script type="text/javascript">
function myClickHandler(){
if(validation()){
showConfirm();
}
}
</script>
</body>
</html>