我的任务是构建一个支持用户登录的移动应用程序,并使用 PhoneGap、jQuery Mobile、AJAX 和 PHP 来完成它。我试图从简单的开始并建立在基本的 HTML 和 PHP 结构上,因为我不是程序员,在这方面没有太多经验。但即使是我简单的用户登录表单也无法正常工作。
我有以下 HTML 代码将用作用户登录页面 (sampleindex.html):
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="/themes/P32-Manager.css">
<link rel="stylesheet" type="text/css" href="/themes/jquery.mobile.icons.min.css">
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile.structure-1.4.5.min.css">
<link rel="stylesheet" type="text/css" href="/themes/jQuery-Overrides.css">
<link rel="stylesheet" type="text/css" href="/css/styles.css">
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<script>
function userLogin(email) {
if (email == "") {
document.getElementById("logincontainer").innerHTML = "";
return;
}
else {
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}
else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("logincontainer").innerHTML = xmlhttp.responseText;
}
};
xmlhttp.open("GET","samplehome.php?UserName="+email,true);
xmlhttp.send();
}
}
</script>
</head>
<body>
<div data-role="page" id="logincontainer">
<form action="sampleindex.html" method="get">
<div style="text-align:center; display:inline-block;">
<div data-role="fieldcontain" style="text-align:center; position:relative; top:0em; left:0.5em; width:100%; margin:auto; border:0;">
<label for="username" style="display:block; width:350px; text-align:left;">Username (Email)
<input data-clear-btn="false" name="UserName" type="text" value="" class="ui-input-text" style="height:40px; font-size:18px;">
</label>
</div>
<div data-role="fieldcontain" style="text-align:center; position:relative; top:-1.25em; left:0.5em; width:100%; margin:auto; border:0;">
<label for="password" style="display:block; width:350px; text-align:left;">Password
<input data-clear-btn="false" name="Password" type="password" value="" class="ui-input-text" autocomplete="off" style="height:40px; font-size:18px;">
</label>
</div>
</div>
<div data-role="fieldcontain" style="text-align:center; position:relative; top:-0.5em; left:-1em; width:100%; margin:auto; border:0;">
<div id="login-button" style="position:relative; left:0em; width:300px; height:62px; margin:auto; border:0; background-color:#ffffff;" data-inline="true">
<input data-role="button" name="loginbutton" type="submit" value="Login" style="position:absolute; left:0em;" onClick="userLogin(UserName);">
</div>
</div>
</form>
</div>
</body>
</html>
我们正在为我们的数据库和 FileMaker PHP API 使用 FileMaker(不要让这吓到你——它与 MySQL 非常相似,程序员应该能够理解正在发生的事情)来将该数据库连接到移动应用程序。数据库通过“包含”的 dbaccess.php 文件(此处未显示)连接,使用的布局称为“Demo php”。我想在我的 URL 中传递的第一个值(电子邮件地址格式)称为“用户名”,对应于名为“用户名”的数据库列。我想从 URL 中 $_GET 那个 UserName,然后返回相应的“FirstName”。除此之外,我还想从与提交的查询对应的数据库行中获取 RecordID,这样我就可以为每个登录用户提供他们的特定信息。
这是我的 PHP 文件(samplehome.php):
<?php
session_start();
$_SESSION['logged-in']=0;
?>
<?php
include ("../../dbaccess.php");
$username = urldecode($_GET['UserName']);
if(isset($_GET['loginbutton']) and (!empty($_GET['UserName']) and !empty($_GET['Password'])) )
{
$username = '==' . urldecode($_GET['UserName']);
$password = md5($_GET['Password']);
$request = $fm->newFindCommand('Demo php');
$request->addFindCriterion('UserName', $username);
$request->addFindCriterion('Password', $password);
$result = $request->execute();
if (FileMaker::isError($result))
{
$request = $fm->newFindAllCommand('Demo php');
$result = $request->execute();
}
$found = $result->getFoundSetCount();
$records = $result->getRecords();
if($found == 1)
{
$_SESSION['logged-in']=1;
echo '<table border="1">
<tr>
<th>First Name</th>
</tr>';
foreach ($records as $record)
{
echo '<tr>';
echo '<td>' . $record->getField('FirstName') . '</td>';
echo '</tr>';
}
echo '</table>';
}
else
{
$_SESSION['logged-in']=0;
echo 'nope';
}
}
?>
目前,当我单击“登录”时,什么都没有返回,只是一个带有我的 jQuery 主题背景颜色的空白页面。(当我不使用 jQuery 样式表和脚本时,也会出现此空白结果。)尽管我使用了“get”,但 URL 中没有传递任何内容。我认为这是因为我使用了 jQuery 和 AJAX。任何人都知道出了什么问题(而且,尽管页面没有使用 AJAX/jQuery 刷新,但我如何能够使用传递的 ID 值,例如“UserName”)?
提前致谢。