1

Ajax 帖子在我的代码中不起作用我不知道原始代码(控制器代码)的确切问题请帮助我

class Ajax_post extends CI_Controller {

function __construct()
{
parent::__construct();  
$this->load->helper(array('url'));
}

function index()
{

$this->load->view('ajax_post');
}

function post_action()
{

if(($_POST['username'] == "") || ($_POST['password'] == ""))
{
  $message = "Please fill up blank fields";
  $bg_color = "#FFEBE8";

}elseif(($_POST['username'] != "myusername") || ($_POST['password'] != "mypassword")){
  $message = "Username and password do not match.";
  $bg_color = "#FFEBE8";

}else{
  $message = "Username and password matched.";
  $bg_color = "#FFA";
}

$output = '{ "message": "'.$message.'", "bg_color": "'.$bg_color.'" }';

}
}

?>

这是我的查看页面代码

    <div id="form_message"></div>
    <form name="ajax_form" id ="ajax_form" method="post">

      Username/Email:*<input type="text" name="username" id="username" size="30" /><br/><br/>
      Password:*<input type="password" name="password" id="password" size="30" /><br/><br/>
      <input type="submit" value="Submit" name="login_submit" id="login_submit" onClick="getData();"/>

  </form>
</div>

这是我的 javascript 代码 (ajax_post.js)

  function getData(){

    var username=$("#username").val();
    var password=$("#password").val();      
    $.ajax({
    type: "GET",
    url: "http://localhost/CodeIgniter/index.php/ajax_post/post_action",
    dataType: "json",
    data: "username="+username+"&password="+password,
    cache:false,
    success: 
      function(data){
          alert(data);
          }
     // $("#form_message").html(data.message).css({'background-color' : data.bg_color}).fadeIn('slow'); 


});
}
 </body>

我整天坚持这件事..

请任何人告诉我做控制器和js代码的正确方法。

4

6 回答 6

3

您没有发出 POST 请求,请尝试

$.ajax({
    type: "POST", //notice the change

通过指定typeasPOST您将能够发出 POST 请求

或者你可以使用$.post

这是链接到$.ajax

编辑

单击提交按钮时,您需要取消表单提交的默认行为,例如

function getData() {
  var username = $("#username").val();
  var password = $("#password").val();
  $.ajax({
    type:"POST",
    url:"http://localhost/CodeIgniter/index.php/ajax_post/post_action",
    dataType:"json",
    data:{username:username,password:password},
    cache:false,
    success:function (data) {
      alert(data);
    }  
  });
 return false;
}
于 2012-06-16T11:40:57.797 回答
2

事实上,正如您所提到的,您正在发出“GET”请求type: "GET"。这是您修改后的js代码。

function getData() {
  var username = $("#username").val();
  var password = $("#password").val();
  $.ajax({
    type:"POST",
    url:"http://localhost/CodeIgniter/index.php/ajax_post/post_action",
    dataType:"json",
    data:"username=" + username + "&password=" + password,
    cache:false,
    success:function (data) {
      alert(data);
    }
    // $("#form_message").html(data.message).css({'background-color' : data.bg_color}).fadeIn('slow');
  });
}

编辑:尝试以下代码。从提交按钮中删除 onclick 属性及其值

$('#ajax_form').submit(function(){
  var username = $("#username").val();
  var password = $("#password").val();
  $.ajax({
    type:"POST",
    url:"http://localhost/CodeIgniter/index.php/ajax_post/post_action",
    dataType:"json",
    data:"username=" + username + "&password=" + password,
    cache:false,
    success:function (data) {
      alert(data);
    }
    // $("#form_message").html(data.message).css({'background-color' : data.bg_color}).fadeIn('slow');
  });
  return false;
})
于 2012-06-16T11:41:40.443 回答
1

我看到什么在这里不起作用。

利用

onClick="getData(); return false;" // in your submit button

或者

function getData(e){
e.preventDefault();
//your code

或者

success: 
  function(data){
      alert(data);
return false;
      }
error : function(){
return false;
}
//stops the default dom form submission after success

确保已加载 jquery!

并确保如果您使用其他 javascripts 任何功能都没有错误,请使用控制台窗口查看 js 错误

于 2012-06-18T07:09:20.097 回答
0

function getData(){

var username=$("#username").val();
var password=$("#password").val();      
$.ajax({
type: "POST",
url: "http://localhost/CodeIgniter/index.php/ajax_post/post_action",
dataType: "json",
data: {username : username , password :password},
cache:false,
success: 
  function(data){
      alert(data);
      }
 // $("#form_message").html(data.message).css({'background-color' : data.bg_color}).fadeIn('slow'); 

}); }

于 2014-05-04T14:10:32.550 回答
0

首先,您使用的是 $_POST。使用 $this->input->post('var') 或获取。其次,您没有返回 json 数据。改用这个。

$.ajax(’url’).done(function(data){
$(’#message’).html(data);
 })
于 2012-06-16T11:46:09.443 回答
0

您是否尝试过检查确切的回调数据?我不亲自构造一个 json 字符串。您可以尝试制作一组​​数据

$data = array();
$data['message'] = //assign here ;
$data['bg_color'] = //assign here ;

然后使用 json_encode 进行输出。

echo json_encode($data);

该代码将为您生成 json 字符串。您可以像这样轻松地在 js 回调中获取数据

data.message
data.bg_color

这段代码对我帮助很大。希望能帮助到你。

于 2012-06-16T14:47:53.113 回答