www.webdeveloper.com
Results 1 to 2 of 2

Thread: changing onlick method

  1. #1
    Join Date
    Feb 2012
    Posts
    1

    changing onlick method

    Hello, I would like to switch my calculation buttons to a select drop down list with a calculation button at the bottom. I have commented out my attempt at this, any ideas what im doing wrong?


    <!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>
    <title></title>


    <script type="text/JavaScript">

    // function compute(form){
    // if (document.getElementById('Select1') =="add"){
    function a_plus_b(form) {
    a=eval(form.a.value)
    b=eval(form.b.value)
    c=a+b
    //form.ans.value = c
    alert("your answer is: " + c)
    }
    //Else if (Select1 == "minus"){
    function a_minus_b(form) {
    a=eval(form.a.value)
    b=eval(form.b.value)
    c=a-b
    // form.ans.value = c
    alert("your answer is: " + c)
    }
    //else if (Select1 == "multi"){
    function a_times_b(form) {
    a=eval(form.a.value)
    b=eval(form.b.value)
    c=a*b
    //form.ans.value=c
    alert("your answer is: " + c)

    }
    //else if (Select1 =="divide")[
    function a_div_b(form) {
    a=eval(form.a.value)
    b=eval(form.b.value)
    c=a/b
    //form.ans.value = c
    alert("your answer is: " + c)
    }
    //}


    </script>

    </head>
    <body>
    <div align ="center">
    <form name="formx"><input type=text size=4 value=12 name="a">
    <br />
    <br />
    <!--choose operation:
    <input type="button" value=" + " onClick="a_plus_b(this.form)">
    <input type="button" value=" - " onClick="a_minus_b(this.form)">
    <input type="button" value=" x " onClick="a_times_b(this.form)">
    <input type="button" value=" / " onClick="a_div_b(this.form)">
    <!--cant get this to work right now, moving on -->
    choose operation:
    <select id="Select1" name="D1">
    <option id="add">+</option>
    <option id ="minus">-</option>
    <option id="multi">*</option>
    <option id="divide">/</option>
    </select>

    <br />
    <br />
    <input type="number" size=4 value=3 name="b">
    <br />
    </br>
    <input id="submit" type="button" value="calculate" onClick="compute(this.form)"/>
    <input type "number" value=0 name="ans" size=9>
    </form>


    </div>
    </body>
    </html>

  2. #2
    Join Date
    Feb 2012
    Location
    Tallahassee, FL
    Posts
    280
    Try this, I changed a bit.

    PHP Code:
    <html xmlns="http://www.w3.org/1999/xhtml">
    <
    head>
    <
    title></title>


    <
    script type="text/JavaScript">

    function 
    compute(form){
    var 
    operator document.getElementById('Select1').value;
    if (
    operator =="add"){
    function 
    a_plus_b(form) {
    a=eval(form.a.value)
    b=eval(form.b.value)
    c=a+b
    form
    .ans.value c
    alert
    ("your answer is: " c)
    }
    Else if (
    operator == "minus"){
    function 
    a_minus_b(form) {
    a=eval(form.a.value)
    b=eval(form.b.value)
    c=a-b
    form
    .ans.value c
    alert
    ("your answer is: " c)
    }
    else if (
    operator == "multi"){
    function 
    a_times_b(form) {
    a=eval(form.a.value)
    b=eval(form.b.value)
    c=a*b
    form
    .ans.value=c
    alert
    ("your answer is: " c)

    }
    else if (
    operator =="divide")[
    function 
    a_div_b(form) {
    a=eval(form.a.value)
    b=eval(form.b.value)
    c=a/b
    form
    .ans.value c
    alert
    ("your answer is: " c)
    }
    }


    </script>

    </head>
    <body>
    <div align ="center">
    <form name="formx"><input type=text size=4 value=12 name="a">
    <br />
    <br />
    <!--choose operation:
    <input type="button" value=" + " onClick="a_plus_b(this.form)"> 
    <input type="button" value=" - " onClick="a_minus_b(this.form)"> 
    <input type="button" value=" x " onClick="a_times_b(this.form)"> 
    <input type="button" value=" / " onClick="a_div_b(this.form)"> 
    <!--cant get this to work right now, moving on -->
    choose operation:
    <select id="Select1" name="D1">
    <option value="">Select an operation.</option>
    <option value="add">+</option>
    <option value="minus">-</option>
    <option value="multi">*</option>
    <option value="divide">/</option>
    </select>

    <br />
    <br />
    <input type="number" size=4 value=3 name="b"> 
    <br />
    </br>
    <input id="submit" type="button" value="calculate" onClick="compute(this.form)"/>
    <input type "number" value=0 name="ans" size=9>
    </form>


    </div>
    </body>
    </html> 

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles