asked on

a jquery functions stops adding a number in php

I have a piece of code below where it determines which assessment the user is in and the assessment number the user is currently on:

  <?php echo $sessionMinus ?> OF <?php echo $_SESSION['initial_count'] ?>

Open in new window

So on the browser this could read for example:
1 OF 4

Now below I have a submit button:

<input id="addQuestionBtn" name="addQuestion" type="button" value="Add Question" onClick="insertQuestion(this.form)" />

Open in new window

Now if the user clicks on the button, it will show a confirmation box and if the user clicks OK, for the confirmation, then it will submit the page and what is suppose to happen is that it adds a number to the assessment to indicate that the user is on the next assessment.

SO FOR EXAMPLE:

If it says this on the page:
1 OF 4

If the user submits the page and confirms, then it should now say this:
2 OF 4

This is because the user is on the next assessment now.

But the problem is that it is not adding the number at all when the user submits the page. It just stays at '1' and doesn't add up. So instead of doing the above it is doing the below:

If it says this on the page:
1 OF 4

If the user submits the page and confirms, then it still says:
1 OF 4

This is obviously incorrect.

I have tested my code and what I have found is that if there is that the jquery validation() is causing the number to not add up and stay at '1'. But my question is that how come this jquery function is causing this to happen?

Below is the jquery validation() function:

function validation() { 
 
    var _qid = ""; 
    var _msg = ""; 
 
    var alertValidation = ""; 
    // Note, this is just so it's declared... 
    $("tr.optionAndAnswer").each(function() { 
 
        }); 
 
 
    if (alertValidation != "") { 
        alert(_msg + alertValidation); 
        return false; 
    } 
 
    return true; 
 
}

Open in new window

Below is relevant code so you know what the code is:

<?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; 
 
        } 
 
    elseif (isset($_POST['submitDetails']) && $_SESSION['sessionCount'] < $_SESSION['sessionNum']) { 
        $_SESSION['sessionCount']++; 
    } 
 
 
    $sessionMinus =  $_SESSION['sessionCount']; 
 
    if ($sessionMinus == $_SESSION['initial_count']){  
 
        $action = 'create_session2.php';  
 
    }elseif($sessionMinus != $_SESSION['initial_count']){  
 
        $action = $_SERVER['PHP_SELF'];  
 
    } 
 
    ?> 
 
    <script type="text/javascript"> 
 
 
    function validation() { 
 
        var _qid = ""; 
        var _msg = ""; 
 
        var alertValidation = ""; 
        // Note, this is just so it's declared... 
        $("tr.optionAndAnswer").each(function() { 
 
            }); 
 
 
        if (alertValidation != "") { 
            alert(_msg + alertValidation); 
            return false; 
        } 
 
        return true; 
 
    } 
 
 
 
 
                 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><?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="question">Question</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> 

 UPDATE:

Below is the code of in the insertQuestion() function:
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);  
 
 
 
}

Open in new window

Gary

I'm a bit confused
When you click the submit the jquery posts the data to your server and then does...nothing.
What are you expecting it to do?

carlbrooks1995

ASKER

Ok this is what I want to do:

1. In the page before this page, the user enters in a number in a textbox and then submits the page, this will navigate to this page.
2. When user accesses this page, it will start with number 1, so it will state '1 OF 5' (imagine 5 is the number you entered in the textbox in previous page)
3. Now when user clicks on the submit button, the jquery will validate the page using validation() function, if this is passed then it will show confirmation box.
4. When user clicks on 'OK' to confirm the conifrmation box, the page will submit itself using php, but I want the php to add the first number by 1 so that the user is now on page '2 OF 5'. (As user has completed first script and now is on second script).
5. At moment it is not saying '2 OF 5', it is still saying '1 OF 5'

Does this make sense?

Gary

Ok this is resetting it everytime
if(isset($_POST['sessionNum'])){

Should be if not set then set the vars.
if(!isset($_POST['sessionNum'])){

leakim971

Looking up your code, it seems you did not put session_start() at the FISRT line of your php script.

<?php 
   session_start();
?>
<!DOCTYPE...
...

<head>
... and so on

Open in new window

leakim971

Check starting a php session section
http://www.tizag.com/phpT/phpsessions.php

Gary

He already has session_start() before using sessions.

leakim971

>He already has session_start() before using sessions.

Before you can begin storing user information in your PHP session, you must first start the session. When you start a session, it must be at the very beginning of your code, before any HTML or text is sent.

now check line 84, 86
that mean that before line 1 we've <DOCTYPE <head> tag and others HTML outputs

Dave Baldwin

I don't see any code with a DOCTYPE posted in this question at all. ??? I don't see a complete page anywhere either.

carlbrooks1995

ASKER

If I do if(isset($_POST['sessionNum'])) { and put session_start(); before any code, then problem is I get undefined index on $_SESSION['initial_count'];

carlbrooks1995

ASKER

@DaveBaldwin, it is a full page, I just did not include the doctype in this question. In my application there is a DOCTYPE

leakim971

please post the whole script
As you can see in my "example" I just put session_start() at the beginning, you can let the other lines of code at the same place

Dave Baldwin

But we probably need to see the full page to help you troubleshoot your problems. It does appear that you have some things out of order if you get the "undefined index on $_SESSION['initial_count']; ". Normally, these lines below should be the very first lines on your PHP page when you are using sessions. Until your page is working, you want to see all errors so you can fix them.

<?php
// Report all PHP errors
error_reporting(E_ALL);
session_start();

Open in new window

Gary

I'm having trouble following your logic
Where is 'sessionNum' set from.
In your code it only appears in a check at the beginning of the and then everything else is based on it.

carlbrooks1995

ASKER

Below is the complete full script. I am getting no errors in the error report:

<?php

error_reporting(E_ALL);

session_start();

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
        <title>Prepare Questions and Answers</title>
   <link rel="stylesheet" type="text/css" href="QandATableStyle3.css">
        <link rel="stylesheet" type="text/css" href="jquery/ui-lightness/jquery-ui-1.8.16.custom.css"/>
		<script type="text/javascript" src="jquery/jquery-1.7.min.js"></script>
		<script type="text/javascript" src="jquery/jquery-ui-1.8.16.custom.min.js"></script>
		<script type="text/javascript" src="jquery/jquery.simplemodal.js"></script>
		<script type="text/javascript" src="jquery/basic.js"></script>
		
		<link rel="stylesheet" type="text/css" href="jquery/ui-lightness/jquery-ui-1.8.14.custom.css"/>
		<link rel="stylesheet" type="text/css" href="jquery/ui-lightness/jquery-ui-timepicker-addon.css"/>
		<link rel="stylesheet" type="text/css" href="jquery/ui-lightness/basic.css"/>
		<link rel="stylesheet" type="text/css" href="jquery/ui-lightness/basic_ie.css"/>
		<script type="text/javascript" src="jquery/jquery-ui-timepicker-addon.js"></script>
		
				<?php


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 (isset($_POST['submitDetails']) &&  
       $_SESSION['sessionCount'] < $_SESSION['sessionNum']) { 
    $_SESSION['sessionCount']++; 
    echo 'test';
 } 
 
$sessionMinus =  $_SESSION['sessionCount']; 

if ($sessionMinus == $_SESSION['initial_count']){ 

    $action = 'create_session2.php'; 

}elseif($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 startImageUpload(imageuploadform){
	
  $(imageuploadform).find('.imagef1_upload_form').css('visibility','hidden'); 
      return true;
}

  
 function imageClickHandler(imageuploadform){ 
      if(imageValidation(imageuploadform)){ 
	      window.lastUploadImageIndex = $('.imageuploadform').index(imageuploadform); 
          return startImageUpload(imageuploadform); 
      } 
      return false;
  }
  
function validation() {

    var _qid = "";
    var _msg = "";

    var alertValidation = "";
    // Note, this is just so it's declared...
    $("tr.optionAndAnswer").each(function() {

        _msg = "You have errors on Question Number: " + _qid + "\n";

        
        });

      
    if (alertValidation != "") {
        alert(_msg + alertValidation);
        return false;
    }

    return true;

}
  
  


             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: ASSESSMENT <?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="question">Question</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>

Open in new window

carlbrooks1995

ASKER

@GaryC123 $_POST['sessionNum'] is the name of the textbox where the user enters a number. This is on the page before the user gets onto this page.

carlbrooks1995

ASKER

You can test the application yourself here, just follow steps below:

1. When you open link type in number 5 in the textbox and submit page

2. When you have navigated to next page you see on top it states CREATING QUESTIONS AND ANSWERS: ASSESSMENT 1 OF 5. Now scroll to bottom of page and click "Submit Details" button and confirm the confirmation box.

3. You will see that the heading still states CREATING QUESTIONS AND ANSWERS: ASSESSMENT 1 OF 5 and not CREATING QUESTIONS AND ANSWERS: ASSESSMENT 2 OF 5.

Dave Baldwin

In looking at the headers, I don't see anything being submitted, content length is 0. For a test, I would take out the onclick routine in your submit button and see what you get.

carlbrooks1995

ASKER

@DaveBaldwin, if I remove the onclick event in the sumit button and submit the page, then it does add the number by 1 each time the page is submitted. So what do I need to change the onclick event to?

Dave Baldwin

What do you need the onclick for? You might be able to just remove the 'return false;' part.

carlbrooks1995

ASKER

@DaveBaldwin I want the page to use jquery to check for any errors and then if no errors I want the confirmation box to appear after the usr has clicked on the submit button so I need the onclick event in my submit button:

onClick="myClickHandler(); return false;"

Open in new window

leakim971

It run fine for me now, just test it in a new window...
Clipboard02.png

carlbrooks1995

ASKER

It only ran fine because the onclick event was reomved before uploading the php script. I put the onclick event back in the submit. Now run the application and you see that it isn't working. I need to change the onclick event but don't know what to change it to

ASKER CERTIFIED SOLUTION

Dave Baldwin

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

carlbrooks1995

ASKER

thank you very much :)

Dave Baldwin

You're welcome.