how can I print javascript variable in input type textbox value like php echo

Question

It is possible like php in javascript as below....

 <?php
     $var1 = "Hello";
     $var2 = "World";
  ?> 
    <input  type="text" value="<?php echo $var1; ?>" /> 
    <input  type="text" value="<?php echo $var2; ?>" />


    <script type="text/javascript">
       var str = "abc,def,ghi,jkl,mno,pqr";
        var x = str.split(","); 
     </script>

I have input type='text' in the body tag like

 <input id="txtOne" name="txtOne" type="text" value="I want to print here using javascript x[0]" /> 

 <input id="txtOne" name="txtOne" type="text" value="I want to print here using javascript x[1]" />

Thanks.

you can try like document.getElementById("txtOne").setAttribute("value",x[0]) — satya-j
– satya-j, Commented Nov 7, 2016 at 7:20
Possible duplicate of Passing javascript variable to html textbox — dhruv jadia
– dhruv jadia, Commented Nov 7, 2016 at 7:21
there's no way you'll be able you call a js variable inside value="x[0]" in html. you just let the javascript assign it's value — Beginner
– Beginner, Commented Nov 7, 2016 at 7:39

Icewine · Accepted Answer · 2016-11-07 07:40:36Z

0

var str = "abc,def,ghi,jkl,mno,pqr";
var x = str.split(",");

var input = document.getElementById("txtOne");
input.value = input.value + x[0];

input {
    width: 400px;
  }

<input id="txtOne" name="txtOne" type="text" value="I wan't print here using javascript " />

answered Nov 7, 2016 at 7:40

Icewine

1,8511 gold badge13 silver badges22 bronze badges

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

Comments

Abk · Accepted Answer · 2016-11-07 08:53:23Z

0

Without using any library, you need to work with the DOM.

This is probably what you want.

See the DEMO below

var str = "abc,def,ghi,jkl,mno,pqr";
var x = str.split(",");

var input = document.querySelectorAll('.txtOne');

for (var i = 0; i < input.length; i++){
  input[i].value = x[i];

}

<input class="txtOne" name="txtOne" type="text" value="" /> 
<br/>
 <input class="txtOne" name="txtOne" type="text" value="" /> 
<br/>
 <input class="txtOne" name="txtOne" type="text" value="" />

edited Nov 7, 2016 at 8:53

answered Nov 7, 2016 at 7:43

Abk

2,2431 gold badge25 silver badges34 bronze badges

3 Comments

Nmarediya Over a year ago

can you done with class var input = document.querySelectorAll('.txt');

Abk Over a year ago

Yes. You can do that as well. I have updated the answer.

Nmarediya Over a year ago

Lot Of Thanks Abk

Nmarediya · Accepted Answer · 2016-11-16 04:56:53Z

Create Cookies in page 1 (Create Cookies On this page )
    <script type="text/javascript">
         function createCookie(name,value,days) {
              if (days) {
                var date = new Date();
                date.setTime(date.getTime()+(days*24*60*60*1000));
                var expires = "; expires="+date.toGMTString();
          }
          else var expires = "";
               document.cookie = name+"="+value+expires+"; path=/";
          }
   var PartyDetail = $("#firstname").val() +"|"+$("#middlename").val()+"|"+$("#lastname").val();

  createCookie('cookiesPartyDetail',PartyDetail,2);
    </script>

  Now read cookies on second page

 <script type="text/javascript">
      function readCookie(name) {
          var nameEQ = name + "=";
          var ca = document.cookie.split(';');
          for(var i=0;i < ca.length;i++) {
               var c = ca[i];
               while (c.charAt(0)==' ') c = c.substring(1,c.length);
               if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
             }
            return null;
       }
     window.onload = function()
      {
          var str = readCookie('cookiesPartyDetail');
          //var str = "firstname,middlename,lastname";
          var x = str.split("|");
          for (i = 0; i < 3; i++) 
          { 
            $(".pending_order_"+[i]).val(x[i]);
          }

      } 

  function delete_cookie(name) {
    document.cookie = name +'=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
     }
 </script>

 <input class="pending_order_0" id="firstname" name="firstname" type="text"  /> 
 <input class="pending_order_1" id="middlename" name="middlename" type="text" />
 <input class="pending_order_2" id="lastname" name="lastname" type="text" />

 if I want to use again in input type hidden field same like firstname, middlename, lastname my code is here..

 <input class="pending_order_0" id="firstname" name="firstname" type="hidden"  /> 
 <input class="pending_order_1" id="middlename" name="middlename" type="hidden" />
 <input class="pending_order_2" id="lastname" name="lastname" type="hidden" />

Amaresh C. · Accepted Answer · 2016-11-07 07:27:41Z

-1

Using Javascript or one of it's libraries you can do that.

Using Jquery:

$("#txtOne").val(x[0]);

answered Nov 7, 2016 at 7:27

Amaresh C.

5975 silver badges17 bronze badges

2 Comments

Nmarediya Over a year ago

I know this but i wan't to print in value="<script>document.write(x[0])</script>" it is possible..

Rajesh Dixit Over a year ago

Note: if jQuery is not tagged, answer based on it will attract downvotes

Collectives™ on Stack Overflow

how can I print javascript variable in input type textbox value like php echo

4 Answers 4

Comments

3 Comments

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

3 Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related