Populate second text box based on value extracted from first text box

**acoder** · Oct 15 '08, 09:04 AM

Post what code you have so far. Once you access an element using document.getEle mentById(), you can use the value property to get/set values - see link.

PS. Please Use a Good Thread Title in future. Thanks!

**sarega** · Oct 15 '08, 09:49 AM

Urgent-Setting value of a textbox based on another in javascript

Hi,
I have to populate one text box based on the value entered in the previous text box
eg:if the first text box contains abc/efg/hij then the next text box should contain abc/efg/xyz only if the first text box has abc/efg otherwise user has to enter the value into the next text box.

Thanks

**acoder** · Oct 15 '08, 10:26 AM

Threads merged. Please do not double post your questions. Thanks.

Moderator.

**sarega** · Oct 15 '08, 11:24 AM

Code:

</head>
 <script type='text/javascript'>
 function test1()
 {
    var a = document.getElementById("first").value;
    var b = a.split('/');
    if( b[0] ==  "abc"){
    document.getElementById("second").setAttribute("value",a);
    }
 }
 </script>
 <body>
 <input type="text" id="first" onChange="test1();"/><br><br>
 <input type="text" id="second"/>
 </body>
 </html>

this is the code that I am using can i use a function inside setAttribute?

**acoder** · Oct 15 '08, 12:08 PM

Yes, you can replace 'a' with a function call as long as it returns a string.

PS. please use code tags when posting code. Thanks.

**sarega** · Oct 16 '08, 03:58 AM

Code:

<script type='text/javascript'>
 function test1()
 {
    var a = document.getElementById("first").value;
    var b = a.split('/');
    var d =b[0];
    var c = b[1];
    if( b[0] ==  "abc"){
    document.getElementById("second").setAttribute("value",test2(d,c));
    }
 }

 function test2(d,c)
 {
        if ( c == "def" ) {
        var f = "klm";
        var x = d+'/'+c+'/'+f;
        return x;
        }
}

 </script>
 <body>
 <input type="text" id="first" onChange="test1();"/><br><br>
 <input type="text" id="second"/>

what is wrong with this code? am not getting the required result

**zaphod42** · Oct 16 '08, 05:31 AM

Code:

function test1(){ 
var a = document.getElementById("first").value;
var b = a.split('/');
var d =b[0];
var c = b[1];
if((d == "abc")&&(c == "klm")){
document.getElementById("second").value=test2(d,c)
}
}
function test2(d,c){
var f = "klm";
var x = d+'/'+c+'/'+f;
return x;
}

**sarega** · Oct 16 '08, 06:33 AM

can I include in the setAttribute("v alue",test2(c,d )) a function which is not within the javascript scope but a function which is within the scope of the html/php?

Code:

 <script type='text/javascript'>
 function test1()
 {
    var a = document.getElementById("first").value;
    var b = a.split('/');
    var d =b[0];
    var c = b[1];
    if( b[0] ==  "abc"){
    document.getElementById("second").setAttribute("value",test2(d,c));
    }
 }

 function test2(d,c)
 {
        if ( c == "def" ) {
        var f = "2009";
        var x = c+'/'+'xyz'+'/'+f;
        return x;
        }
}

can I use functions which are not present in this particular file to be called in the javascript function test2()

**acoder** · Oct 16 '08, 07:21 AM

As long as it's within the same page, it should be OK.

When you say you don't get the required result, please elaborate. What do you expect and what do you get instead?

PS. Please enclose your posted code in [code] tags (See How to Ask a Question). Thanks.

**sarega** · Oct 16 '08, 08:17 AM

if the function is not present in the present page then how do I access that function in the javascript function??

**acoder** · Oct 16 '08, 09:01 AM

Then include it using script tags, e.g.

Code:

<script type="text/javascript" src="file.js"></script>

**sarega** · Oct 16 '08, 09:43 AM

Actually what I wanted is the values b[0] and b[1] has to be passed to a php function where the processing will be done and then the result of that php function has to be returned to the setAttribute.

**acoder** · Oct 16 '08, 09:52 AM

Why didn't you say that earlier?! ;)

What you need is Ajax (if you want to avoid a page reload) unless you can convert the PHP function to JavaScript. If you're new to Ajax, check out the links in the Off-site Links sticky.

**sarega** · Oct 16 '08, 10:46 AM

Code:

<?php
     $c=$_GET['c'];
     $d=$_GET['d'];
     if($c=="cat") {
        $e=$d.$c;
        }
     ?>
<script type='text/javascript'>
function test1()
{
     var a = document.getElementById("first").value;
     var b = a.split('/');
      var d =b[0];
      var c = b[1];
      if( b[0] ==  "dog"){
      location.href="c.php?d="+d+"&c="+c;
       var js= <?php echo $e; ?>
       document.getElementById("second").setAttribute("value",js);
       }
}

</script>
<body>
<input type="text" id="first" size="40" onKeyUp="test1();"/><br><br>
<input type="text" id="second" size="40"/>
</body>

what is wrong with this code??

Populate second text box based on value extracted from first text box

Populate second text box based on value extracted from first text box

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment