php 使用带有 Codeigniter 的 AJAX 和 jquery 将表单数据传递给控制器

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/21004315/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-25 03:44:25  来源:igfitidea点击:

Passing form data to controller using AJAX and jquery with Codeigniter

phpjqueryajaxdatabasecodeigniter

提问by user2796352

I am trying to post the data from this form into the database. I have tried some tutorials with no success. Here is my code. Any ideas?

我正在尝试将此表单中的数据发布到数据库中。我尝试了一些教程但没有成功。这是我的代码。有任何想法吗?

View:

看法:

<form method="post" name="myForm1" id="myForm1" enctype="multipart/form-data" >
Email: <input type="text" name="email" id="email">
Question: <input type="text" name="qText" id="qText">
<input id="submitbutton" type="submit">
</form>

AJAX (in the view, right below the form)

AJAX(在视图中,表单正下方)

<script type='text/javascript' language='javascript'>

$("#submitbutton").click(function(){


$.ajax({
       url:'http://localhost:8888/index.php/trial/insert_into_db',
       type: 'POST',
       data: $("#myForm1").serialize(),
       success: function(){
           alert("success");
       },
       error: function(){
           alert("Fail")
       }
   });
   e.preventDefault();
});


</script>

Controller

控制器

  function insert_into_db(){
    $this->load->model('insert_db');
    $this->insert_db->insertQ();  
}

Model

模型

 class Insert_db extends CI_Model{

    function insertQ(){
        $email = $_POST['email'];
        $qText = $_POST['qText'];
        $this->db->query("INSERT INTO questions VALUES('','$email','$qText','','')");
    }
 }

回答by Damien Pirsy

As @David Knipe already said, you should wait for the DOM to be ready before trying to access one of its elements. Moreover, you likely have an eis undefined error, since you're not passing the event reference to the click handler:

正如@David Knipe 已经说过的,在尝试访问其中一个元素之前,您应该等待 DOM 准备就绪。此外,您可能有一个e未定义的错误,因为您没有将事件引用传递给点击处理程序:

<script>   //no need to specify the language
 $(function(){
  $("#submitbutton").click(function(e){  // passing down the event 

    $.ajax({
       url:'http://localhost:8888/index.php/trial/insert_into_db',
       type: 'POST',
       data: $("#myForm1").serialize(),
       success: function(){
           alert("success");
           $('#email').val('');
           $('#qText').val('');
       },
       error: function(){
           alert("Fail")
       }
   });
   e.preventDefault(); // could also use: return false;
 });
});
</script>

To be more complete, your query is vulnerable, and you might be getting an error there. Make use of the advantage of having a framework beneath you:

更完整地说,您的查询很容易受到攻击,并且您可能会在那里遇到错误。利用在您之下有一个框架的优势:

function insertQ(){
    $email = $this->input->post('email');
    $qText = $this->input->post('qText');
    $this->db->insert('questions', array('email' =>$email, 'text' => $text));
}

^_I'm guessing the column names since you didn't specify them

^_我在猜测列名,因为您没有指定它们

回答by David Knipe

Looks like you've forgotten to use $.ready. As it is, the javascript runs before the page has loaded, which means it can't find the page element from $("#submitbutton"). Try this:

看起来您忘记使用$.ready. 实际上,javascript 在页面加载之前运行,这意味着它无法从$("#submitbutton"). 尝试这个:

$(document).ready(function() {
    $("#submitbutton").click(function(){
    ....
    ....
});