How do you take input from a html textbox and assign it to a javascript variable?

Question

I am trying to take two times that the user enters and run them through some javascript functions. The times are entered by two textboxes. I have been trying to use the document.getElementById("ID") method but it doesn't seem to be working and I can't figure out why. Here is the part of my code that's having an issue.

Two html cells with my input boxes and two buttons:

<tr>
<td><input type="text" name="start" id="start"></td>
<td><input type="text" name="stop" id="stop"></td>
</tr>

<tr>
<td><button onclick="master_drug()">Drug</button></td>
<td><button onclick="master_hydration()">Hydration</button></td>
</tr>

The function assigned to the button that gets the values:

function master_drug(start, stop)
    {
    start = document.getElementById("start")
    stop = document.getElementById("stop")
    alert(stop)
    calculate_drug(start, stop)
    check_infusion(start, stop)
    check_injection(start, stop)
    alert(infusion.length + " infusions: " + injection.length + " injections: " + hydration.length + " hydrations: ")
    }

It looks like this should be a simple process but I am clearly missing something.

Did you place the JavaScript after the elements? Also you forgot to declare your variables, use var. — elclanrs
– elclanrs, Commented May 4, 2014 at 1:07
the javascript is linked at the top of the page between the "head" tags. I wasn't aware it was necessary to put the var in before the start, stop. I can put that in but I still don't think it will work. — RabidGorilla
– RabidGorilla, Commented May 4, 2014 at 1:11
@elclanrs The Javascript doesn't need to be before the buttons, when it is called from the buttons onclick HTML attribute. — Paul
– Paul, Commented May 4, 2014 at 1:15

Nuri Tasdemir · Accepted Answer · 2014-05-04 01:12:15Z

2

You should get the value from the elements

document.getElementById("start").value

answered May 4, 2014 at 1:12

Nuri Tasdemir

9,8823 gold badges47 silver badges70 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Syntax · Accepted Answer · 2014-05-04 01:14:43Z

2

Make sure the script tag comes after the elements.

JSFiddle: http://jsfiddle.net/v63W6/

<tr>
    <td><input type="text" name="start" id="start"></td>
    <td><input type="text" name="stop" id="stop"></td>
</tr>
<tr>
    <td><button onclick="master_drug()">Drug</button></td>
</tr>

<script>
    function master_drug() {
        var start = document.getElementById("start").value;
        var stop = document.getElementById("stop").value;
        alert(stop);
    }
</script>

answered May 4, 2014 at 1:14

Syntax

2,14316 silver badges15 bronze badges

1 Comment

RabidGorilla Over a year ago

Fixed it. Forgot the .value on the end

Collectives™ on Stack Overflow

How do you take input from a html textbox and assign it to a javascript variable?

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related