user2804038
user2804038

Reputation: 1153

how to display input text that user has writen in a label

I want to display what the user has witten in an input text. I have to formslike below and on the second form I want to display on a label what the user has witten at the input part. But how can I do this...

The first form:

<form name="password" onsubmit="return Validate()" method="post" id="password" action="#"  >

               <label for="firstname">*First Name:</label>
               <input type="text" name="firstname" id="firstname1"  class="textinput"  required="required" onchange="firstnamecheck1()"><br>

The second form:

 <form name="displaylabel" method="post" id="password" action="#"  >

             <label>First Name:</label>&nbsp;&nbsp;<label id="l1">li.innerHTML('lastname1')</label><br>
    </form>

How can I do this because the inner html I use above li.innerHTML('lastname1') do not give result.

I use this function:

<script>
 function doStuff()
{myVar = document.getElementById('lastname1');
    document.getElementById('l1').value = myvar;
}
</script>

and this is the part of the form:

<div class="hideformobile" onload="doStuff();">


        <form name="displaylabel" method="post" id="password" action="#"  >

         <label>First Name:</label>&nbsp;&nbsp;<label id="l1"></label><br>

        </form>
        </div>

But it still it gives no result...What can I do? Please help me

Upvotes: 0

Views: 208

Answers (3)

RobG
RobG

Reputation: 147413

You have an onchange function called firstnamecheck1. I don't know what that does, but you can either add the following functionality to that function, or add this to the inline listener:

<input ... onchange="firstnamecheck1(); document.getElementById('l1').innerHTML = this.value;">

However, I'd prefer to set the textContent or innerHTML as appropriate using something like:

setText(document.getElementById('l1'), this.value);

Requires a small helper function to set the text:

function setText(el, text) {
  if (typeof el.textContent == 'string') {
    el.textContent = text;
  } else if (typeof el.innerText == 'string') {
    el.innerText = text;
  }
}

Upvotes: 0

Hybrid
Hybrid

Reputation: 21

<label>First Name:</label>&nbsp;&nbsp;<label id="l1">li.innerHTML('lastname1')</label><br>

This is not the proper way to use this javascript. You need to run it inside a function. If you put it in a block like

<script>
function doStuff()
{
    document.getElementById('l1').innerHTML = 'lastname1';
}
</script>

When you call doStuff(), that code will execute and change the innerHTML property of the list item element. You can call this sort of function on page or body load as well.

<body onload="doStuff();"> (more content) </body>

Upvotes: 0

plalx
plalx

Reputation: 43718

To change the HTML content of an element you may set it's innerHTML property.

document.getElementById('my-element').innerHTML = 'test';

To get/set the value of an <input> element, use it's value property.

document.getElementById('my-input').value = 'something';

Upvotes: 2

Related Questions