How to change php form input into a number using JavaScript and?

Question

I'm working on creating a website that can translate a base 10 number into Binary for extra credit in a class I am taking.

My website URL is: http://loganf.tynken.com. My goal is to have the user enter a number into a form, for that number to become a string in a <h4> tag, and to be used by JavaScript to take the string, make it a number, and to then use more code to show the binary number on the screen.

I'm having trouble getting the string into a number.

The JavaScript shown here is now my final product, but a way to try to make the number appear.

    var base10, base2, v2_0, v2_1, v2_2, v2_3, v2_4, v2_5, v2_6, v2_7,
    v2_8, v2_9, v2_10, v2_11, v2_12;
    base10 = document.getElementById('base10');
    base2 = document.getElementById('base2');
    v2_0 = 1;
    v2_1 = 2;
    v2_2 = 4;
    v2_3 = 8;

    function assignvarbinaryvalue() {
    var binaryNumber = Number(base10);
    var newEl = document.createElement('h4');
    var newText = document.createTextNode(binaryNumber);
    newEl.appendChild(newText);
    var position = document.getElementById('binaryID');
    position.appendChild(newEl);
    }

<h1>Binary Translator</h1>
<p><div id="base10"><?php echo $_GET['base10']; ?></div><p id="binaryID"></p></p>

I could take exception with a lot of things. My suggestion to you however would be to simplify things a bit, for instance maybe by only go up to 2 to the 4th to begin with. Break it down and see where you're going wrong. Do you use Chrome developer tools and look in the console for any errors? — Dexygen
– Dexygen, Commented Oct 27, 2018 at 23:00
Unrelated but why do you have an h4 coming after an h1? Don't use headings because of the way they render the font, use them because you need sections of a certain ranking. — Scott Marcus
– Scott Marcus, Commented Oct 27, 2018 at 23:22
I am not using chrome. Thank you for the advice on simplifying things. — Logan Foster
– Logan Foster, Commented Oct 27, 2018 at 23:24

Ercan Peker · Accepted Answer · 2018-10-27 23:36:48Z

var base10 = document.getElementById('base10');
var base2 = document.getElementById('base2');
document.getElementById('submit').onclick=function() {

var number=parseInt(base10.value);
 base2.value=decimalToBinary(number);
  
}

function decimalToBinary(n){
    var binaryNumberStr = "";
    var binaryNumber=0;
    var step=0;

    while (Math.pow(2, step)<n)
    {
       step+=1;
    }
    for(var i=step; i>=0; i--){
    
    var c=Math.floor(n/Math.pow(2, i))
   
    n-=Math.pow(2, i)*c;
    binaryNumber+=Math.pow(2, i)*c;
    binaryNumberStr+=c;
    }
    //binaryNumberStr+=(n-binaryNumber)
    return binaryNumberStr;
}

<p>Number:</p>
		<input type="text" id="base10" name="base10" size="15" maxlength="30">
		<input type="submit" id="submit" name="submit" value="submit">
		<input type="text" id="base2" name="base2" disabled size="15" maxlength="30">

Edward Chew · Accepted Answer · 2018-10-27 23:00:38Z

0

If you want to convert string into number you can just use javascript function

parseInt()

answered Oct 27, 2018 at 23:00

Edward Chew

5234 silver badges12 bronze badges

1 Comment

Logan Foster Over a year ago

That didn't change anything either. Thank you for your help though.

cyberwombat · Accepted Answer · 2018-10-27 23:50:55Z

0

You are not grabbing the value:

var base10, base2, v2_0, v2_1, v2_2, v2_3, v2_4, v2_5, v2_6, v2_7, v2_8, v2_9, v2_10, v2_11, v2_12;
base10 = document.getElementById('base10');
base2 = document.getElementById('base2');
v2_0 = 1;
v2_1 = 2;
v2_2 = 4;
v2_3 = 8;
v2_4 = 16;
//v2_5 = 32;
//v2_6 = 64;
//v2_7 = 128;
//v2_8 = 256;
//v2_9 = 512;
//v2_10 = 1024;
//v2_11 = 2084;
//v2_12 = 4096;

function assignvarbinaryvalue() {
    var binaryNumber = parseInt(base10.innerHTML);
    var newEl = document.createElement('h4');
    var newText = document.createTextNode(binaryNumber);
    newEl.appendChild(newText);
    var position = document.getElementById('binaryID');
    position.appendChild(newEl);
}
assignvarbinaryvalue()

edited Oct 27, 2018 at 23:50

answered Oct 27, 2018 at 23:02

cyberwombat

40.5k43 gold badges189 silver badges268 bronze badges

3 Comments

Logan Foster Over a year ago

It still doesn't work. Do you think there could another problem? Thanks!

cyberwombat Over a year ago

Also I saw your demo - you're not calling your function either. Updated answer with full code.

Logan Foster Over a year ago

Oops. Sorry. It still has no effect.

Collectives™ on Stack Overflow

How to change php form input into a number using JavaScript and?

3 Answers 3

Comments

1 Comment

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related