これは私のmain.jsファイルの内容です:
$("#login-form").submit(
function() {
$("#message").removeClass().addClass('messagebox').html(
'<img src="public/images/loading.gif" />Validating....').fadeIn(1000);
$.post("login/run", {
username : $('#username').val(),
password : $('#password').val()
}, function(data) {
if (data == 'yes') {
// add message and change the class of the box and start
// fading
$("#message").fadeTo(
200,
0.1,
function() // start fading the messagebox
{
$(this).html('Logging In...').addClass(
'messageboxok').fadeTo(900, 1,
function() {
// redirect to secure page
document.location = 'secure.php';
});
});
} else {
alert(data);
$("#message").fadeTo(
200,
0.1,
function() // start fading the messagebox
{
// add message and change the class of the
// box and start fading
$(this).html('Your username or password is incorrect')
.addClass('messageboxerror')
.fadeTo(900, 1);
});
}
});
return false;
}
);
これは、それが参照する関数です (現在、肯定的な結果を強制するために、常に yes をエコーするように設定されています)
public function run() {
echo 'yes';
}
私が抱えている問題は、アラート(データ)を実行するときです。アラートは、取得している出力が正しいことを示していますが、データがyesであってもIF関数はELSE部分のみを実行しています。
もう 1 つの紛らわしい部分は、昨夜寝る前にこのコードが正常に機能していたことですが、今は機能していません。
私の構文にどこかに問題がありますか?
編集 1
変更: , 'json'を $.post 領域の末尾に追加し、 json_encodeを echo に追加しました
main.js へ:
//login form ajax
$("#login-form").submit(
function() {
$("#msgbox").removeClass().addClass('messagebox').html(
'<img src="public/images/loading.gif" />Validating....').fadeIn(1000);
$.post("login/run", {
username : $('#username').val(),
password : $('#password').val()
}, function(data) {
if (data == 'yes') {
// add message and change the class of the box and start
// fading
$("#msgbox").fadeTo(
200,
0.1,
function() // start fading the messagebox
{
$(this).html('Logging In...').addClass(
'messageboxok').fadeTo(900, 1,
function() {
// redirect to secure page
document.location = 'secure.php';
});
});
} else {
alert(data);
$("#msgbox").fadeTo(
200,
0.1,
function() // start fading the messagebox
{
// add message and change the class of the
// box and start fading
$(this).html('Your username or password is incorrect')
.addClass('messageboxerror')
.fadeTo(900, 1);
});
}
}, 'json');
return false;
});
//end login form ajax
および次の関数:
public function run() {
echo json_encode('yes');
}
編集 2
$.ajax に変更し、関数が JSON エンコードされた配列を返すようにしました
main.js:
$("#login-form").submit(
function() {
$("#msgbox").removeClass().addClass('messagebox').html(
'<img src="public/images/loading.gif" />Validating....').fadeIn(1000);
$.ajax({
url: 'login/run',
dataType: 'json',
type: 'POST',
data: {
username : $('#username').val(),
password : $('#password').val()
},
success: function(data){
alert(data.result);
if (data.result == 'yes') {
// add message and change the class of the box and start
// fading
$("#msgbox").fadeTo(
200,
0.1,
function() // start fading the messagebox
{
$(this).html('Logging In...').addClass(
'messageboxok').fadeTo(900, 1,
function() {
// redirect to secure page
document.location = 'secure.php';
});
});
} else {
alert(data);
$("#msgbox").fadeTo(
200,
0.1,
function() // start fading the messagebox
{
// add message and change the class of the
// box and start fading
$(this).html('Your username or password is incorrect')
.addClass('messageboxerror')
.fadeTo(900, 1);
});
}
//return false;
}
});
return false;
});
関数:
public function run() {
$result = array('result' => 'yes');
echo json_encode($result);
}