Question

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代码。

Answer 1

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

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

将type指定为POST，您就可以发出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;
}

Answer 2

事实上，正如您所提到的type: "GET"，您正在提出'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;
})

Answer 3

我知道这里没有工作。

使用

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错误

Answer 4

首先你要使用$ _POST。使用$ this-＆gt; input-＆gt; post（'var'）或get。其次你没有返回json数据。请改用它。

$.ajax(’url’).done(function(data){
$(’#message’).html(data);
 })

Answer 5

您是否尝试过检查确切的回调数据？我不亲自构造一个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

这段代码对我很有帮助。希望它有所帮助。

Answer 6

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');

}）; }

Ajax post方法在codeigniter中不起作用

6 个答案: