how to get the values of textbox to a variable in script?

Question

I have written a script like this

function calculateDiff(){

    _start = "1:00 PM";
    _end = "1:00 AM";

    _start_time = parseAMDate(_start);
    _end_time = parseAMDate(_end);

    if (_end_time < _start_time){
        _end_time = parseAMDate(_end,1);
    }

    var difference= _end_time - _start_time;

    var hours = Math.floor(difference / 36e5),
        minutes = Math.floor(difference % 36e5 / 60000);
    if (parseInt(hours) >= 0 ){
        if (minutes == 0){
            minutes = "00";
        }
        alert(hours+":"+minutes);
    }
}
function parseAMDate(input, next_day) {

    var dateReg = /(\d{1,2}):(\d{2})\s*(AM|PM)/;

    var hour, minute, result = dateReg.exec(input);

    if (result) {
        hour = +result[1];
        minute = +result[2];

        if (result[3] === 'PM' && hour !== 12) {
            hour += 12;
        }
    }
    if (!next_day) {
        return new Date(1970, 01, 01, hour, minute).getTime();
    }else{
        return new Date(197var start = document.getElementById("usr1").value;
  var end = document.getElementById("usr2").value;0, 01, 02, hour, minute).getTime();
      }
   }

here ,for _start and _end ,i have given values now i want these values should get from a textbox for that i have written code like

<form action="calculateDiff()">
Select  start time:<input type="time" name="usr1">
 Select  end time: <input type="time" name="usr2">
<input type="submit">
</form>

when i select time in text box(usr1),how to get the time to the script function? plz help me

Stasel · Accepted Answer · 2015-11-30 06:32:46Z

1

I would suggest to add an id property to the input fields:

<form action="calculateDiff()">
    Select  start time:<input type="time" name="usr1" id="startTime">
    Select  end time: <input type="time" name="usr2" id="endTime">
    <input type="submit">
</form>

Now we can use document.getElementById to get direct access to the html element:

var start = document.getElementById("startTime").value;
var end = document.getElementById("endTime").value;

document.getElementById("usr1") will return the HTML textfield object itself and it has a few properties. One of them is value which represents the content inside the textfield (you can even change it using javascript).

4 Comments

Iman K Over a year ago

Keep in mind that this would require an id to be added to the input tags in addition to what is currently there.

Naga Phaneendra Over a year ago

my total code is this how do i calculate time difference

Naga Phaneendra Over a year ago

in my url shows like calculateDiff()?usr1=01%3A00&usr2=02%3A00 ,web page not found error is comming

Stasel Over a year ago

@NagaPhaneendra the action property on the form is the address to send the data to. You may want to use onsubmit instead. Anyways, please read more about html forms here

John R · Accepted Answer · 2015-11-30 06:41:26Z

0

Try this

_start = document.getElementsByName('usr1')[0].value; //It will fetch the value of the first element in the DOM with the name usr1
_end = document.getElementsByName('usr2')[0].value; //It will fetch the value of the first element in the DOM with the name usr2

edited Nov 30, 2015 at 6:41

answered Nov 30, 2015 at 6:32

John R

2,8212 gold badges16 silver badges33 bronze badges

2 Comments

Naga Phaneendra Over a year ago

in my url it was showing like calculateDiff()?usr1=01%3A00&usr2=02%3A00

John R Over a year ago

Please update you HTML code if you are really using id for text box and then check your else part of if (!next_day) for syntax error.

Muhammad Waqas · Accepted Answer · 2015-11-30 06:46:15Z

0

you can get value of input like this

var _start = document.getElementsByName("usr1")[0].value;
var _end = document.getElementsByName("usr2")[0].value;

answered Nov 30, 2015 at 6:46

Muhammad Waqas

1,15012 silver badges20 bronze badges

4 Comments

Naga Phaneendra Over a year ago

in my url it was getting like this calculateDiff()?usr1=01%3A00&usr2=02%3A00

John R Over a year ago

@MuhammadWaqas What is the difference in your answer while comparing with my answer?

Muhammad Waqas Over a year ago

@JohnR dude you are also correct i did't see your answer in feeds

Muhammad Waqas Over a year ago

@NagaPhaneendra why you are passing function in action you can simply get your restult change the input type submit to button

Collectives™ on Stack Overflow

how to get the values of textbox to a variable in script?

3 Answers 3

4 Comments

2 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related