olawole.famakin 0 Newbie Poster

Hello i am trying to echo a listview using php, i have made an ajax request to display the list view in my html page using div.

but the list view never comes out properly, which leaves me with only one thing, that the css and javascript for this listview needs to be loaded

this is my html page

`<html>`
`<head>`
`<link rel="stylesheet" href="themes/transport.min.css" />`
        `<link rel="stylesheet" href="themes/jquery.mobile.icons.min.css" />`
        `<link rel="stylesheet" href="themes/jquery.mobile.structure-1.4.2.min.css" />`
     ` <script type="text/javascript" charset="utf-8" src="cordova.js"></script>`

        <script src="themes/jquery-1.10.2.min.js"></script>
        <script src="themes/jquery.mobile-1.4.2.min.js"></script>



function showUser() {
    if (showUser == "") {
        document.getElementById("txtHint").innerHTML = "";
        return;
    } else { 
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
                $('.collapsible').collapsible();
            }
        }
        var usersvalue=encodeURIComponent(document.getElementById("users").value)
var uservalue=encodeURIComponent(document.getElementById("user").value)
        xmlhttp.open("GET","http://whitechapelandpartners.com/getuserwrong.php?users="+usersvalue+"&user="+uservalue, true);


        xmlhttp.send();

    }
}
</script>
  <script type="text/javascript">

 function exit() {
        navigator.notification.confirm(
            'Do you really want to exit ?',  // message
            exitFromApp,              // callback to invoke with index of button pressed
            'Exit App',            // title
            'Abort Exit Process,YES'         // buttonLabels
        );
    }
    function exitFromApp(buttonIndex) {
      if (buttonIndex==2){
       navigator.app.exitApp();
        }}
        function spinn(){
            $.mobile.loading( 'show', {
    text: 'Please wait Loading!!!!',
    textVisible: true,
    theme: 'h',
    html: ""
   });
        setTimeout(function hideIndicator2(){$.mobile.loading( 'hide');},3000);
        }
        </script>
<title>app</title>
</head>
<body>
<div data-role="page" id="one">
<div data-role="header" data-theme="e" data-position="fixed" data-fullscreen="true" data-tap-toggle="false" data-hide-during-focus="false" data-id="toolbar">
            <div data-role="navbar">
            <ul>
                <li><a href="#" data-prefetch="true"  data-ajax="false" data-icon="home"  data-transition="slidedown" onClick="spinn();return createTimedLink(this, myFunction, 3000);">Home</a></li>
            </ul>
        </div>
        </div>
    <div data-role="content">
 <br /><br /><br />
<form>

  <input data-theme="c" name="users" id="users" type="text" onKeyUp="showUser(this.value)">
    <input data-theme="c" name="user" id="user" type="text" onKeyUp="showUser(this.value);" onKeyPress="spinn();" >
</form>
<br>
<div id="txtHint"><b>Person info will be listed here.</b></div><br /><br /><br /><br />
    </div>
    <div data-role="footer" data-theme="e" data-position="fixed" data-fullscreen="true" data-tap-toggle="false" data-hide-during-focus="false" data-id="toolbar">
            <div data-role="navbar">
            <ul>
                 <li><a href="#" onClick="exit();" data-ajax="false" data-icon="power" class="ui-btn-active">Exit</a></li> 
            </ul>
        </div>
    </div> <!-- /footer -->
</div>
</body>
</html>

and this is the php page i make a request to

 <?php header('Access-Control-Allow-Origin: *'); ?>
<?php
$users = ($_GET['users']);
$user = ($_GET['user']);
$con = mysqli_connect('localhost','whit_manage','faman','whit_manage');
if (!$con) {
  die('Could not connect: ' . mysqli_error($con));
}
mysqli_select_db($con,"whit_manage");
$sql="SELECT * FROM data WHERE fromwhere = '".$users."' and towhere = '".$user."'";
$result = mysqli_query($con,$sql);
echo '<head>';
echo "<link rel='stylesheet' href='themes/transport.min.css' />";
echo "<link rel='stylesheet' href='themes/jquery.mobile.icons.min.css' />";
echo "<link rel='stylesheet' href='themes/jquery.mobile.structure-1.4.2.min.css' />";
echo "<script src='themes/jquery-1.10.2.min.js'></script>";
echo "<script src='themes/jquery.mobile-1.4.2.min.js'></script>";
echo '</head>';
while($row = mysqli_fetch_array($result)) {
echo "<div data-role='collapsible' data-theme='b' data-content-theme='b'>";
    echo "<ul data-role='listview' data-filter='true'>";
       echo "<li><a href='#'>". $row['fromwhere'] . "</a></li>";
          echo "<li><a href='#'>". $row['towhere'] . "</a></li>";
             echo "<li><a href='#'>". $row['details'] . "</a></li>";
     echo "<li><a href='#'>". $row['time frame'] . "</a></li>";
 echo "</ul>";
echo "</div>";
}
mysqli_close($con);
?>

What could i be doing wrong here, because i have tried to echo my style sheet links and javscript links`