In this code i try to get the difference between two date and time
ex(09/05/2014 09:10:00 - 09/05/2014 11:18:00 ) it should return 78 minutes with a single function for multiple textboxes but unfortunately this piece of code is not working can some one suggest me the correct code or is there is any alternative way to perform this function , thanks in advance.
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="JS/datejquery.min.js"></script>
<script type="text/javascript">
$( document ).ready(function() {
$("id^='endTime'".change(function(){
var index = $(this).attr('id').replace('endTime','');
alert(index);
var startTime = $('#startTime'+index).val();
var endTime = $(this).val();
$('#result'+index).val(endTime-startTime);
});
} );
</script>
</head>
<body>
<form name="wrs">
<input type="text" name="time1" id= "startTime1" class="num-box type1" />
<input type="text" name="time2" id = "endTime1" class="num-box type2" />
<input type="text" name="result1" class="num-box type5" />
<input type="text" name="startTime2" id= "time3" class="num-box type3" />
<input type="text" name="endTime2" id = "time4" class="num-box type4" />
<input type="text" name="result2" class="num-box type6" />
</form>
</body>
</html>
You missed the brackets.
$("[id^='endTime']").change(function(){
var index = $(this).attr('id').slice(7);
alert(index);
var startTime = $('#startTime'+index).val();
var endTime = $(this).val();
$('#result'+index).val(endTime-startTime);
});
Related
I have a Currency Converter , consisting of two fields and a button. In the first field I type the amount I want to be converted, in the second field I get the result of the conversion.
The question is:
When I type text in the first field, how can I clean up the text from the second field with the conversion result? Using a Javascript / Jquery function?
Thanks in advance.
This is my code:
function convertiLireInEuro() {
var importoInserito = $('#txtLireEuro').val();
importoInserito = importoInserito.replace(/,/g, '.');
var lire = parseFloat(importoInserito)
var euro = lire * 1000 / 1936.27
euro = euro.toFixed(2);
euro = Math.round(euro);
$('#txtConversione').val(euro); }
HTML:
<input type="text" id="txtLireEuro" name="txtLireEuro" style="text-align:right" onkeypress="return onlyNumbers(event);" /> 000 ₤
<input value="Converti in Euro" type="button" id="btnLireEuro" name="btnLireEuro" style="margin-left: 20px" onclick="convertiLireInEuro();highlightAndCopyText();"/>
<input type="text" id="txtConversione" name="txtConversione" style="text-align:right;margin-left:20px" readonly /> €
<span class="Label" style="margin-left:12px">(importo già arrotondato all’intero e incollabile nel campo desiderato)</span>
Here is what you need, I post a coding snippet. I have 2 fields, typing-field and field-to-reset. If you first fill in the field-to-reset with some text and then start typing in typing-field the field-to-reset will reset.
let typing = document.getElementById("typing-field");
let reset = document.getElementById("field-to-reset");
typing.addEventListener("keydown", () => {
reset.value = "";
})
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>Typing field:</div>
<input id="typing-field" type="text">
<div>Field to reset:</div>
<input id="field-to-reset" type="text">
</body>
</html>
HTML Code
<body>
<input type="text" id="input_box">
<input type="text" id="result_box">
</body>
JQuery Code
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("#input_box").keydown(function(){
$("#result_box").val("");
})
});
</script>
<body>
<input type="text" id="input_box">
<input type="text" id="result_box">
</body>
When "Input_box" is getting focus on click the result_box will clear
it's value.
You already have an onkeypress event listener named onlyNumbers. You can simply put $('#txtConversione').val = ""; in that function.
This question already has answers here:
What's the fastest way to convert String to Number in JavaScript?
(10 answers)
Closed 2 years ago.
function convertion() {
let inputValue = number(document.getElementById('firstValue').value);
let result = document.getElementById('secondValue');
result.innerHTML = inputValue * 10;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1" />
</head>
<body>
<main>
<label for="firstValue">dm: </label>
<input id="firstValue" type='number'>
<button onclick="convertion()">
CONVERT
</button>
<br/>
<br/>
<label for="secondValue">cm: </label>
<input id="secondValue" readonly>
</main>
</body>
</html>
This is a dm-cm converter I don't know why it doesn't work. I think there's an error in the script.
I also don't know how to use the number function in this line:
let inputValue = number(document.getElementById('firstValue').value)
input boxes don't have innerHTML use value instead
function convertion() {
let inputValue = document.getElementById('firstValue').value;
console.log(inputValue);
let result = document.getElementById('secondValue');
result.value = inputValue * 10;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1" />
</head>
<body>
<main>
<label for="firstValue">dm: </label>
<input id="firstValue" type='number' onchange="convertion()">
CONVERT
</button>
<br/>
<br/>
<label for="secondValue">cm: </label>
<input id="secondValue" readonly>
</main>
</body>
</html>
Hey guys i put an alert box in to see if the code worked but when I ran it the code did not work. I tried debugging it and I think the issue is on document.getelementbyid (ofbat) but not sure exactly what is wrong there.
Also once the code works how do i add inner html to it so the answer comes out on the same screen? I emphasized the part where i thought the code was not working.
<html !doctype>
<html lang="en">
<head>
<meta charset="utf-8">
<title> Lab7 Baseball Form</title>
<script type="text/javascript">
function calculation() {
var batterName = parseFloat(document.getElementById('battername').value);
*var atBat = parseFloat(document.getElementById)('ofbat').value);*
var ofSingles = parseFloat(document.getElementById)('ofsingles').value);
var ofDoubles = parseFloat(document.getElementById)('ofdoubles').value);
var ofTriples = parseFloat(document.getElementById)('oftriples').value);
var ofHome = parseFloat(document.getElementById)('ofhome').value);
var totalBases = ofSingles *1 + ofDoubles * 2 + ofTriples * 3 + ofHome *4;
var slugPercent =totalBases/ atBat;
alert batterName + slugPercent;
}
</script>
</head>
<body>
<h1>Slugging Percentage Calculator</h1>
<form>
<p>Batter's Name:</p>
<input type="text" id="battername" /><br />
<p>Enter number of At Bats:</p>
<input type="text" id="ofbat" /><br />
<p>Enter number of Singles:</p>
<input type="text" id="ofsingles" /><br />
<p>Enter number of Doubles:</p>
<input type="text" id="ofdoubles" /><br />
<p>Enter number of Triples:</p>
<input type="text" id="oftriples" /><br />
<p>Enter number of Home Runs:</p>
<input type="text" id="ofhome" /><br />
<input type="button" value="Whats his slugging percentage?" onclick="calculation()">
</form>
</body>
</html>
You have syntax errors:
document.getElementById)('ofbat'): ) after Id. Same with all next lines.
alert is also a function so it should be called as alert(argument)
I think I found all syntax errors, if not let me know:
<html !doctype>
<html lang="en">
<head>
<meta charset="utf-8">
<title> Lab7 Baseball Form</title>
<script type="text/javascript">
function calculation() {
var batterName = parseFloat(document.getElementById('battername').value);
var atBat = parseFloat(document.getElementById('ofbat').value);
var ofSingles = parseFloat(document.getElementById('ofsingles').value);
var ofDoubles = parseFloat(document.getElementById('ofdoubles').value);
var ofTriples = parseFloat(document.getElementById('oftriples').value);
var ofHome = parseFloat(document.getElementById('ofhome').value);
var totalBases = ofSingles * 1 + ofDoubles * 2 + ofTriples * 3 + ofHome * 4;
var slugPercent = totalBases / atBat;
alert(batterName + slugPercent);
}
</script>
</head>
<body>
<h1>Slugging Percentage Calculator</h1>
<form>
<p>Batter's Name:</p>
<input type="text" id="battername" /><br />
<p>Enter number of At Bats:</p>
<input type="text" id="ofbat" /><br />
<p>Enter number of Singles:</p>
<input type="text" id="ofsingles" /><br />
<p>Enter number of Doubles:</p>
<input type="text" id="ofdoubles" /><br />
<p>Enter number of Triples:</p>
<input type="text" id="oftriples" /><br />
<p>Enter number of Home Runs:</p>
<input type="text" id="ofhome" /><br />
<input type="button" value="Whats his slugging percentage?" onclick="calculation()">
</form>
</body>
</html>
UPD: edited code some number of times because found one more syntax error. If you haven't seen this line, please check the code again.
I am newbie to Javascript... and I am unable to get from input to js variable, I referred to the questions asked here before still I unable to get the information. My code is as follows:-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JS </title>
<body>
<form>
<input type="text" id="amount" placeholder="Amount">
<button type="button" onclick="calc()">Submit</button>
</form>
<h1 id="TotalAmout"></h1>
<script>
function calc() {
var amt = document.getElementById("amount").value;
document.getElementById("TotalAmount").innerHTML = amt;
}
</script>
</body>
</html>
Typo in H1 TotalAmout should be TotalAmount
Calc should be defined before calling it. Fiddle
<head>
function calc() {
var amt = document.getElementById("amount").value;
document.getElementById("TotalAmount").innerHTML = amt;
}
</head>
<body>
<form>
<input type="text" id="amount" placeholder="Amount">
<button type="button" onclick="javascript:calc()">Submit</button>
</form>
<h1 id="TotalAmount"></h1>
</body>
You have a typo in your H1's ID. It should probably match the TotalAmount in your javascript.
Two things:
typo in "TotalAmout" and "TotalAmount"
function needs to be defined prior to calling it
see here: https://jsfiddle.net/zLguL6fu/:
<form>
<input type="text" id="amount" placeholder="Amount">
<button type="button" onclick="calc(); return false;">Submit</button>
</form>
<h1 id="TotalAmount"></h1>
function calc() {
var amt = document.getElementById("amount").value;
document.getElementById("TotalAmount").innerHTML = amt;
}
please use this code.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JS </title>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body>
<form>
<input type="text" id="amount" placeholder="Amount">
<button type="button" onclick="calc()">Submit</button>
</form>
<h1 id="TotalAmout"></h1>
<script>
function calc() {
var amt = $("#amount").val();
$("#TotalAmout").html(amt);
}
</script>
</body>
</html>
and you also required add jquery js in head
<form>
<input type="text" id="amount" placeholder="Amount">
<button type="button" onclick="calc();return false">Submit</button>
</form>
<h1 id="TotalAmout"></h1>
<script>
function calc() {
var amt = $("#amount").val();
$("TotalAmount").html(amt);
}
</script>
I have a calender and when i pick a date i would like from a javascript to make a check through some values that i had choose to tell me if is it true or not.
here is my code:
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<head>
<title>SOMETHING</title>
<script>
function check(){
if (document.getElementById("cinema").value == "1"){
var d = new date();
var x = document.getElementById("date");
x.innerHTML=d.getMonth();
if (x == "1"){
document.write("ok");
}
}
else {
alert('null');
}
}
</script>
</head>
<body>
<header>
<h1>SOMETHING</h1>
</header>
<br />
<div>
<form>
<fieldset>
<label for="date">CHECK DATE</label>
<input type="date" id="date" name="date" required="required"/>
<br />
<label for="time">CHECK TIME</label>
<input type="time" id="time" name="time" required="required" />
</fieldset>
</form>
</div>
<br />
<button onclick='check()'>Check</button>
</body>
</html>
You need to assign a value to the date object first, then derive the day, month year from that.
var d = new date(document.getElementById("date"));
alert(d.getMonth())
Here's something that should get you on the right track:
function check()
{
var Temp= document.getElementById("date");
var myDate = new Date(Temp.value);
document.write(myDate);
document.write("<br />");
document.write(myDate.getMonth());
}
that's it !
function check() {
var a = document.getElementById("thedate").value;
var check = "2013-01-20";
if (a == check) {
alert("YES");
} else {
alert("STOP");
}
}
<meta charset="UTF-8">
<body>
<input type="date" id="thedate">
<button onclick="check()">Try it</button>
</body>