Isssue With my js, css, html program

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • Isssue With my js, css, html program

    hi i am trying to avoide using the toString function and instead using arrays for denary to binary, but my program doesn't work. i know it has to do with syntax errors but could someone show me them? thank you!
    <!DOCTYPE html> <html> <body> <title> Denary to Binary </title> <header class="Header"> <div class="border"> <div class="space"> <h1> Denary to Binary Converter </h1> </div> </div> </header> <div class ="divider"> <p class ="body"> please insert a denary number below 255 (8bit) </p> </div> <form id = "myform"> <input id="denary" type="text" placeholder="input number here"> <button type="submit" class="btn">enter</button> </form> <form id ="myText"> <input id="binary" class="btn" type="text" placeholder="answer"> </form> <style> html, body { font-family: 'Arial Black", Gadget, sans-serif'; h1 { font-size: 50px; border-bottom: 2px solid green; padding-left: 20px } .btn { paddding: 13px 15px; border: none; background-color: #D3D3D3; } </style> <script> function DeToBi() { var bi = [] var De = document.getElementById("denary").value; if (De > 255) { document.getElementById("myText").value = "your number is bigger than 255"; } else if (Dee - 128 >= 0) { De = De - 128; bi.push("1"); } else { De = De - 0; bi.push("0") } if (De - 64 >= 0) { De = De - 64 ; bi.push("1"); } else { De = De - 60; bi.push("0"); } if (De - 32 >= 0) { De = De - 32; bi.push("1"); } else { De = De - 0; bi.push("0"); } if (De - 16 >= 0) { De = De - 16; bi.push("1"); } else { De = De - 0; bi.push("0"); } if (De - 8 >= 0) { De = De - 8; bi.push("1"); } else { De = De - 0; bi.push("0"); } if (De - 4 >= 0) { De = De - 4; bi.push("1"); } else { De = De - 0; bi.push("0"); } if (De - 2 >= 0) { De = De - 2; bi.push("1"); } else { De = De - 0; bi.push("0"); } if (De - 1 >=0) { De = De - 1; bi.push("1"); } else { De = De - 0; bi.push("0"); } document.getElementById("myText").innerHTML = bi; </script> </body> </html>

  • #2
    Hi there - You have a lot of problems in your code.
    Here is a fixed version:
    PHP Code:
    <!DOCTYPE html>
    <
    html>
        <
    body>
            <
    titleDenary to Binary </title>
            
            <
    header class="Header">
                <
    div class="border">
                
                    <
    div class="space">
                        <
    h1Denary to Binary Converter </h1>
                    </
    div>
                    
                </
    div>
            </
    header>
            
            <
    div class ="divider">
                <
    class ="body"please insert a denary number below 255 (8bit) </p>
            </
    div>
            
            <
    form id "myform">
                <
    input id="denary" type="text" placeholder="input number here">
                <
    button id="submit" type="submit" class="btn">enter</button> <!--added id="submit" -->
            </
    form>
            
            <
    form id ="myText">
                <
    input id="binary" class="btn" type="text" placeholder="answer">
            </
    form>
            
            <
    style
                
    html,
                
    body 
                
    {
                    
    font-family'Arial Black", Gadget, sans-serif';
                }
                
    h1 
                
    {
                    
    font-size50px;
                    
    border-bottom2px solid green;
                    
    padding-left20px
                
    }
                .
    btn 
                
    {
                    
    paddding13px 15px;
                    
    bordernone;
                    
    background-color#D3D3D3;
                
    }
            </
    style>
                    
            <
    script
                
    //Added event listener
                
    var submit document.getElementById("submit");
                
    submit.addEventListener("click", function(event
                {
                    
    event.preventDefault(); //prevent form from reloading page
                    
    DeToBi();
                }, 
    false);
                
                function 
    DeToBi() 
                {
                    var 
    bi = []; //closed line with ";"
                    
    var De document.getElementById("denary").value;
                    if (
    De 255
                    {
                        
    document.getElementById("binary").value "your number is bigger than 255"//Chnaged myText to binary
                    

                    else if (
    De 128 >= 0//Changed Dee to De
                    
    {
                        
    De De 128;
                        
    bi.push("1");
                    }
                    else 
                    {
                        
    De De 0;
                        
    bi.push("0")
                    }
                    
                    if (
    De 64 >= 0
                    {
                        
    De De 64;
                        
    bi.push("1");
                    } 
                    else 
                    {
                        
    De De 60;
                        
    bi.push("0");
                    }
                    
                    if (
    De 32 >= 0
                    {
                        
    De De 32;
                        
    bi.push("1");
                    } 
                    else 
                    {
                        
    De De 0;
                        
    bi.push("0");
                    }
                    
                    if (
    De 16 >= 0
                    {
                        
    De De 16;
                        
    bi.push("1");
                    } 
                    else 
                    {
                        
    De De 0;
                        
    bi.push("0");
                    }
                    
                    if (
    De >= 0
                    {
                        
    De De 8;
                        
    bi.push("1");
                    } 
                    else 
                    {
                        
    De De 0;
                        
    bi.push("0");
                    }
                    
                    if (
    De >= 0
                    {
                        
    De De 4;
                        
    bi.push("1");
                    } 
                    else 
                    {
                        
    De De 0;
                        
    bi.push("0");
                    }
                    if (
    De >= 0
                    {
                        
    De De 2;
                        
    bi.push("1");
                    } 
                    else 
                    {
                        
    De De 0;
                        
    bi.push("0");
                    }
                    
                    if (
    De >= 0
                    {
                        
    De De 1;
                        
    bi.push("1");
                    } 
                    else 
                    {
                        
    De De 0;
                        
    bi.push("0");
                    }
                    
                    
    //Delete these 2 lines out if you don't want to use toString
                    
    bi bi.toString(); //Added toString - needed so you can use replace()
                    
    bi bi.replace(/,/g""); //replace "," with ""
                    
                    
                    
    document.getElementById("binary").value bi//changed myText to Binary and innerHtml to value
                
    //closed function here
            
    </script>
        </body>
    </html> 

    Comment


    • Gtmanic
      Gtmanic commented
      Editing a comment
      What is an event listener?

    • Gtmanic
      Gtmanic commented
      Editing a comment
      Oh and i found the problem for under 61, there was a 60 instead of a 0.

  • #3
    There is also more problems in your code in which all numbers under 61 all convert to 00000000.

    Comment


    • #4
      Originally posted by Gtmanic
      What is an event listener?
      Its to detect when your submit button has been pushed.

      The other way you could do it without an event listener is by adding the function into the html eg:

      <button class="btn" onclick="DeToBi();">enter</button>

      It is better to use an event listener.

      Comment


      • #5
        Originally posted by something else View Post
        Hi there - You have a lot of problems in your code.
        Here is a fixed version:
        PHP Code:
        <!DOCTYPE html>
        <
        html>
        <
        body>
        <
        titleDenary to Binary </title>

        <
        header class="Header">
        <
        div class="border">

        <
        div class="space">
        <
        h1Denary to Binary Converter </h1>
        </
        div>

        </
        div>
        </
        header>

        <
        div class ="divider">
        <
        class ="body"please insert a denary number below 255 (8bit) </p>
        </
        div>

        <
        form id "myform">
        <
        input id="denary" type="text" placeholder="input number here">
        <
        button id="submit" type="submit" class="btn">enter</button> <!--added id="submit" -->
        </
        form>

        <
        form id ="myText">
        <
        input id="binary" class="btn" type="text" placeholder="answer">
        </
        form>

        <
        style>
        html,
        body
        {
        font-family'Arial Black", Gadget, sans-serif';
        }
        h1
        {
        font-size50px;
        border-bottom2px solid green;
        padding-left20px
        }
        .
        btn
        {
        paddding13px 15px;
        bordernone;
        background-color#D3D3D3;
        }
        </
        style>

        <
        script>
        //Added event listener
        var submit document.getElementById("submit");
        submit.addEventListener("click", function(event)
        {
        event.preventDefault(); //prevent form from reloading page
        DeToBi();
        }, 
        false);

        function 
        DeToBi()
        {
        var 
        bi = []; //closed line with ";"
        var De document.getElementById("denary").value;
        if (
        De 255)
        {
        document.getElementById("binary").value "your number is bigger than 255"//Chnaged myText to binary
        }
        else if (
        De 128 >= 0//Changed Dee to De
        {
        De De 128;
        bi.push("1");
        }
        else
        {
        De De 0;
        bi.push("0")
        }

        if (
        De 64 >= 0)
        {
        De De 64;
        bi.push("1");
        }
        else
        {
        De De 60;
        bi.push("0");
        }

        if (
        De 32 >= 0)
        {
        De De 32;
        bi.push("1");
        }
        else
        {
        De De 0;
        bi.push("0");
        }

        if (
        De 16 >= 0)
        {
        De De 16;
        bi.push("1");
        }
        else
        {
        De De 0;
        bi.push("0");
        }

        if (
        De >= 0)
        {
        De De 8;
        bi.push("1");
        }
        else
        {
        De De 0;
        bi.push("0");
        }

        if (
        De >= 0)
        {
        De De 4;
        bi.push("1");
        }
        else
        {
        De De 0;
        bi.push("0");
        }
        if (
        De >= 0)
        {
        De De 2;
        bi.push("1");
        }
        else
        {
        De De 0;
        bi.push("0");
        }

        if (
        De >= 0)
        {
        De De 1;
        bi.push("1");
        }
        else
        {
        De De 0;
        bi.push("0");
        }

        //Delete these 2 lines out if you don't want to use toString
        bi bi.toString(); //Added toString - needed so you can use replace()
        bi bi.replace(/,/g""); //replace "," with ""


        document.getElementById("binary").value bi//changed myText to Binary and innerHtml to value
        //closed function here
        </script>
        </body>
        </html> 
        Good job man, you are a real trooper.

        Comment

        Working...
        X