Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    JavaScript Problem

    Hi all I am a newbie and I don't know much about JavaScript. Can anyone help me with an issue that I am having.

    Please see code below.

    Code:
      <form id="mySurvey" name="mySurvey" onSubmit="return markMe(this);">
    <table width="510" border="0" cellspacing="0" cellpadding="0" align="center" class="datatable1">
    	  <tr> 
    	  	<th class="leftme" width="15">&nbsp;</a></th>
    	    <th width="465">TASKS/ACTIVITIES</th>
    	    <th width="30" class="midme">HRS</th>	
    		<th width="30" class="midme">MINS</th>
    	  </tr>
    	  <tr> 
    	    <td class="leftme">1.</td>
    	    <td>Sleep</td>
    	    <td class="midme">
    			<select name="option1h" size="1">
    				<option value="0" selected>0</option>
    				<option value="1">1</option>
    				<option value="2">2</option>
    				<option value="3">3</option>
    				<option value="4">4</option>
    				<option value="5">5</option>
    				<option value="6">6</option>
    				<option value="7">7</option>
    				<option value="8">8</option>
    				<option value="9">9</option>
    				<option value="10">10</option>
    				<option value="11">11</option>
    				<option value="12">12</option>			
    			</select>
    		</td>
    		<td class="rightme">
    			<select name="option1m" size="1">
    				<option value="0" selected>0</option>			
    				<option value="5" >5</option>
    				<option value="10">10</option>
    				<option value="15">15</option>
    				<option value="20">20</option>
    				<option value="25">25</option>
    				<option value="30">30</option>
    				<option value="35">35</option>
    				<option value="40">40</option>
    				<option value="45">45</option>
    				<option value="50">50</option>
    				<option value="55">55</option>
    			</select>		
    		</td>
    	  </tr>
    	  <tr> 
    	    <td class="leftme">2.</td>
    	    <td>Food Preparation/consumption (breakfast, dinner, lunch)</td>
    	    <td class="midme">
    			<select name="option2h" size="1">
    				<option value="0" selected>0</option>
    				<option value="1">1</option>
    				<option value="2">2</option>
    				<option value="3">3</option>
    				<option value="4">4</option>
    				<option value="5">5</option>
    				<option value="6">6</option>
    				<option value="7">7</option>
    				<option value="8">8</option>
    				<option value="9">9</option>
    				<option value="10">10</option>
    				<option value="11">11</option>
    				<option value="12">12</option>			
    			</select>
    		</td>
    		<td class="rightme">
    			<select name="option2m" size="1">
    				<option value="0" selected>0</option>			
    				<option value="5" >5</option>
    				<option value="10">10</option>
    				<option value="15">15</option>
    				<option value="20">20</option>
    				<option value="25">25</option>
    				<option value="30">30</option>
    				<option value="35">35</option>
    				<option value="40">40</option>
    				<option value="45">45</option>
    				<option value="50">50</option>
    				<option value="55">55</option>
    			</select>		
    		</td>
    	  </tr>
    	  <tr> 
    	    <td class="leftme">3.</td>
    	    <td>Work commitments</td>
    	    <td class="midme">
    			<select name="option3h" size="1">
    				<option value="0" selected>0</option>
    				<option value="1">1</option>
    				<option value="2">2</option>
    				<option value="3">3</option>
    				<option value="4">4</option>
    				<option value="5">5</option>
    				<option value="6">6</option>
    				<option value="7">7</option>
    				<option value="8">8</option>
    				<option value="9">9</option>
    				<option value="10">10</option>
    				<option value="11">11</option>
    				<option value="12">12</option>			
    			</select>
    		</td>
    		<td class="rightme">
    			<select name="option3m" size="1">
    				<option value="0" selected>0</option>			
    				<option value="5" >5</option>
    				<option value="10">10</option>
    				<option value="15">15</option>
    				<option value="20">20</option>
    				<option value="25">25</option>
    				<option value="30">30</option>
    				<option value="35">35</option>
    				<option value="40">40</option>
    				<option value="45">45</option>
    				<option value="50">50</option>
    				<option value="55">55</option>
    			</select>		
    		</td>
    	  </tr>
    	  <tr> 
    	    <td class="leftme">4.</td>
    	    <td>Exercise/recreational sports</td>
    	    <td class="midme">
    			<select name="option4h" size="1">
    				<option value="0" selected>0</option>
    				<option value="1">1</option>
    				<option value="2">2</option>
    				<option value="3">3</option>
    				<option value="4">4</option>
    				<option value="5">5</option>
    				<option value="6">6</option>
    				<option value="7">7</option>
    				<option value="8">8</option>
    				<option value="9">9</option>
    				<option value="10">10</option>
    				<option value="11">11</option>
    				<option value="12">12</option>			
    			</select>
    		</td>
    		<td class="rightme">
    			<select name="option4m" size="1">
    				<option value="0" selected>0</option>			
    				<option value="5" >5</option>
    				<option value="10">10</option>
    				<option value="15">15</option>
    				<option value="20">20</option>
    				<option value="25">25</option>
    				<option value="30">30</option>
    				<option value="35">35</option>
    				<option value="40">40</option>
    				<option value="45">45</option>
    				<option value="50">50</option>
    				<option value="55">55</option>
    			</select>		
    		</td>
    	  </tr>
    	  <tr> 
    	    <td class="leftme">5.</td>
    	    <td>Socialising</td>
    	    <td class="midme">
    			<select name="option5h" size="1">
    				<option value="0" selected>0</option>
    				<option value="1">1</option>
    				<option value="2">2</option>
    				<option value="3">3</option>
    				<option value="4">4</option>
    				<option value="5">5</option>
    				<option value="6">6</option>
    				<option value="7">7</option>
    				<option value="8">8</option>
    				<option value="9">9</option>
    				<option value="10">10</option>
    				<option value="11">11</option>
    				<option value="12">12</option>			
    			</select>
    		</td>
    		<td class="rightme">
    			<select name="option5m" size="1">
    				<option value="0" selected>0</option>			
    				<option value="5" >5</option>
    				<option value="10">10</option>
    				<option value="15">15</option>
    				<option value="20">20</option>
    				<option value="25">25</option>
    				<option value="30">30</option>
    				<option value="35">35</option>
    				<option value="40">40</option>
    				<option value="45">45</option>
    				<option value="50">50</option>
    				<option value="55">55</option>
    			</select>		
    		</td>
    	  </tr>
    	  <tr> 
    	    <td class="leftme">6.</td>
    	    <td>Family commitments</td>
    	    <td class="midme">
    			<select name="option6h" size="1">
    				<option value="0" selected>0</option>
    				<option value="1">1</option>
    				<option value="2">2</option>
    				<option value="3">3</option>
    				<option value="4">4</option>
    				<option value="5">5</option>
    				<option value="6">6</option>
    				<option value="7">7</option>
    				<option value="8">8</option>
    				<option value="9">9</option>
    				<option value="10">10</option>
    				<option value="11">11</option>
    				<option value="12">12</option>			
    			</select>
    		</td>
    		<td class="rightme">
    			<select name="option6m" size="1">
    				<option value="0" selected>0</option>			
    				<option value="5" >5</option>
    				<option value="10">10</option>
    				<option value="15">15</option>
    				<option value="20">20</option>
    				<option value="25">25</option>
    				<option value="30">30</option>
    				<option value="35">35</option>
    				<option value="40">40</option>
    				<option value="45">45</option>
    				<option value="50">50</option>
    				<option value="55">55</option>
    			</select>		
    		</td>
    	  </tr>
    	  <tr> 
    	    <td class="leftme">7.</td>
    	    <td>Relaxation (watching television etc.)</td>
    	    <td class="midme">
    			<select name="option7h" size="1">
    				<option value="0" selected>0</option>
    				<option value="1">1</option>
    				<option value="2">2</option>
    				<option value="3">3</option>
    				<option value="4">4</option>
    				<option value="5">5</option>
    				<option value="6">6</option>
    				<option value="7">7</option>
    				<option value="8">8</option>
    				<option value="9">9</option>
    				<option value="10">10</option>
    				<option value="11">11</option>
    				<option value="12">12</option>			
    			</select>
    		</td>
    		<td class="rightme">
    			<select name="option7m" size="1">
    				<option value="0" selected>0</option>			
    				<option value="5" >5</option>
    				<option value="10">10</option>
    				<option value="15">15</option>
    				<option value="20">20</option>
    				<option value="25">25</option>
    				<option value="30">30</option>
    				<option value="35">35</option>
    				<option value="40">40</option>
    				<option value="45">45</option>
    				<option value="50">50</option>
    				<option value="55">55</option>
    			</select>		
    		</td>
    	  </tr>
    	  <tr> 
    	    <td class="leftme">8.</td>
    	    <td>Travel</td>
    	    <td class="midme">
    			<select name="option8h" size="1">
    				<option value="0" selected>0</option>
    				<option value="1">1</option>
    				<option value="2">2</option>
    				<option value="3">3</option>
    				<option value="4">4</option>
    				<option value="5">5</option>
    				<option value="6">6</option>
    				<option value="7">7</option>
    				<option value="8">8</option>
    				<option value="9">9</option>
    				<option value="10">10</option>
    				<option value="11">11</option>
    				<option value="12">12</option>			
    			</select>
    		</td>
    		<td class="rightme">
    			<select name="option8m" size="1">
    				<option value="0" selected>0</option>			
    				<option value="5" >5</option>
    				<option value="10">10</option>
    				<option value="15">15</option>
    				<option value="20">20</option>
    				<option value="25">25</option>
    				<option value="30">30</option>
    				<option value="35">35</option>
    				<option value="40">40</option>
    				<option value="45">45</option>
    				<option value="50">50</option>
    				<option value="55">55</option>
    			</select>		
    		</td>
    	  </tr>
    	  <tr> 
    	    <td class="leftme">9.</td>
    	    <td>Other</td>
    	    <td class="midme">
    			<select name="option9h" size="1">
    				<option value="0" selected>0</option>
    				<option value="1">1</option>
    				<option value="2">2</option>
    				<option value="3">3</option>
    				<option value="4">4</option>
    				<option value="5">5</option>
    				<option value="6">6</option>
    				<option value="7">7</option>
    				<option value="8">8</option>
    				<option value="9">9</option>
    				<option value="10">10</option>
    				<option value="11">11</option>
    				<option value="12">12</option>			
    			</select>
    		</td>
    		<td class="rightme">
    			<select name="option9m" size="1">
    				<option value="0" selected>0</option>			
    				<option value="5" >5</option>
    				<option value="10">10</option>
    				<option value="15">15</option>
    				<option value="20">20</option>
    				<option value="25">25</option>
    				<option value="30">30</option>
    				<option value="35">35</option>
    				<option value="40">40</option>
    				<option value="45">45</option>
    				<option value="50">50</option>
    				<option value="55">55</option>
    			</select>		
    		</td>
    	  </tr>	  	  	  	  	  	  	  
    	  <tr> 
    	    <th colspan="4" class="midme"><input type="submit" value="Submit"></th>	
    	  </tr>  
    	</table>
    </form>
    
    </div>
    
    
    <script language="JavaScript">
    <!--
    
    function markMe(mySurvey){
    
    	var timeCount = 0; var timeLeft=0; var totalHours = 0; var totalMins = 0; 
    	for (var i=0; i < mySurvey.elements.length; i++){	
    		var e = document.mySurvey.elements[i];
        	var inputType = e.type;	var inputName = e.name; var inputValue = e.value;
    		if (inputType == 'select-one'){
    			
    			var theLength = inputName.length;
    			var theKey = (inputName.substring(theLength - 1, theLength));
    			if (theKey == 'h'){
    				timeCount+=parseFloat(inputValue*60);
    			}
    			if (theKey == 'm'){
    				timeCount+=parseFloat(inputValue);
    			}
    		}
    	}
    	
    	if (timeCount > 1440){
    		alert('TRY AGAIN:\n\nThere are only 24 hours in a day - please re-calculate your figures!');
    		document.getElementById("theresponse").innerHTML = '';
    	}
    	else{
    		timeLeft = (1440 - timeCount);
    		totalHours = parseInt(timeLeft/60);
    		totalMinutes = (timeLeft%60);
    		var myResponse = ('<b>Based on these calculations, you have a maximum of ' + totalHours + ' hours and ' + totalMinutes + ' minutes free time for this course.</b>');
    
    		if (document.getElementById){
    			document.getElementById("theresponse").innerHTML = myResponse;
    		}	
    		else {
    		alert ('myReponse')
    		}
    	}
    
    return false;	
    }
    //-->
    </script>
    Thanks in advance for any help,

    Fergal

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,919
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    And what is the issue you are having? We are not clairvoyant.

    It is your responsibility to die() if necessary….. - PHP Manual

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #3
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Sorry, didn't think!!

    When I enter values that exceed 24hrs then I am prompted with an alert box stating that there is only 24hrs in the day and this works fine but when I am under the 24hrs, say for example 22hrs are used up then another alert box is suppose to appear and stated the time which is left which in this case would be 2hrs and 0mins.

    Hope this helps,

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,919
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    There are two references to an element
    document.getElementById("theresponse").innerHTML = '';
    but there is no element by the name of "theresponse".

    The line alert ('myReponse') will output the literal word myResponse.

    I have the idea that someone has attempted (unsuccessfully) to doctor the code.

    Add the required div in your HTML just before the <script> tag:-
    <div id = "theresponse"></div>

    This is pretty ancient code.
    if (document.getElementById){ // all modern browsers support document.getElementById
    <script language="javascript"> is long deprecated and obsolete. Use <script type = "text/javascript"> instead.
    The <!-- and //--> comment (hiding) tags have not been necessary since IE3 (i.e. since September 1997). If you see these in some published script it is a warning that you are probably looking at ancient and perhaps unreliable code.
    Last edited by Philip M; 07-06-2011 at 04:34 PM. Reason: typo

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #5
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts
    I am a lecturer and I have inherited a module. I have been trying to update it and I have come to a stand still at this.

    Any suggestions on how i could fix this.

    Thanks

  • #6
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,919
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    What do you lecture in? Surely not Javascript?

    I told you how to fix it in Post#4.

    Add the required div in your HTML just before the <script> tag:-
    <div id = "theresponse"></div>

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • Users who have thanked Philip M for this post:

    concrete (07-07-2011)

  • #7
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts
    I lecture on the Interactive Teaching Technologies Course. I over looked the fix, and thank you for helping!!! It seems this course need an overhaul, as some of it is considerably outdated!!

    That my summer taken care of then.

    Thanks again


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •