CODEWITHSUNDEEP
javascripthtml
toyotasupra
toyotasupra

Reputation: 89

JavaScript: textarea not showing output

I am making a Leetspeak converter program, but the second textarea does not show any output. Here is my rudimentary code:

    <!DOCTYPE html>
    <html>
    <body>

    <h1>Leetspeak Converter</h1>

    <script language="JavaScript">
    function convert(){
      var x = document.getElementById("myTextArea").value;
      var result='';
      for (var i = 0, len = x.length; i < len; i++) {
        if (x.charAt(i)=='A'){
          result = result + '4';
        }
      }
      document.getElementById('resultTextarea').value = result ;
    }
    </script>

    <div class="input">
    <textarea id = "myTextArea" rows = "6" cols = "80">
    </textarea>
    </div>

    <div class="push">
    <button onclick="convert">Convert</button>
    </div>

    <div class="result">
    <textarea id = "resultTextArea" rows = "6" cols = "80">
    </textarea>
    </div>

It does not produce any output at all. I have tried using console.log(), but it shows no output. I have also used a debugger, but no dice.

Upvotes: 1

Views: 1473

Answers (3)

F.Kahalaj
F.Kahalaj

Reputation: 86

try this

<!DOCTYPE html>
    <html>
    <body>

    <h1>Leetspeak Converter</h1>

    <script language="JavaScript">
    function convert(){
      var x = document.getElementById("myTextArea").value;

      var result='';


      for (var i = 0,len = x.length ; i < len; i++) {
        if (x.charAt(i)=='A'){
          result = result + '4';
        }
      }

      document.getElementById('resultTextArea').value = result ;
    }
    </script>

    <div class="input">
    <textarea id = "myTextArea" rows = "6" cols = "80">
    </textarea>
    </div>

    <div class="push">
    <button onclick="convert()">Convert</button>
    </div>

    <div class="result">
    <textarea id = "resultTextArea" rows = "6" cols = "80">
    </textarea>
    </div>
    </body>
    </html>

Upvotes: 1

user2560539
user2560539

Reputation:

You have syntax errors, in 2 parts, so change this

<button onclick="convert">Convert</button> // this does not represent a method

with this

<button onclick="convert()">Convert</button>

and in addition, this

document.getElementById('resultTextarea').value = result ; // a small typo in id

with this

document.getElementById('resultTextArea').value = result ;


function convert(){
      var x = document.getElementById("myTextArea").value;
      var result=0;
      for (var i = 0, len = x.length; i < len; i++) {
        if (x.charAt(i)=='A'){
          result = result + 4;
        }
      }
      document.getElementById('resultTextArea').value = result ;
    }
<div class="input">
    <textarea id = "myTextArea" rows = "6" cols = "80">
    </textarea>
    </div>

    <div class="push">
    <button onclick="convert()">Convert</button>
    </div>

    <div class="result">
    <textarea id = "resultTextArea" rows = "6" cols = "80">
    </textarea>
    </div>

Upvotes: 2

Akshay Pethani
Akshay Pethani

Reputation: 2580

You have syntax error in:

<button onclick="convert">Convert</button>

Fixed this as:

<button onclick="convert()">Convert</button>

Upvotes: 1

Related Questions