1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Display results in box or div on same page.

Discussion in 'JavaScript' started by Astroman, Nov 20, 2009.

0
  1. #1
    I'm having a go at doing a simple little calculation with javascript like this:

    <SCRIPT> 
   function addThreeNums (inOne, inTwo, inThree) { 
      var inOne = Number(inOne); 
      var inTwo = Number(inTwo); 
      var inThree = Number(inThree); 
      return Number(inOne / inThree * inTwo * '4.6' / '10'); 
   } 
   </SCRIPT>
</HEAD>
<BODY>
<FORM Name="theForm" METHOD="post">
<INPUT Type=Text Name="num1">
<INPUT Type=Text Name="num2">
<INPUT Type=Text Name="num3">
<INPUT Type=Button Value="Calculate" 
         onClick='alert("The sum of the three numbers is " + 

addThreeNums(theForm.num1.value,theForm.num2.value,theForm.num3.value));'>
</FORM>
    Code (markup):
    and using 'alert' is the only way I know of getting the answer to display on the same page... so how do I get the result to display in the same page in another text box, or even a div?
     
    Astroman, Nov 20, 2009 IP
  2. hdewantara

    hdewantara Well-Known Member

    Messages:
    536
    Likes Received:
    47
    Best Answers:
    25
    Trophy Points:
    155
    #2
    For processing forms with javascript only,
    better use id instead of name, e.g: <input type="text" id="num1" />.

    And to show the result to a div in the document's body,
    you could paste the calculation result to div's innerHTML property, e.g:
    document.getElementById("divID").innerHTML="The sum of ...
     
    hdewantara, Nov 21, 2009 IP
    Astroman likes this.
  3. ishti

    ishti Peon

    Messages:
    11
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Yes, as hdewantara said,
    you could print the result in the same page using a <div> tag.

    >>Declare an empty div tag in the body, with just its Id.
    >>Set the value of that tag from the JavaScript, like,

    var result = Number(inOne / inThree * inTwo * '4.6' / '10');
    document.getElementById("divTagName").innerHTML = "The result is"+result;

    inside your function.

    HTH.

    -ishti.
     
    ishti, Nov 23, 2009 IP
    Astroman likes this.
  4. camjohnson95

    camjohnson95 Active Member

    Messages:
    737
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    60
    #4 
    
<HTML><HEAD>
<SCRIPT>
window.onload = function() {
	var myForm = document.getElementById("theForm");
	myForm.onsubmit = function() {
		var n1 = document.getElementById("num1").value;
		var n2 = document.getElementById("num2").value;
		var n3 = document.getElementById("num3").value;
		document.getElementById("result").innerHTML = n1 / n3 * n2 * 4.6 / 10;
		return false;
	}
}
</SCRIPT>
</HEAD>
<BODY>
<FORM Id="theForm">
<INPUT Type="Text" Id="num1">
<INPUT Type="Text" Id="num2">
<INPUT Type="Text" Id="num3">
<INPUT Type="Submit" Value="Calculate">
<div id="result"></div>
</FORM>
</BODY>
</HTML>
    Code (markup):
    I prefer not to use inline js (onclick='.....'), it looks much better when you don't, and apparently has other advantages.The window.onload = function() .... is there because the code is at the top of the page. If you didn't have this then errors would occur because the elements that are you referring to have not been loaded yet, you could remove this block if the code was at the bottom of the page because the elemets will have been loaded.
     
    Last edited: Nov 23, 2009
    camjohnson95, Nov 23, 2009 IP
    Astroman likes this.
  5. Astroman

    Astroman Well-Known Member

    Messages:
    2,355
    Likes Received:
    71
    Best Answers:
    0
    Trophy Points:
    135
    #5
    Thanks, that's really cool. I gave +rep to everyone. :)
     
    Astroman, Nov 23, 2009 IP
  6. camjohnson95

    camjohnson95 Active Member

    Messages:
    737
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    60
    #6
    What does it mean when the little square beside rep recieved is grey, rather than green? I can't work it out and there is no explanation. At first I thought it was when someone marks 'I disapprove'... but the comments next to it don't confirm that. Does anyone know what the difference is between grey and green?
     
    camjohnson95, Nov 23, 2009 IP
  7. Astroman

    Astroman Well-Known Member

    Messages:
    2,355
    Likes Received:
    71
    Best Answers:
    0
    Trophy Points:
    135
    #7
    Did the one I just made come out gray?

    I got one where it didn't match what they said, I assumed they chose disapprove by mistake.
     
    Astroman, Nov 23, 2009 IP
  8. camjohnson95

    camjohnson95 Active Member

    Messages:
    737
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    60
    #8
    Nah yours was green, but I have had a few that say things like 'thanks for the help!', with a grey box... I really couldn't care less about rep, but I can't work out why it is grey sometimes...
    Although it is good to know when your advice has been used and appreciated... it is a bit annoying when you spend half an hour coding a solution only to never hear another word or post from the person that you have spent that time helping.
    Maybe it is grey when the user has less than a certain number of posts... that is the only reason that I can think of.
     
    camjohnson95, Nov 23, 2009 IP
  9. Astroman

    Astroman Well-Known Member

    Messages:
    2,355
    Likes Received:
    71
    Best Answers:
    0
    Trophy Points:
    135
    #9
    I do know the more rep point you have the more rep points you give to people, so maybe you're right? Anyway, I always give rep points and some response when people help me. I also help other people if I spot threads in here that I know the answer to. :)
     
    Astroman, Nov 23, 2009 IP
  10. camjohnson95

    camjohnson95 Active Member

    Messages:
    737
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    60
    #10
    I mainly just try and help people. I find that it is a good way to learn. My programming skills have improved a LOT since i started participating in these forums...Even if i don't know the answer to a problem i will research it and try and work out a solution. That way, if I ever need to do the same task.. I will know exactly how.
     
    camjohnson95, Nov 23, 2009 IP