我目前正在使用 Kendo UI 制作一个 iPhone 应用程序,我正在通过手机间隙运行该应用程序以在我的 iPhone 上进行测试。
设计都很好地规划出来,我正在掌握 Kendo 框架。我正在尝试提供一些功能,让他们可以登录帐户。
我的外部 PHP 文件运行查询并返回 JSON:
<?php
$arr = array();
//Takes the username and password from the login form and queries the database to find out if they have access to the site.
//Cleanse inputs
$username = $_GET['username'];
$password = md5_base64($_GET['password']);
$stmt = $memberMysqli->prepare("SELECT id, firstname, dob, sex, recordingWeight, blocked, enabled FROM member WHERE email = ? AND password = ?");
$stmt->bind_param('ss', $username, $password);
$stmt->execute();
$stmt->bind_result($memberid, $firstname, $dob, $sex, $recordingWeight, $blocked, $enabled);
$stmt->store_result();
session_start();
while ($stmt->fetch())
{
$userIsBlocked = $blocked;
$enabled = $enabled;
}
if(($numRows = $stmt->num_rows) > 0) //If num rows is 1 the combination exists therefore it is a succesful login
{
if($userIsBlocked)
{
$arr['status'] = "error";
$arr['message'] = "Sorry, your account isnt active. Please contact us to re-activate it.";
}
else if(!$enabled)
{
$arr['status'] = "error";
$arr['message'] = "Sorry, your account isn't enabled. Please contact us.";
}
else
{
$_SESSION['memberid'] = $memberid;
$_SESSION['memberFirstname'] = $firstname;
$_SESSION['dob'] = $dob;
$_SESSION['sex'] = $sex;
$_SESSION['recordingWeight'] = $recordingWeight;
$arr['status'] = "success";
$arr['message'] = "Logged in";
}
}
else
{
$arr['status'] = "error";
$arr['message'] = "Sorry, Wrong Username/Password Combination";
}
header("Content-type: application/json");
echo json_encode($arr);
/* close connection */
function md5_base64 ( $data )
{
return preg_replace('/=+$/','',base64_encode(md5($data,true)));
}
?>
所以这会返回成功,已登录或抱歉用户名/密码组合错误..
这是我的表单代码:
<form>
<fieldset>
<p><label style="color:white;" for="email">E-mail address</label></p>
<p><input type="email" id="email" value=""></p>
<p><label style="color:white; font" for="password">Password</label></p>
<p><input type="password" id="password" value=""></p>
<p><input type="submit" value="Sign In"></p>
</fieldset>
和 JS:
<script>
$("form").on("submit", function() {
var username = document.getElementById('email').value;
var password = document.getElementById('password').value;
var dataSource = new kendo.data.DataSource({
transport: {
read: {
url: 'http://myurl.co.uk/appqueries/login.php?username='+username+'&password='+password,
dataType: "json"
}
}
});
//alert("Your username is "+username+" and your password is: "+password);
});
</script>
任何人都可以帮助我获取 PHP 文件返回的 JSON,然后在登录成功时让用户进入应用程序,如果登录失败则显示一条消息。
最佳答案
我认为您不需要为此使用数据源(可以这样做,但数据源需要读取操作中的对象数组),除非有其他要求。
如果这是您的 HTML:
<input id='username' type='text' value='user'></input>
<input id='password' type='text' value='password'></input>
<button id='loginbutton'>Login</button>
<div id='loginresult'></div>
然后您可以使用 jQuery(我假设您正在使用它,因为它是 Kendo UI 的要求):
function loginClick() {
var username = $("#username").val();
var password = $("#password").val();
var loginUrl = 'http://myurl.co.uk/appqueries/login.php?username='+username+'&password='+password;
$.ajax({
url: loginUrl,
type: 'GET',
dataType: 'json',
success: function (data) {
handleLoginResult(data);
}
});
}
$(document).on("click", "#loginbutton", loginClick);
function handleLoginResult(data) {
var status = data.status;
var message = data.message;
if (status === "success") {
// do whatever needs to be done after successful login
$("#loginresult").html(message);
}
}
请参阅此处的工作示例(有一些差异,因为这是使用 jsfiddle 的 echo api):http://jsfiddle.net/lhoeppner/9TGJd/
这对于 Kendo Mobile 几乎相同,只是您需要使用移动按钮和数据点击绑定(bind):
<a id="loginbutton" data-role="button" data-click="loginClick">Login!</a>
关于javascript - Kendo UI 登录功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19227238/