Develop Reference

Sort function not working as expected after putting getElementById this way

I'm a beginner figuring out my own first project but I can't get info about this case.
The application is supposed to receive data about a product, it's name, price, stock, number of sales and then sort them from the most sold to the less sold.
Here's the thing, I was trying to shorten how verbose the code was by putting this chunk this other way
so I went from this
var balanceVenta = (ev) => {
ev.preventDefault();
diseños.sort((a, b) => {
return (a.amountSold < b.amountSold) ? 1 : -1
});
document.getElementById("name1").innerHTML = diseños[0].designName;
document.getElementById("stock1").innerHTML = diseños[0].currentStock;
document.getElementById("price1").innerHTML = "$" + diseños[0].priceEa;
document.getElementById("sold1").innerHTML = diseños[0].amountSold;
document.getElementById("lastProduction1").innerHTML = diseños[0].productionAmount;
document.getElementById("name2").innerHTML = diseños[1].designName;
document.getElementById("stock2").innerHTML = diseños[1].currentStock;
document.getElementById("price2").innerHTML = "$" + diseños[1].priceEa;
document.getElementById("sold2").innerHTML = diseños[1].amountSold;
document.getElementById("lastProduction2").innerHTML = diseños[1].productionAmount;
document.getElementById("name3").innerHTML = diseños[2].designName;
document.getElementById("stock3").innerHTML = diseños[2].currentStock;
document.getElementById("price3").innerHTML = "$" + diseños[2].priceEa;
document.getElementById("sold3").innerHTML = diseños[2].amountSold;
document.getElementById("lastProduction3").innerHTML = diseños[2].productionAmount;
}
to this
var index = 0;
var balanceVenta = (ev) => {
ev.preventDefault();
diseños.sort((a, b) => {
return (a.amountSold > b.amountSold) ? 1 : -1
});
index++;
var prefixName = "name";
var prefixStock = "stock";
var prefixPrice = "price";
var prefixSold = "sold";
var prefixLastProd = "lastProduction";
document.getElementById(prefixName + index).innerHTML = diseños[index - 1].designName;
document.getElementById(prefixStock + index).innerHTML = diseños[index - 1].currentStock;
document.getElementById(prefixPrice + index).innerHTML = diseños[index - 1].priceEa;
document.getElementById(prefixSold + index).innerHTML = diseños[index - 1].amountSold;
document.getElementById(prefixLastProd + index).innerHTML = diseños[index - 1].productionAmount;
}
Everything works fine except for the sort function, which was working fine in the first hardcoded version but not working at all in the second one.
Pd: "diseños" is an Array which holds an object ("diseño" with no s) inside each index through this function
let diseños = [];
const addDesign = (ev) => {
ev.preventDefault();
let diseño = {
designName: document.getElementById("textBox1").value,
currentStock: document.getElementById("textBox2").value,
productionAmount: document.getElementById("textBox3").value,
priceEa: document.getElementById("textBox4").value,
amountSold: document.getElementById("textBox5").value
}
diseños.push(diseño);
document.forms[0].reset();
Can you guys help me out figure this one out?

You were close; you just need to put the code in a loop over diseños. I also simplified the sort logic a little, assuming amountSold is a number. Swap the position of a.amountSold and b.amountSold to change ascending to descending.
var balanceVenta = (ev) => {
ev.preventDefault();
diseños.sort((a, b) => a.amountSold - b.amountSold);
var prefixName = "name";
var prefixStock = "stock";
var prefixPrice = "price";
var prefixSold = "sold";
var prefixLastProd = "lastProduction";
for (var index = 0; index < diseños.length; index++) {
var suffix = index + 1;
document.getElementById(prefixName + suffix).innerHTML = diseños[index].designName;
document.getElementById(prefixStock + suffix).innerHTML = diseños[index].currentStock;
document.getElementById(prefixPrice + suffix).innerHTML = diseños[index].priceEa;
document.getElementById(prefixSold + suffix).innerHTML = diseños[index].amountSold;
document.getElementById(prefixLastProd + suffix).innerHTML = diseños[index].productionAmount;
}
}

make an object with all the properties you need, and then run this method over an array of your object every time you want to put it in order
var balanceVenta = diseños.OrderByDescending(x =>x.amountSold).ToList()

Karatsuba Algorithm implemented in JavaScript not accurate

I am trying to implement the Karatsuba Algorithm in JavaScript. Below is my Implementation:
var bigInt = require("big-integer");
function bigKaratsuba(num1, num2) {
if (Number(num1) < 10 || Number(num2) < 10) {
return (Number(num1)*Number(num2)).toString();
}
var len1 = String(num1).length;
var len2 = String(num2).length;
var m = Math.max(len1, len2);
var m2 = Math.floor(m/2);
var high1 = String(num1).substring(0, m-m2);
var low1 = String(num1).substring(m-m2, len1);
var high2 = String(num2).substring(0, m-m2);
var low2 = String(num2).substring(m-m2, len2);
var high1 = bigInt(String(num1).substring(0, m-m2));
var low1 = bigInt(String(num1).substring(m-m2, len1));
var high2 = bigInt(String(num2).substring(0, m-m2));
var low2 = bigInt(String(num2).substring(m-m2, len2));
var low1AndHigh1 = low1.add(high1).toString();
var low2AndHigh2 = low2.add(high2).toString();
var high1 = String(high1);
var low1 = String(low1);
var high2 = String(high2);
var low2 = String(low2);
var z0 = bigKaratsuba(low1, low2);
var z1 = bigKaratsuba(low1AndHigh1, low2AndHigh2);
var z2 = bigKaratsuba(high1, high2);
var z0_int = bigInt(z0);
var z1_int = bigInt(z1);
var z2_int = bigInt(z2);
var product = z2_int.times(Math.pow(10, m2*2)).add(z1_int.minus(z2_int).minus(z0_int).times(Math.pow(10, m2))).add(z0_int);
return String(product);
}
bigKaratsuba(15, 15);
<script src="http://peterolson.github.com/BigInteger.js/BigInteger.min.js"></script>
This implementation works perfectly for small value, however while I am trying to calculate
3141592653589793238462643383279502884197169399375105820974944592 times
2718281828459045235360287471352662497757247093699959574966967627, the answer gose wrong, what I got is
8541020071716445382689180042569347598344699394502900911882868254737925119641226981222291225174629534283004908305569988292269254, which is not correct. The correct answer is 8539734222673567065463550869546574495034888535765114961879601127067743044893204848617875072216249073013374895871952806582723184 which I got it from here.
I have tried search on the stackoverflow but I haven't find any solution to my problem. There is no error or anything when I run my code. Any help or pointer will be highly appreciated. Thanks in advance for all the people who are being helpful.

With the great help of #Spektre and #greybeard, I managed to solve this problem. Below is the correct code:
var bigInt = require("big-integer");
function bigKaratsuba(num1, num2) {
if (Number(num1) < 10 || Number(num2) < 10) {
return (Number(num1)*Number(num2)).toString();
}
var len1 = String(num1).length;
var len2 = String(num2).length;
var m = Math.max(len1, len2);
var m2 = Math.floor(m/2);
var high1 = bigInt(String(num1).substring(0, len1-m2));
var low1 = bigInt(String(num1).substring(len1-m2, len1));
var high2 = bigInt(String(num2).substring(0, len2-m2));
var low2 = bigInt(String(num2).substring(len2-m2, len2));
var low1AndHigh1 = low1.add(high1).toString();
var low2AndHigh2 = low2.add(high2).toString();
var high1 = String(high1);
var low1 = String(low1);
var high2 = String(high2);
var low2 = String(low2);
var z0 = bigKaratsuba(low1, low2);
var z1 = bigKaratsuba(low1AndHigh1, low2AndHigh2);
var z2 = bigKaratsuba(high1, high2);
var z0_int = bigInt(z0);
var z1_int = bigInt(z1);
var z2_int = bigInt(z2);
var z1MinusZ2MinusZ0 = z1_int.minus(z2_int).minus(z0_int).toString();
var product = bigInt(addTrailingZero(z2, m2*2)).add(bigInt(addTrailingZero(z1MinusZ2MinusZ0, m2))).add(z0);
return String(product);
}
function addTrailingZero (numericString, numberOfZeroAdded) {
for (var i = 0; i < numberOfZeroAdded; i++) {
numericString = numericString + "0";
}
return numericString;
}
<script src="http://peterolson.github.com/BigInteger.js/BigInteger.min.js"></script>
As #Spektre pointed out, my original solution does truncate the mantissa since the biggest safe integer is 2^53-1. So one should add zero instead of doing the multiplication, besides it's also faster to add zero I believe.(Let me know if I am wrong).
Besides after trying the number suggested by #greybeard, I found that my original code snippet doesn't provide the correct solution so I changed it to
var high1 = bigInt(String(num1).substring(0, len1-m2));
var low1 = bigInt(String(num1).substring(len1-m2, len1));
var high2 = bigInt(String(num2).substring(0, len2-m2));
var low2 = bigInt(String(num2).substring(len2-m2, len2));

JS: Create Objects in loop with iterator

I want to create some objects like object_point1, object_point2, ...
with a for loop that split a string with x and y coords.
How can i use iterates to create the name of objects?
Thanks
var vMsg = req.body.myMessage;
var fields = vMsg.split(/\n/);
var myobjct = new Object();
myobject.PointCount=parseFloat(paramsCoords);
for (var ii=0; ii<fields.length; ii++)
{
var coord=fields[ii].split(/\t/);
//console.info ("X" + coord[0]);
//console.info ("Y" + coord[1]);
var object_Point[ii] = new Object();
object_Point[ii].x_m=parseFloat(coord[0]);
object_Point[ii].y_m=parseFloat(coord[1]);
myobject.Polygon_Point[ii]=object_Point[ii];
}
At the moment i use this construction:
for (var ii=0; ii
var coord=fields[ii].split(/\t/);
var objPolygon_Point = new Object()
objPolygon_Point["point" + ii] = new Object();
objPolygon_Point["point" + ii].x_m=parseFloat(coord[0]);
objPolygon_Point["point" + ii].y_m=parseFloat(coord[1]);
if (ii=='1')
{
myobject.Polygon_Point1=objPolygon_Point["point" + ii];
}
if (ii=='2')
{
myobject.Polygon_Point2=objPolygon_Point["point" + ii];
}
// ii==3, ii==4, .......
}

You can generate dynamic object names in the global scope like:
Browser:
var ii = 11
, x = 123
, y = 234;
window['Object_Point' + ii] = {
x : parseFloat(x),
y : parseFloat(y)
}
console.log(Object_Point11);
console.log(window.Object_Point11);
// Object {x: 123, y: 234}
node.js
> var i = 12;
> global['MyObj'+i] = { hello : 'world' };
> console.log(MyObj12);
> console.log(global.MyObj12);
// { hello: 'world' }
see node.js global variables?
But rather than using window or global, you might want to use your own object
> var i = 12, myObj = {};
> myObj['MyObj'+i] = { hello : 'world' };
> console.log(myObj.MyObj12);
// { hello: 'world' }

I directly used your example. I'll suggest to create middle-map object. I.e. something like holder of all the points. Using the global namespace is not a good practice.
var vMsg = req.body.myMessage;
var fields = vMsg.split(/\n/);
var myobjct = new Object();
myobject.PointCount=parseFloat(paramsCoords);
var points = {};
for (var ii=0; ii<fields.length; ii++)
{
var coord=fields[ii].split(/\t/);
//console.info ("X" + coord[0]);
//console.info ("Y" + coord[1]);
var point = points["point" + ii] = new Object();
point.x_m = parseFloat(coord[0]);
point.y_m = parseFloat(coord[1]);
myobject.Polygon_Point[ii] = point;
}

How do I create a simple search function in javascript?

I start with a short array of some schools and then I want to test if the value of an input matches one of these schools.
Here is my code thus far:
var $schools = [
'University of Tennessee-Knoxville',
'Maryville College',
'Cleveland State Community College',
'East Tennessee State University'
];
var $searchBar = $('input.searchBar');
$searchBar.keyup(function(){
var $searchValue = $searchBar.val();
for (var x = 0; x < $schools.length; x++) {
var $schoolLC = $schools[x].toLowerCase();
var $searchLC = $searchValue.toLowerCase();
var $searchingValue = new RegExp('.*' + $searchLC + '.*');
if ($schoolLC.match($searchingValue)) {
console.log($searchLC);
}
}
});
But something is obviously wrong (I believe with my RegExp), because it never console.logs the $searchLC.
Thanks so much!!

Isn't this
if ($searchLC.match($searchingValue)) {
supposed to be
if ($schoolLC.match($searchingValue)) {

I think you need to escape all RegEx special characters:
function escapeRegExp(str) {
return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
}
...
var $searchingValue = new RegExp('.*' + escapeRegExp($searchLC) + '.*');
...

Try this out: Live Demo
for (var x = 0; x < $schools.length; x++) {
var $schoolLC = $schools[x].toLowerCase();
var $searchLC = $searchValue.toLowerCase();
var $searchingValue = new RegExp('.*' + $searchLC + '.*');
if ($schoolLC.match($searchingValue)) {
alert($schoolLC);
}
}

Well, for this particular example, instead of using match you can use indexOf so that your code becomes
var $schools = [
'University of Tennessee-Knoxville',
'Maryville College',
'Cleveland State Community College',
'East Tennessee State University'
];
var $searchBar = $('input.searchBar');
$searchBar.keyup(function(){
var $searchValue = $searchBar.val();
for (var x = 0; x < $schools.length; x++) {
var $schoolLC = $schools[x].toLowerCase();
var $searchLC = $searchValue.toLowerCase();
if ($schoolLC.indexOf($searchLC) >= 0) {
console.log($searchLC);
}
}
});

Display 'Ratings' like stars as per calculated value using javascript

I have function that returns an array of numbers. Next I have to display same number of stars in the related result id. As a complete noob in JavaScript(still struggling with validations:P ) I tried many things to no avail.
Hopefully the code snippets(current state) below will clear my issue -
function display(name1, number1, sign1, name2, number2, sign2, check, y_nat, o_nat) {
document.getElementById("yname").innerHTML = name1 ;
document.getElementById("ynumber").innerHTML = number1 ;
document.getElementById("ysign").innerHTML = sign1 ;
document.getElementById("oname").innerHTML = name2 ;
document.getElementById("onumber").innerHTML = number2 ;
document.getElementById("osign").innerHTML = sign2 ;
document.getElementById('result').innerHTML = check + '%';
/* I am trying to display y_nat[0] Stars in the result id - yr by calling a show_image(id, number) function! */
x = "yr";
document.getElementById("yr").innerHTML = show_image(x ,y_nat[0]) ;
x = "yl";
document.getElementById("yl").innerHTML = y_nat[1] ;
x = "yf";
document.getElementById("yf").innerHTML = y_nat[2] ;
x = "yp";
document.getElementById("yp").innerHTML = y_nat[3] ;
x = "ys";
document.getElementById("ys").innerHTML = y_nat[4] ;
x = "yi";
document.getElementById("yi").innerHTML = y_nat[5] ;
x = "or";
document.getElementById("or").innerHTML = o_nat[0] ;
x = "ol";
document.getElementById("ol").innerHTML = o_nat[1] ;
x = "of";
document.getElementById("of").innerHTML = o_nat[2] ;
x = "op";
document.getElementById("op").innerHTML = o_nat[3] ;
x = "os";
document.getElementById("os").innerHTML = o_nat[4] ;
x = "oi";
document.getElementById("oi").innerHTML = o_nat[5] ;
}
function show_image (id,number) {
var img = document.createElement("img");
img.src = "stars2.png";
x = number;
y = id;
for (i =0; i<x; i++){
document.getElementById(y).appendChild(img);
}
}//or something of this sort
Please let me know if the issue is unclear. I am still trying to solve it and will be really obliged someone can guide in this. I am trying to learn JavaScript. I am trying to use the code from the following link.
http://www.codingforums.com/archive/index.php/t-94715.html
Thanks in advance.

1st problem I see is that you need to have the following two lines IN the loop
var img = document.createElement("img");
img.src = "stars2.png";
like this:
for (var i =0; i<x; i++){
var img = document.createElement("img");
img.src = "stars2.png";
document.getElementById(y).appendChild(img);
}
2nd problem: show_image doesn't return anything (except for undefined) but you use it to set the html-content of the element you just added the images:
document.getElementById("yr").innerHTML = show_image(x ,y_nat[0]) ;
change this line to:
show_image(x ,y_nat[0]) ;
It could be that there are more things wrong, but that's what I noticed. I made a small example for you that works (tested in IE and Chrome):
<html>
<head>
<script type="text/javascript">
function display() {
var x = "yr";
show_image(x ,3) ;
}
function show_image (id,number) {
var x = number;
var y = id;
for (var i =0; i<x; i++){
var img = document.createElement("img");
img.src = "stars2.png";
document.getElementById(y).appendChild(img);
}
}
</script>
</head>
<body onload="display();">
<div id="yr"></div>
</body>
</html>