Return Output function javascript inner html

Question

I want to output a function secret(); so it will look like this:

AAAA-BBB-<random string>

But it returns this error:

Uncaught TypeError: secret is not a function

Here is the code :

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>Random End String</title>
  <script type="text/javascript">
    function writeName() {
      var welcomeMsg = document.getElementById('welcome');
      var name = document.getElementById('name');
      var alamat = document.getElementById('alamat');
      var secret = secret();
      var formContent = document.getElementById('entername');
      welcomeMsg.innerHTML = "Your Identifier is " + name.value + "-" + alamat.value + "-" + secret + "";
      formContent.innerHTML = "";
    }
  </script>
  <script>
    function secret() {
      var text = "";
      var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
      for (var i = 0; i < 5; i++)
        text += possible.charAt(Math.floor(Math.random() * possible.length));
    }
  </script>
</head>
<body>
  <p id="welcome"></p>
  <form id="entername">
    Your Name:<input type="text" id="name" /><br/> LockerID:
    <input type="text" id="alamat" /><br/>
    <input type="hidden" id="secret">
    <input type="button" value="Submit" onclick="writeName();" />
  </form>
</body>
</html>

the output is undefined, why it doesn't work

artasena
– artasena

2018-08-02 18:45:39 +00:00
Commented Aug 2, 2018 at 18:45 — artasena
– artasena, Commented Aug 2, 2018 at 18:45

Scath · Accepted Answer · 2018-08-02 20:54:48Z

2

Don't name the var secret change it to something else in this example secret1 works fine'.

EDIT: You also need to return your "secret text".

Full working example:

function writeName() {
  var welcomeMsg = document.getElementById('welcome');
  var name = document.getElementById('name');
  var alamat = document.getElementById('alamat');
  var secret1 = secret();
  var formContent = document.getElementById('entername');
  welcomeMsg.innerHTML = "Your Identifier is " + name.value + "-" + alamat.value + "-" + secret1 + "";
  formContent.innerHTML = "";
}

function secret() {
  var text = "";
  var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

  for (var i = 0; i < 5; i++) {
    text += possible.charAt(Math.floor(Math.random() * possible.length));
  }
  return text
}

function writeName1() {
  var welcomeMsg = document.getElementById('welcome');
  var name = document.getElementById('name');
  var alamat = document.getElementById('alamat');
  var text = "";
  var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

  for (var i = 0; i < 5; i++) {
    text += possible.charAt(Math.floor(Math.random() * possible.length));
  }
  var formContent = document.getElementById('entername');
  welcomeMsg.innerHTML = "Your Identifier is " + name.value + "-" + alamat.value + "-" + text + "";
  formContent.innerHTML = "";
}

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <title>Random End String</title>
</head>

<body>
  <p id="welcome"></p>
  <form id="entername">
    Your Name:<input type="text" id="name" /><br/> LockerID:
    <input type="text" id="alamat" /><br/>
    <input type="hidden" id="secret">
    <input type="button" value="Submit" onclick="writeName();" />
  </form>
</body>

</html>

Your Name:<input type="text" id="name1" /><br/> LockerID:
<input type="text" id="alama1t" /><br/>
<input type="hidden" id="secret1">
<input type="button" value="Submit" onclick="writeName1();" />

edited Aug 2, 2018 at 20:54

answered Aug 2, 2018 at 18:26

Scath

3,81710 gold badges32 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

artasena Over a year ago

why it's still undefined?

Scath Over a year ago

Never mind check the edit you also need to return your "secret text"

Scath Over a year ago

Try it now it will return the secret text if you put nothing in the boxes or if you do it will return box1 text + box2 text + secret text

artasena Over a year ago

Cool, it's work, Many thanks for you, so for any function i should return the value right? i just learn javascript, this is so cool. but i'm curious, if javascript clientside, how do i hide the function for public like php? btw many thanks again.

Scath Over a year ago

You could just put the secret code in the same function and not call secret like the second example but if you want a function to return a value to you you have to return it

ControlAltDel · Accepted Answer · 2018-08-02 18:27:17Z

1

Your local variable secret is hiding your function secret. Simply rename the variable to something else to fix this issue

function writeName(){
 var welcomeMsg = document.getElementById('welcome');
 var name = document.getElementById('name');
 var alamat = document.getElementById('alamat');
 var secret = secret(); //right here this is your issue
 var formContent = document.getElementById('entername');

 welcomeMsg.innerHTML = "Your Identifier is "+name.value+"-"+alamat.value+"-"+secret+""; 
 formContent.innerHTML = "";

 }

answered Aug 2, 2018 at 18:27

ControlAltDel

35.2k10 gold badges60 silver badges86 bronze badges

1 Comment

ControlAltDel Over a year ago

@artasena I didn't correct your code but I added a comment indicating where your problem is

Collectives™ on Stack Overflow

Return Output function javascript inner html

2 Answers 2

5 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related