CODEWITHSUNDEEP
phpajax
Juna serbaserbi
Juna serbaserbi

Reputation: 227

How do I put the result of Ajax (get data from server) into input tag?

See my picture:

I want that result be filled into an input tag.

It works if I do like this:

<?php
    include('c2gcon.php');
    include('logincheckadmin.php');
    $nameajax=isset($_REQUEST['nameajax'])?$_REQUEST['nameajax']:null;
    if($nameajax<>null){
        $username=$nameajax;
        $_SESSION['simpanun8']=$_SESSION['simpanun8'].','.$username;
        $_SESSION['simpanun8'][0]='';
        echo "username=$_SESSION[simpanun8]";
        exit;
    }
?>
<html>
<head>
    <title>DELETE RECORD</title>
    <link rel="shortcut icon" href="http://c2gdragonteam.com/img/dragonhead.ico">
    <link href="/css/bootstrap.css" rel="stylesheet">
    <style>
        p,td {
            font-size: 70%;
        }
    </style>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular-resource.min.js"></script>
</head>
<body ng-app="ctrljs">
<?php
    $_SESSION['simpanun8']=null;
    $ssloginadmin=$_SESSION['ssloginadmin'];
    $page=isset($_REQUEST['page'])?$_REQUEST['page']:null;
    if($page=='form'){
?>
    <form method='post' name='formupgrade' ng-controller='formctrl'>
        <table>
            <tr><td>Username : <em>(using comma if multiuser)</em></td></tr>
            <tr>
                <td>
                    <select name='username' id='username' ng-model='username' required>
                        <option value='' selected></option>
<?php
                            $q=mysql_query("SELECT username FROM t_un WHERE upgrade='1' and t1count='0' and t2count='0' ORDER BY username");
                            while($f=mysql_fetch_object($q)){
?>
                                <option value='<?php echo "$f->username";?>'><?php echo "$f->username";?></option>
<?php
                            }
?>
                    </select>
                    <input type='button' value='add' onclick='checkusername();'></input>
                </td>
            </tr>
            <tr>
                <td>
                    <input name='usernameresult' ng-model='usernameresult' required ng-pattern="/^[A-Za-z0-9/\.\-\s\,]*$/"></input>
                </td>
            </tr>
        </table>
        <input type='submit' value='submit' ng-hide="!formupgrade.$valid"></input>
    </form>
    <br>
    <div id='resultmunculdisini'></div>
<?php   
    }
?>
<script>
function checkusername(){
    var status = document.getElementById("resultmunculdisini");
    var u = document.getElementById("username").value;
    if(u != ""){
        status.innerHTML = "<font color='red'><img src='/img/loading.GIF'></img> checking...</font>";
        var hr = new XMLHttpRequest();
        hr.open("POST", "admintreedelrec.php", true);
        hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        hr.onreadystatechange = function() {
            if(hr.readyState == 4 && hr.status == 200) {
                status.innerHTML = hr.responseText;
            }
        }
        var v = "nameajax="+u;
        hr.send(v);
    }
}
</script>
<script>
var app = angular.module('ctrljs', []);
app.controller('formctrl', function($scope, $http){
  $scope.digits = {};
});
</script>
</body>
</html>

I'm using an AJAX, and it works like a charm if I do like above, But I don't know how put the result into an input tag. I've tried like this, I put ID (id='resultmunculdisini') in input tag, but nothing happens:

            <tr>
                <td>
                    <input name='usernameresult' id='resultmunculdisini' ng-model='usernameresult' required ng-pattern="/^[A-Za-z0-9/\.\-\s\,]*$/"></input>
                </td>
            </tr>

And I change my old ID inactive, like this:

<!--<div id='resultmunculdisini'></div>-->

Upvotes: 4

Views: 100

Answers (2)

Vishnu
Vishnu

Reputation: 12303

this is without XMLHttpRequest

<tr>
<td>
<input name='usernameresult' id='resultmunculdisini' ng-model='usernameresult' required ng-pattern="/^[A-Za-z0-9/\.\-\s\,]*$/" value="<?php echo "$_SESSION[simpanun8]";?>"></input>
</td>
</tr>

<form method='post' name='formupgrade' ng-controller='formctrl' action="admintreedelrec.php">
<select name='nameajax' id='username' ng-model='username' required>
<option value='' selected></option>
<?php
$q=mysql_query("SELECT username FROM t_un WHERE upgrade='1' and t1count='0' and t2count='0' ORDER BY username");
while($f=mysql_fetch_object($q)){
?>
<option value='<?php echo "$f->username";?>'><?php echo "$f->username";?></option>
<?php
                        }
?>
</select>
<input type='button' value='add' onclick='checkusername();'></input>
<input type='submit' value='add'></input>
</form>

Upvotes: 0

Vishnu
Vishnu

Reputation: 12303

input will not have innerhtml, it will have value.

document.getElementById("resultmunculdisini").value=hr.responseText;

you have given same id(resultmunculdisini) to multible dom elements(div and input). id should be unique. remove the id of the div as resultmunculdisini

another.php

<?php
    include('c2gcon.php');
    include('logincheckadmin.php');
    $nameajax=isset($_REQUEST['nameajax'])?$_REQUEST['nameajax']:null;
    if($nameajax<>null){
        $username=$nameajax;
        $_SESSION['simpanun8']=$_SESSION['simpanun8'].','.$username;
        $_SESSION['simpanun8'][0]='';
        echo "username=$_SESSION[simpanun8]";
        exit;
    }
?>

your php script

    hr.open("POST", "another.php", true);
    hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    hr.onreadystatechange = function() {
        if(hr.readyState == 4 && hr.status == 200) {
            status.innerHTML = hr.responseText;
        }
    }
    var v = "nameajax="+u;
    hr.send(v);

Upvotes: 1

Related Questions