如何从javascript调用控制器函数

Question

使用 mvc 和 codeigniter 创建 Web 应用。在视图中，单击按钮会调用 javascript 方法。此方法应将 3 张图像的来源作为参数，并将它们传递给控制器​​方法。然后，控制器方法将它们转换为单个 $record 并将其传递给模型中的函数，该函数随后会将记录内容插入数据库。

查看按钮：

<input type="submit" class="btn btn-primary" value="Assemble bot" onclick="insertAssembled()"></input>

Javascript 函数：

function assemble(var head, var body, var legs) {
    var head = document.getElementById("HeadImage".src);
    var body = document.getElementById("BodyImage".src);
    var legs = document.getElementById("FeetImage".src);
    // call controller function here, passing head body and legs
}

控制器方法：

    public function insertAssembled($head, $body, $legs) {
        //Build record and send to saveBot       
        $record['id'] = 1;
        $record['head'] = $head;
        $record['body'] = $body;
        $record['legs'] = $legs;
        $this->Robotsdata->saveBot($record);
   }

模型方法（很粗略，传参不​​需要帮忙）：

public function saveBot($record) {
    $con = mysql_connect("localhost","root@localhost","");
    mysql_select_db("factory", $con);
    $bot_id = $_POST['id'];
    $bot_head = $_POST['head'];
    $bot_body = $_POST['body'];
    $bot_legs = $_POST['legs'];
    $query = "INSERT INTO `factory`.`assembledbots` ('id', 'head', 'body', 'legs') "
            . "VALUES ('$bot_id', '$bot_head', '$bot_body', '$bot_legs');";
    mysql_query($query);
    mysql_close($con);
}

Answer 1

如果您已包含 jQuery 库，您可以尝试使用 ajax 传递数据：

$.ajax({
    url: 'Path/To/YourController.php',
    type: 'POST',
    dataType: 'text',
    data: {
        head: head, //You'll get it with $_POST['head']
        body: body, //You'll get it with $_POST['body']
        legs: legs  //You'll get it with $_POST['legs']
    },
})
.done(function(data) {
    // Do what you want in case of success
})
.fail(function(err) {
    //Do what you want incase of error
});

Answer 2

您可以通过使用 ajax 来实现这一点。此外，在您的模型中，尝试使用 CI 的查询生成器类（活动记录），这样您的查询是安全的并避免 SQL 注入。

javascript

function assemble(var head, var body, var legs) {
   var head = document.getElementById("HeadImage".src);
   var body = document.getElementById("BodyImage".src);
   var legs = document.getElementById("FeetImage".src);

   //ajax
   //you post variables
   var fields = {
      head  : head,
      body  : body,
      legs  : legs,
      submit_a: true
   };

   $.ajax({
     url: 'domain/controller/insertAssembled',
     type: 'POST',
     data: fields,
     dataType:'JSON',
     success: function(result){
        console.log(result);
     }
   });
}

控制器

public function insertAssembled() 
{

  if ($this->input->is_ajax_request()) { // just additional, to make sure request is from ajax
    if ($this->input->post('submit_a')) {
        $record['id'] = 1;
        $record['head'] = $this->input->post('head');
        $record['body'] = $this->input->post('body');
        $record['legs'] = $this->input->post('legs');

        // to model
        $this->Robotsdata->saveBot($record);

        // return to view
        echo json_encode(array("error"=>false));
        return false;
    }
  }
}

型号

public function saveBot($record) 
{
  if ($record) {

    $save_fields = array(
        'id'   => $record['id'],
        'head' => $record['head'],
        'body' => $record['body'],
        'legs' => $record['legs']
    );
    $this->db->insert('table_name', $save_fields);

    return true;
  }
  return false;
}