无法使用ajax将值传递给Codeigniter控制器

Cannot pass value to Codeigniter controller using ajax

本文关键字:Codeigniter 控制器 值传 ajax      更新时间:2023-09-26

我在使用ajax将值从输入元素发送到Codeigniter控制器时遇到问题。

由于我必须使用所见即所得编辑器(summernote),因此我只能在<script>中接收输入。然而,当我按下提交按钮时,它只是重新加载当前页面,而不是控制器中的页面。这是我的代码:

PHP视图

<section id="mainContent">    
    <form method="post">
        <input type="text" id="textbox" class="editor" name="textbox">
        <input id="submit_btn" type="button" name="sutmit" value="submit" onclick="myFunction()">
    </form>
</section>
<script type="text/javascript">
    function myFunction() {
        var markupStr = $('#textbox').summernote('code');
        alert(markupStr);
        $.ajax({
            type : 'POST',
            url : "<?= site_url().'cintern/save'; ?>",
            async : false,
            data : {'iDes': markupStr},
            success : function(data){
                alert("Success!");
            }
        });
        return false;
    };
</script>

PHP控制器

public function save() 
    {
        $session_data = $this->session->userdata('logged_in');
        $data['id'] = $session_data['idlogin'];
        $data['role'] = $session_data['role'];
        $data['pageTitle'] = 'Success';
        $data['iDes'] = $this->input->post('iDes');
        $this->load->view('templates/header', $data);
        $this->load->view('internship/success', $data);
        $this->load->view('templates/footer');
    }

请帮忙!提前谢谢。

您应该使用<form>标记的onsubmit

<section id="mainContent">    
  <form method="post" onsubmit="myFunction()">
    <input type="text" id="textbox" class="editor" name="textbox">
    <input id="submit_btn" type="button" name="sutmit" value="submit">
  </form>
</section>

原因是,如果您处理<input type="submit">onclick,则在提交数据后无法拦截<form>标签的请求。

我希望这能帮助你。

由于您使用JQuery进行ajax,我建议您也使用它来捕获提交。

删除内联onclick分配。给表单一个id属性。

<section id="mainContent">    
    <form method="post" id="target">
        <input type="text" id="textbox" class="editor" name="textbox">
        <input id="submit_btn" type="button" name="sutmit" value="submit">
    </form>
</section>

myfunction()转换为"提交"事件处理程序

<script type="text/javascript">
$("#target").submit(function (event) {
  var markupStr = $('#textbox').summernote('code');
  //stop the normal submit from happening
  event.preventDefault();
  $.ajax({
    type: 'POST',
    url: "<?= site_url().'cintern/save'; ?>",
    async: false,
    data: {'iDes': markupStr},
    success: function (data) {
      //do stuff with data then redirect to 'after_save' 
      console.log(data.results, data.otherstuff);
      window.location.href = "http://example.com/cintern/after_save";
    }
  });
});
</script>

控制器:

public function save() 
{
   $data = $this->input->post(NULL, TRUE);
   // $data is now a semi-sanitized version of $_POST
   $_SESSION['iDes'] = $data['iDes'];
   //do other stuff with $data
   echo json_encode(['results' => "success", 'otherstuff' => $foo]);
}
  public function after_save()
  {
    $session_data = $this->session->userdata('logged_in');
    $data['id'] = $session_data['idlogin'];
    $data['role'] = $session_data['role'];
    $data['pageTitle'] = 'Success';
    $data['iDes'] = $session_data['iDes'];
    $this->load->view('templates/header', $data);
    $this->load->view('internship/success', $data);
    $this->load->view('templates/footer');
  }