can you please help me to correct this :
function ajout()
{
var date_init = document.getElementById("actual").value;
var date_nmbr = document.getElementById("nombre").value;
var date_resu = addDaysToDate(date_init, date_nmbr);
document.getElementById("result").value = date_resu;
return(true);
}
<input type="text" name="actual" id="actual"><br>
<input type="text" name="result" id="result"><br>
<input type="text" name="nombre" id="nombre" onChange="javascript:ajout();">
Cordialy
Related
i want to add the first and second function value in third function.and i am using this third function value to display on one textbox.
i have tried to directly add the function and get the result but it doesnt work
i tried different function like onkeydown, onkeypress etc.
//first function
function first() {
var tt = parseInt(document.getElementById("divi").value);
var pp = parseInt(document.getElementById("npt").value)
var tl = parseInt(document.getElementById("tlpw").value)
document.getElementById("ttlpw").value = tt * pp * tl;
}
//second function
function second() {
var tt = parseInt(document.getElementById("npp").value);
var pp = parseInt(document.getElementById("plpw").value)
var tl = parseInt(document.getElementById("nob").value)
document.getElementById("tplpw").value = tt * pp * tl;
}
//third function
function third() {
X = first();
Y = second();
document.getElementById("twork").value = x + y;
}
<input type="text" id="cname" name="cname" class="form-control" />
<input type="text" id="npt" name="npt" onkeyup="first()" class="form-control" />
<input type="text" id="npp" name="npp" onkeyup="second()" class="form-control" />
<input type="text" id="tlpw" name="tlpw" onkeyup="first()" class="form-control" />
<input type="text" id="plpw" name="plpw" onkeyup="second()" class="form-control" />
<input type="text" id="divi" name="divi" onkeyup="first()" class="form-control" />
<input type="text" id="nseb" name="nseb" class="form-control" />
<input type="text" id="nob" name="nob" onkeyup="second()" class="form-control" />
<input type="text" id="ttlpw" name="ttlpw" " onkeyup="third() "
class="form-control " />
<input type="text " id="tplpw " name="tplpw "" onkeyup="third()" class="form-control" />
<input type="text" id="twork" name="twork" class="form-control" />
This code does not give the addition of the value. I am expecting addition of x+y.
There are several issues:
Your functions first() and second() print the value, but they don't actually return those values.
On top of that, you have superfluous/random " characters and space characters which cause your inputs to not behave as expected.
Finally, you assign X and Y and then try to add x and y, but Javascript is case sensitive so the addition tries to add two undefined values.
In the below snippet (click Show to see it) I fixed all of that, and I added placeholders so at least we have some indication of what we are typing into.
As a last note, it looks like cname and nseb are not being used anywhere, also they do not have a keyup event like most of the others.
It still looks a bit messy to me; I hope it makes more sense to you.
// Give all inputs a placeholder
var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
inputs[i].placeholder = inputs[i].id;
}
function first() {
var tt = parseInt(document.getElementById("divi").value);
var pp = parseInt(document.getElementById("npt").value);
var tl = parseInt(document.getElementById("tlpw").value);
var value = tt * pp * tl;
document.getElementById("ttlpw").value = value;
return value;
}
function second() {
var tt = parseInt(document.getElementById("npp").value);
var pp = parseInt(document.getElementById("plpw").value)
var tl = parseInt(document.getElementById("nob").value)
var value = tt * pp * tl;
document.getElementById("tplpw").value = value;
return value;
}
function third() {
var x = first();
var y = second();
document.getElementById("twork").value = x + y;
}
<input type="text" id="cname" name="cname" class="form-control" />
<input type="text" id="npt" name="npt" onkeyup="first()" class="form-control" />
<input type="text" id="npp" name="npp" onkeyup="second()" class="form-control" />
<input type="text" id="tlpw" name="tlpw" onkeyup="first()" class="form-control" />
<input type="text" id="plpw" name="plpw" onkeyup="second()" class="form-control" />
<input type="text" id="divi" name="divi" onkeyup="first()" class="form-control" />
<input type="text" id="nseb" name="nseb" class="form-control" />
<input type="text" id="nob" name="nob" onkeyup="second()" class="form-control" />
<input type="text" id="ttlpw" name="ttlpw" onkeyup="third()" class="form-control " />
<input type="text" id="tplpw" name="tplpw" onkeyup="third()" class="form-control" />
<input type="text" id="twork" name="twork" class="form-control" />
Update:
If I understand your need correctly, instead of doing onkeyup="first()" and onkeyup="second()", try changing them all to use onkeyup="third()". third() will call both the other functions, each of which will show their outcome, and then third() will show the sum of both.
Here is a new snippet that will do that. I also removed cname and nseb, and rearranged the order of inputs so they actually make sense.
// Give all inputs a placeholder
var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
inputs[i].placeholder = inputs[i].id;
}
function first() {
var tt = parseInt(document.getElementById("divi").value);
var pp = parseInt(document.getElementById("npt").value);
var tl = parseInt(document.getElementById("tlpw").value);
var value = tt * pp * tl;
document.getElementById("ttlpw").value = value;
return value;
}
function second() {
var tt = parseInt(document.getElementById("npp").value);
var pp = parseInt(document.getElementById("plpw").value)
var tl = parseInt(document.getElementById("nob").value)
var value = tt * pp * tl;
document.getElementById("tplpw").value = value;
return value;
}
function third() {
var x = first();
var y = second();
document.getElementById("twork").value = x + y;
}
div { width: 240px; text-align: right; }
input { width: 40px; }
<div>
<input type="text" id="npt" name="npt" onkeyup="third()" /> *
<input type="text" id="divi" name="divi" onkeyup="third()" /> *
<input type="text" id="tlpw" name="tlpw" onkeyup="third()" /> =
<input type="text" id="ttlpw" name="ttlpw" onkeyup="third()" /><br />
<input type="text" id="npp" name="npp" onkeyup="third()" /> *
<input type="text" id="nob" name="nob" onkeyup="third()" /> *
<input type="text" id="plpw" name="plpw" onkeyup="third()" /> =
<input type="text" id="tplpw" name="tplpw" onkeyup="third()" /><br />
<input type="text" id="twork" name="twork" /><br />
</div>
You need that functions first and second to return the value:
function first () {
...
return tt * pp * tl
}
I try to pass the textbox value from a page to another page.
I try to pass that text box but failed I use javascript for doing that.
I have to try to change my code properly but still not work
the error is the data that passing to the text box is multiple.
this is my code
1st-page code
function myFunction() {
var inputTest = document.getElementById('tanggal2').value;
var inputTest1 = document.getElementById('dt').value;
localStorage.setItem( 'objectToPass', inputTest );
localStorage.setItem( 'objectToPass1', inputTest1 );
if (inputTest=="") {
window.open('report_pengambilan_singgle.html','','height=650,width=1200');
}
else {
window.open('report_pengambilan_singgle1.html','','height=650,width=1200');
}
}
<input type="text" id="dt" type="text" name="dt" maxlength="1" size="23" readonly="readonly" style="visibility:hidden" />
<input type="text" id="tanggal2" type="text" name="tanggal2" maxlength="1" size="23" readonly="readonly" style="visibility:hidden" />
<label onclick="myFunction();" >a</label>
and this my 2nd-page code
var inputTest = localStorage.getItem('objectToPass');
var inputTest1 = localStorage.getItem('objectToPass1');
var displayData = inputTest;
var displayData = inputTest1;
document.getElementById("datepicker1").value=inputTest;
document.getElementById("datepicker2").value=inputTest;
document.getElementById("datepicker3").value=inputTest;
localStorage.removeItem( 'objectToPass1' ); // Clear the localStorage
localStorage.removeItem( 'objectToPass' ); // Clear the localStorage
Try this way...
test.html
<script>function myFunction() {
var inputTest = document.getElementById('tanggal2').value;
var inputTest1 = document.getElementById('dt').value;
if (inputTest=="") {
window.open('report_pengambilan_singgle.html','','height=650,width=1200');
}
else {
window.open('test1.html?name=' + inputTest1,'','height=650,width=1200');
}
}
</script>
<input type="text" id="dt" type="text" name="dt" size="23" />
<input type="text" id="tanggal2" type="text" name="tanggal2" size="23" />
<button onclick="myFunction();" >a</button>
test1.html
<script>window.onload = function () {
var url = document.location.href,
params = url.split('?')[1].split('&'),
data = {}, tmp;
for (var i = 0, l = params.length; i < l; i++) {
tmp = params[i].split('=');
data[tmp[0]] = tmp[1];
}
document.getElementById("datepicker1").value = data.name;
}
</script>
<input type="text" id="datepicker1" type="text" name="datepicker1" size="23" />
i Hope working for u...
you have textbox which have hidden and not any value define
so first set any value in textbox and create textbox in another page before your <script> start
like
<input type="text" id="datepicker1" value="">
<input type="text" id="datepicker2" value="">
<input type="text" id="datepicker3" value="">
I have 3 textboxs.Their names and ids are different.I can merge their values with their names or ids but I need to merge their values with type. How can I do it.
<input type="text" id="txt1" name="textbox1">
<input type="text" id="txt2" name="textbox2">
<input type="text" id="txt3" name="textbox3">
You can get all the textbox elements by their type using document.querySelectorAll("input[type=text]").
If by merge you mean concatenating the values.
var textBoxes= document.querySelectorAll("input[type=text]");
var mergedValue;
for(var i=0;i<textBoxes.length;i++)
{
mergedValue+=textBoxes[i].value;
}
var dataVal=document.querySelectorAll('[type=text]');
var myVal="";
dataVal.forEach(function(entry) {
myVal+=entry.value;
});
console.log(myVal);
<input type="text" id="txt1" name="textbox1" value="2">
<input type="text" id="txt2" name="textbox2" value="2">
<input type="text" id="txt3" name="textbox3" value="2">
Here is another possible solution.
function mergeData() {
var textboxes = document.getElementsByTagName("input");
var mergedText = "";
for (var i = 0; i < textboxes.length; i++) {
if (textboxes[i].type === "text" ) {
mergedText = mergedText + textboxes[i].value;
}
}
document.getElementById("merged").innerHTML = mergedText;
}
<input type="text" id="txt1" name="textbox1">
<input type="text" id="txt2" name="textbox2">
<input type="text" id="txt3" name="textbox3">
<button onclick="mergeData()">Merge</button>
<div id="merged"></div>
i want to show the money that customer must pay and my inputs are like this :
<input type="text" class="form-control" placeholder="cost " id="txt" name="credit">
<input type="text" class="form-control" placeholder="quantity" id="txt" name="limit">
when the input text is changing i want to show the total cost (quantity*cost) in a <p> tag Dynamicly how can it be with javascript?
You can try this:
<input type="text" class="form-control" placeholder="cost " id="credit" name="credit" onchange="calculate()">
<input type="text" class="form-control" placeholder="quantity" id="limit" name="limit" onchange="calculate()">
<p id="result"></p>
And javascript part:
function calculate() {
var cost = Number(document.getElementById("credit"));
var limit = Number(document.getElementById("limit"));
document.getElementById("result").innerHTML= cost*limit;
}
You must ensure you entered numbers in inputs.
All of the above will generate errors if both the boxes are blank . Try this code , its tested and running .
<script>
function calc()
{
var credit = document.getElementById("credit").value;
var limit = document.getElementById("limit").value;
if(credit == '' && limit != '')
{
document.getElementById("cost").innerHTML = parseInt(limit);
}
else if(limit == '' && credit != '')
{
document.getElementById("cost").innerHTML = parseInt(credit);
}
else if(limit!= '' && credit!= '')
{
document.getElementById("cost").innerHTML = parseInt(limit) * parseInt(credit);
}
else
{
document.getElementById("cost").innerHTML = '';
}
}
</script>
</head>
<input type="number" value="0" min="0" class="form-control" placeholder="cost" id="credit" name="credit" onkeyup="calc();">
<input type="number" value="0" min="0" class="form-control" placeholder="quantity" id="limit" name="limit" onkeyup="calc();">
<p id="cost"></p>
Hope this will be useful
// get cost field
var _cost = document.getElementById("cost");
_cost.addEventListener('keyup',function(event){
updateCost()
})
// get quantity field
var _quantity = document.getElementById("quantity");
_quantity.addEventListener('keyup',function(event){
updateCost()
})
function updateCost(){
var _getCost = document.getElementById("cost").value;
var _getQuantity = document.getElementById("quantity").value;
var _total = _getCost*_getQuantity;
console.log(_total);
document.getElementById("updateValue").textContent = ""; // Erase previous value
document.getElementById("updateValue").textContent = _total // update with new value
}
jsfiddle
In case you consider using JQuery I've made this fiddle.
See if it works for you.
https://fiddle.jshell.net/9cpbdegt/
$(document).ready(function() {
$('#credit').keyup(function() {
recalc();
});
$('#limit').keyup(function() {
recalc();
});
function recalc() {
var credit = $("#credit").val();
var limit = $("#limit").val();
var result = credit * limit;
$("#result").text(result);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="form-control" placeholder="cost " id="credit" name="credit" value="0">x
<input type="text" class="form-control" placeholder="quantity" id="limit" name="limit" value="0">
<p id="result">0</p>
Try this:
<script >
function myFunction() {
document.getElementById('totalcost').innerHTML = document.getElementById('txt').value * document.getElementById('txt2').value;}
</script>
Also, change your HTML to this:
<input type="text" onkeypress="myFunction()" onkeyup="myFunction()" onclick="myFunction()" onmousemove="myFunction()" class="form-control" placeholder="cost " id="txt" name="credit">
<input type="text" onkeypress="myFunction()" onkeyup="myFunction()" onclick="myFunction()" onmousemove="myFunction()" class="form-control" placeholder="quantity" id="txt2" name="limit">
Enter cost and quantity.
Note the change with the second input: id='txt' was changed to id='txt2'. This is because no 2 elements can have the same id.
Note: Untested.
I have three input box.If I type 'a' in first and 'b' in second,i should get 'a&b' in third input box. Help!!
HTML:
<input type="text" id="fname" onkeyup="myFunction()">
<input type="text" id="lname" onkeyup="myFunction()">
<input type="text" id="gname" >
SCRIPT:
<script>
function myFunction() {
var v = document.getElementById("fname").value;
var c = document.getElementById("lname").value;
document.getElementById("gname").innerHTML = v.'&'.c;
}
</script>
Update: Also suggest me, I have to display only var v or r.But mine doesn't works.Please help
HTML:
<input type="text" id="fname" onkeyup="myFunction()">
<input type="text" id="rname" onkeyup="myFunction()">
<input type="text" id="lname" onkeyup="myFunction()">
<input type="text" id="gname" >
SCRIPT:
<script>
function myFunction() {
var v = document.getElementById("fname").value;
var r = document.getElementById("rname").value;
var c = document.getElementById("lname").value;
document.getElementById("gname").innerHTML = (v||r)+'&'+c;
}
</script>
Concatenation in Javascript is done using the + operator.
See this documentation from MDN and search for concatenation.
Replace
document.getElementById("gname").innerHTML = v.'&'.c;
with
document.getElementById("gname").innerHTML = v+'&'+c;
Also, use .value to set value of textbox instead of .innerHTML.
EDIT: Code updated with logical or operator as requested by OP.
Working Code Snippet:
function myFunction() {
var v = parseInt(document.getElementById("fname").value);
var c = parseInt(document.getElementById("lname").value);
document.getElementById("gname").value = v||c;
}
<input type="text" id="fname" onkeyup="myFunction()">
<input type="text" id="lname" onkeyup="myFunction()">
<input type="text" id="gname" >
Enter value<input type="text" id="textbox1" onkeyup="document.getElementById('textbox2').value = this.value" />
<input type="text" id="textbox2" />