Undefined global variables in function - javascript

I'm trying to use javascript to perform calculations on a button click because I don't want the page to refresh when this button is clicked. I wrote a script below:
var name = document.getElementById('recipeName').value;
var lvl = document.getElementById('recipeLvl').value;
var e = document.getElementById("qualitySelect");
var quality = e.options[e.selectedIndex].value;
e = document.getElementById("classSelect");
var craft = e.options[e.selectedIndex].value;
var mat1 = document.getElementById('material1Name').value;
var mat1Qty = document.getElementById('material1Qty').value;
var mat1NQ = document.getElementById('material1NQ').value;
var mat1NQprice = document.getElementById('material1NQprice').value;
var mat1HQ = document.getElementById('material1HQ').value;
var mat1HQprice = document.getElementById('material1HQprice').value;
var mat2 = document.getElementById('material2Name').value;
var mat2Qty = document.getElementById('material2Qty').value;
var mat2NQ = document.getElementById('material2NQ').value;
var mat2NQprice = document.getElementById('material2NQprice').value;
var mat2HQ = document.getElementById('material2HQ').value;
var mat2HQprice = document.getElementById('material2HQprice').value;
var mat3 = document.getElementById('material3Name').value;
var mat3Qty = document.getElementById('material3Qty').value;
var mat3NQ = document.getElementById('material3NQ').value;
var mat3NQprice = document.getElementById('material3NQprice').value;
var mat3HQ = document.getElementById('material3HQ').value;
var mat3HQprice = document.getElementById('material3HQprice').value;
var mat4 = document.getElementById('material4Name').value;
var mat4Qty = document.getElementById('material4Qty').value;
var mat4NQ = document.getElementById('material4NQ').value;
var mat4NQprice = document.getElementById('material4NQprice').value;
var mat4HQ = document.getElementById('material4HQ').value;
var mat4HQprice = document.getElementById('material4HQprice').value;
var mat5 = document.getElementById('material5Name').value;
var mat5Qty = document.getElementById('material5Qty').value;
var mat5NQ = document.getElementById('material5NQ').value;
var mat5NQprice = document.getElementById('material5NQprice').value;
var mat5HQ = document.getElementById('material5HQ').value;
var mat5HQprice = document.getElementById('material5HQprice').value;
var mat6 = document.getElementById('material6Name').value;
var mat6Qty = document.getElementById('material6Qty').value;
var mat6NQ = document.getElementById('material6NQ').value;
var mat6NQprice = document.getElementById('material6NQprice').value;
var mat6HQ = document.getElementById('material6HQ').value;
var mat6HQprice = document.getElementById('material6HQprice').value;
e = document.getElementById("catalyst1");
var crystal1 = e.options[e.selectedIndex].value;
e = document.getElementById('element1');
var element1 = e.options[e.selectedIndex].value;
var crystal1Qty = document.getElementById('crystalQty1').value;
var crystal1Price = document.getElementById('crystalPrice1').value;
e = document.getElementById("catalyst2");
var crystal2 = e.options[e.selectedIndex].value;
e = document.getElementById('element2');
var element2 = e.options[e.selectedIndex].value;
var crystal2Qty = document.getElementById('crystalQty2').value;
var crystal2Price = document.getElementById('crystalPrice2').value;
var notes = document.getElementById('notes').value;
var marketPrice = document.getElementById('marketPrice').value;
function calculate() {
var mat1Cost = (mat1NQ * mat1NQprice) + (mat1HQ * mat1HQprice);
var mat2Cost = (mat2NQ * mat2NQprice) + (mat2HQ * mat2HQprice);
var mat3Cost = (mat3NQ * mat3NQprice) + (mat3HQ * mat3HQprice);
var mat4Cost = (mat4NQ * mat4NQprice) + (mat4HQ * mat4HQprice);
var mat5Cost = (mat5NQ * mat5NQprice) + (mat5HQ * mat5HQprice);
var mat6Cost = (mat6NQ * mat6NQprice) + (mat6HQ * mat6HQprice);
var crystal1Cost = (crystal1Qty * crystal1Price);
var crystal2Cost = (crystal2Qty * crystal2Price);
var total = mat1Cost +
mat1Cost +
mat1Cost +
mat1Cost +
mat1Cost +
mat1Cost +
crystal1Cost +
crystal2Cost;
document.getElementById('totalCost').value = mat1Cost;
return false;
}
I'm new to javascript, and thought declaring the variables right after would make them accessible to any function that I would need to use them in, but they are undefined in the calculate function. If I declare them in calculate() it's fine, so is this a scope problem?
Thanks in advance for any help!

The problem is you're grabbing the elements values before you've assigned anything to them. You're getting a copy, not a reference.
var initialValue = document.getElementById('text').value;
function clickHandler() {
// Notice how I have to grab the value again when I want an updated value
var updatedValue = document.getElementById('text').value;
console.log('Initial:', initialValue);
console.log('Updated:', updatedValue);
}
<input id="text" />
<button onclick="clickHandler()">Click Me</button>

#epascarello has commented the real answer, there is no much science there, this is javascript, therefore is a script language, so as soon as this file is loaded, those variables are filled with the initial data of each field, so, if you want to get the value at the point you press calculate(), you should get your variables.

Related

How to use an int variable more than once (HTML)?

My program is meant to calculate amount of credits a student has and if they are "University Entrance" (UE) credits.
Once the student enters amount of credits for five subjects I want to calculate the total amount of credits and also the total amount of UE credits, but can't use the assigned amount per standard more than once.
<script type="text/javascript">
function dog(curetn){
var txtJscredit = document.getElementById("txtcredit");
var txtJscredit2 = document.getElementById("txtcredit2");
var txtJscredit3 = document.getElementById("txtcredit3");
var txtJscredit4 = document.getElementById("txtcredit4");
var txtJscredit5 = document.getElementById("txtcredit5");
var txtJscredit9 = document.getElementById("txtcredit9");
if (curetn.includes("credit5")){
txtcredit9.value = ((parseInt(txtJscredit.value)) + (parseInt(txtJscredit2.value)) + (parseInt(txtJscredit3.value))+ (parseInt(txtJscredit4.value))+ (parseInt(txtJscredit5.value)));
}
function myfuntionUE() {
var checkBox = document.getElementById("Uni");
var txtJscreditUE = document.getElementById("txtcredit");
txtcreditUE.value = ((parseInt(txtJscreditUE.value))
}
}
</script>
Try this.
<script type="text/javascript">
var txtJscredit;
var txtJscredit2;
var txtJscredit3;
var txtJscredit4;
var txtJscredit5;
var txtJscredit9;
function dog(curetn){
txtJscredit = parseInt(document.getElementById("txtcredit"));
txtJscredit2 = parseInt(document.getElementById("txtcredit2"));
txtJscredit3 = parseInt(document.getElementById("txtcredit3"));
txtJscredit4 = parseInt(document.getElementById("txtcredit4"));
txtJscredit5 = parseInt(document.getElementById("txtcredit5"));
txtJscredit9 = parseInt(document.getElementById("txtcredit9"));
}
<script type="text/javascript">
var txtJscredit = parseInt(document.getElementById("txtcredit"));
var txtJscredit2 = parseInt(document.getElementById("txtcredit2"));
var txtJscredit3 = parseInt(document.getElementById("txtcredit3"));
var txtJscredit4 = parseInt(document.getElementById("txtcredit4"));
var txtJscredit5 = parseInt(document.getElementById("txtcredit5"));
var txtJscredit9 = parseInt(document.getElementById("txtcredit9"));
function dog(curetn){
if (curetn.includes("credit5")){
txtcredit9.value = (txtJscredit.value) + (parseInt(txtJscredit2.value)) + (parseInt(txtJscredit3.value))+ (parseInt(txtJscredit4.value))+ (parseInt(txtJscredit5.value)));
}
You can use some like that:
var txtJscredit = parseInt(document.getElementById("txtcredit"));
This variable with assume the value of an int.
But take care with this conditions:
https://dorey.github.io/JavaScript-Equality-Table/

Dynamic parent/child in a table

How can I make parent("td").prevAll("td") to be dynamic?
$("body").on("click",".edit-item",function(){
var id = $(this).parent("td").data('id');
var name = $(this).parent("td").prevAll("td").eq(9).text();
var email = $(this).parent("td").prevAll("td").eq(8).text();
var phone = $(this).parent("td").prevAll("td").eq(7).text();
var CNP = $(this).parent("td").prevAll("td").eq(6).text();
var birthday = $(this).parent("td").prevAll("td").eq(5).text();
var date = $(this).parent("td").prevAll("td").eq(4).text();
var speciality_id = $(this).parent("td").prevAll("td").eq(3).text();
var doctor_id = $(this).parent("td").prevAll("td").eq(2).text();
var location_id = $(this).parent("td").prevAll("td").eq(1).text();
var message = $(this).parent("td").prevAll("td").eq(0).text();
$("#edit-item").find("input[name='name']").val(name);
$("#edit-item").find("input[name='email']").val(email);
$("#edit-item").find("input[name='phone']").val(phone);
$("#edit-item").find("input[name='CNP']").val(CNP);
$("#edit-item").find("input[name='birthday']").val(birthday);
$("#edit-item").find("input[name='date']").val(date);
$("#edit-item").find("select[name='speciality_id']").val(speciality_id);
$("#edit-item").find("select[name='doctor_id']").val(doctor_id);
$("#edit-item").find("select[name='location_id']").val(location_id);
$("#edit-item").find("textarea[name='message']").val(message);
$("#edit-item").find("form").attr("action",url + '/' + id);
});

I keep gettin totalfirst.tofixed(2) is not a function and it directs me to this line [duplicate]

This question already has answers here:
Why does Firebug say toFixed() is not a function?
(7 answers)
Closed 5 years ago.
...var totalFirst = bookFirst+exFirst; totalFirst = totalFirst.toFixed(2);
what is wrong with the code?
{
var layStakeWin = (backStake*(backOdds-1.0)*(1.0-backCom)+backStake)/(layOdds-layCom);
layStakeWin = layStakeWin.toFixed(2);
var layStakePlace = (backStake*(((backOdds-1.0)/placeTerms)+1)*(1.0-backCom))/(layOdds-layCom);
layStakePlace = layStakePlace.toFixed(2);
var bookFirst = (backStake*(backOdds-1.0)*(1.0-backCom))+(backStake*(backOdds-1.0)/placeTerms*(1.0-backCom));
bookFirst = bookFirst.toFixed(2);
var exFirst = 0-(layStakeWin*(layOdds-1.0))-(layStakePlace*((layOdds/placeTerms)-1.0));
exFirst = exFirst.toFixed(2);
var totalFirst = bookFirst+exFirst;
totalFirst = totalFirst.toFixed(2);
var bookStandard = 0-backStake+(backStake*(backOdds-1.0)/placeTerms*(1-backCom));
bookStandard = bookStandard.toFixed(2);
var exStandard = (layStakeWin*(1-layCom))-(layStakePlace*(layOdds-1.0));
exStandard = exStandard.toFixed(2);
var totalStandard = bookStandard+exStandard;
totalStandard = totalStandard.toFixed(2);
var bookExtra = 0-backStake+(backStake*(backOdds-1.0)/placeTerms*(1.0-backCom));
bookExtra = bookExtra.toFixed(2);
var exExtra = (layStakeWin*(1-layCom))+(layStakePlace*(layOdds-1.0));
exExtra = exExtra.toFixed(2);
var totalExtra = bookExtra+exExtra;
totalExtra = totalExtra.toFixed(2);
var bookNo = 0-backStake-backStake;
bookNo = bookNo.toFixed(2);
var exNo = (layStake*(1.0-layCom))+(layStakePlace*(layOdds-1.0));
exNo = exNo.toFixed(2);
var totalNo = bookNo+exNo;
totalNo = totalNo.toFixed(2);
}
The problem is that toFixed() returns a string.
To fix this problem, everywhere you use toFixed(), wrap it inside the parseFloat() function.
For example,
layStakeWin = parseFloat(layStakeWin).toFixed(2);
Please make this change everywhere you use toFixed().
{
var layStakeWin = (backStake*(backOdds-1.0)*(1.0-backCom)+backStake)/(layOdds-layCom);
layStakeWin = parseFloat(layStakeWin).toFixed(2);
var layStakePlace = (backStake*(((backOdds-1.0)/placeTerms)+1)*(1.0-backCom))/(layOdds-layCom);
layStakePlace = parseFloat(layStakePlace).toFixed(2);
var bookFirst = (backStake*(backOdds-1.0)*(1.0-backCom))+(backStake*(backOdds-1.0)/placeTerms*(1.0-backCom));
bookFirst = parseFloat(bookFirst).toFixed(2);
var exFirst = 0-(layStakeWin*(layOdds-1.0))-(layStakePlace*((layOdds/placeTerms)-1.0));
exFirst = parseFloat(exFirst).toFixed(2);
var totalFirst = bookFirst+exFirst;
totalFirst = totalFirst.toFixed(2);
var bookStandard = 0-backStake+(backStake*(backOdds-1.0)/placeTerms*(1-backCom));
bookStandard = parseFloat(bookStandard).toFixed(2);
var exStandard = (layStakeWin*(1-layCom))-(layStakePlace*(layOdds-1.0));
exStandard = parseFloat(exStandard).toFixed(2);
var totalStandard = bookStandard+exStandard;
totalStandard = totalStandard.toFixed(2);
var bookExtra = 0-backStake+(backStake*(backOdds-1.0)/placeTerms*(1.0-backCom));
bookExtra = parseFloat(bookExtra).toFixed(2);

Reading and writing values from form doesn't work

I have a code sample where I want to read some data from input fields and write that data to a different div.
In first section the code works properly, but in 2nd section the value is not shown. I used the alert function to check that wether value is received or not. The value is received but not shown.
What is wrong with my code? (below)
function preview() {
$(".preview_block").fadeIn(1000);
$("body").css("overflow","hidden");
$(".preview_block").css("overflow","auto");
/*======================Value fetch for personal details=======================*/
var fastname1 = document.forms["myform"]["fastname"].value;
if(fastname1==""){fastname1="---null---"}
var lastname1 = document.forms["myform"]["lastname"].value;
if(lastname1==""){lastname1="---null---"}
var sex1 = document.forms["myform"]["radio"].value;
if(sex1==""){sex1="---null---"}
var clgid1 = document.forms["myform"]["clgid"].value;
if(clgid1==""){clgid1="---null---"}
var dob1 = document.forms["myform"]["dob"].value;
if(dob1==""){dob1="---null---"}
var fname1 = document.forms["myform"]["fname"].value;
if(fname1==""){fname1="---null---"}
var mname1 = document.forms["myform"]["mname"].value;
if(mname1==""){mname1="---null---"}
var gname1 = document.forms["myform"]["gname"].value;
if(gname1==""){gname1="---null---"}
var mobno1 = document.forms["myform"]["mobno"].value;
if(mobno1==""){mobno1="---null---"}
var pmobno1 = document.forms["myform"]["pmobno"].value;
if(pmobno1==""){pmobno1="---null---"}
var mail1 = document.forms["myform"]["mail"].value;
if(mail1==""){mail1="---null---"}
var addr11 = document.forms["myform"]["addr1"].value;
if(addr11==""){addr11="---null---"}
var addr21 = document.forms["myform"]["addr2"].value;
if(addr21==""){addr21="---null---"}
var city1 = document.forms["myform"]["city"].value;
if(city1==""){city1="---null---"}
var state1 = document.forms["myform"]["state"].value;
if(state1==""){state1="---null---"}
var pcode1 = document.forms["myform"]["pcode"].value;
if(pcode1==""){pcode1="---null---"}
var ps1 = document.forms["myform"]["ps"].value;
if(ps1==""){ps1="---null---"}
var po1 = document.forms["myform"]["po"].value;
if(po1==""){po1="---null---"}
var country1 = document.forms["myform"]["country"].value;
if(country1==""){country1="---null---"}
document.getElementById("p1").innerHTML = fastname1;
document.getElementById("p2").innerHTML = lastname1;
document.getElementById("p3").innerHTML = sex1;
document.getElementById("p4").innerHTML = clgid1;
document.getElementById("p5").innerHTML = dob1;
document.getElementById("p6").innerHTML = fname1;
document.getElementById("p7").innerHTML = mname1;
document.getElementById("p8").innerHTML = gname1;
document.getElementById("p9").innerHTML = mobno1;
document.getElementById("p10").innerHTML = pmobno1;
document.getElementById("p11").innerHTML = mail1;
document.getElementById("p12").innerHTML = addr11;
document.getElementById("p13").innerHTML = addr21;
document.getElementById("p14").innerHTML = city1;
document.getElementById("p15").innerHTML = state1;
document.getElementById("p16").innerHTML = pcode1;
document.getElementById("p17").innerHTML = ps1;
document.getElementById("p18").innerHTML = po1;
document.getElementById("p19").innerHTML = country1;
/*======================Value fetch for XII standered details=======================*/
var qualification1 = $('#qualification option:selected').html();
if(qualification1==""){qualification1="---null---"}
var q1_board1 = $('#q1_board option:selected').html();
if(q1_board1==""){q1_board1="---null---"}
var clg_nm1 = document.forms["myform"]["clg_nm"].value;
if(session1==""){session1="---null---"}
var regno1 = document.forms["myform"]["regno"].value;
if(regno1==""){regno1="---null---"}
var yr_reg1 = document.forms["myform"]["yr_reg"].value;
if(yr_reg1==""){yr_reg1="---null---"}
var rollno1 = document.forms["myform"]["rollno"].value;
if(rollno1==""){rollno1="---null---"}
document.getElementById("q1").innerHTML = qualification1;
document.getElementById("q2").innerHTML = q1_board1;
document.getElementById("q3").innerHTML = clg_nm1;
document.getElementById("q4").innerHTML = regno1;
document.getElementById("q5").innerHTML = yr_reg1;
document.getElementById("q6").innerHTML = rollno1;
}

How to get concotenate value with string to get the value from variable

Please check the script below.
Dynamic form, so the script also dynamic, I have to calculate when the form data changes. during this i am getting some problem.
am getting the value from the variable Final_price1, Final_price2 .....,Final_price7, Final_price8 and then am calculating the total of those.
During this calculation, am concatenating the following concat("Final_price",i); to get the values of the above. This concatenated correctly, but the above variables values are not coming. I dont know why the values are not getting there. So check the script and update me.
function assign_body()
{
var a_7= document.getElementById("option[280]").value;
var spl_7 = a_7.split("_");
//alert(spl);
var cr_7 = spl_7[1];
var operator3_7 = cr_7.split("[");
var symbol7 = operator3_7[0];
var dtt_7 = operator3_7[1];
var myarr_7 = dtt_7.split("$");
var symbol_st_7 = myarr_7[1];
//alert(symbol_st);
//alert(symbol_s);
//var symbol_a = symbol_s.split("(");
//var symbol = symbol_a[1];
//alert(symbol);
var split_value_7 = myarr_7[1];
//alert(split_value);
var final_value_7 =symbol_st_7.split(".");
var Final_price7 =final_value_7[0];
var a_8= document.getElementById("option[281]").value;
var spl_8 = a_8.split("_");
//alert(spl);
var cr_8 = spl_8[1];
var operator3_8 = cr_8.split("[");
var symbol8 = operator3_8[0];
var dtt_8 = operator3_8[1];
var myarr_8 = dtt_8.split("$");
var symbol_st_8 = myarr_8[1];
//alert(symbol_st);
//alert(symbol_s);
//var symbol_a = symbol_s.split("(");
//var symbol = symbol_a[1];
//alert(symbol);
var split_value_8 = myarr_8[1];
//alert(split_value);
var final_value_8 =symbol_st_8.split(".");
var Final_price8 =final_value_8[0];
var j=8;
var total_amount=0;
for(var i=1; i<=j; i++)
{
final_prices=concat("Final_price",i);
alert(final_prices);
symbol_prices=concat("symbol",i);
alert(symbol_prices);
if(isNumber(final_prices)){
alert("number");
/*if(symbol_prices =='+') {
alert("plus");
var total_amount+=parseInt(original_prices)+parseInt(final_prices);
calculated_price_element.innerHTML=total_amount;
alert(total_amount);
} else if(symbol_prices =='-') {
alert("minus");
var total_amount+=parseInt(original_prices)-parseInt(final_prices);
calculated_price_element.innerHTML=total_amount;
alert(total_amount);
}*/
//alert('test');
}
}
}

Categories