AJAX Codeigniter获取模态数据

Question

我已经使用CodeIgniter已有一段时间了，我正在尝试使用一种模式。我正在使用引导程序库，因此模型本身很容易显示。问题是我正在尝试使用ajax从数据库中加载动态信息。但是我似乎无法触发它。我的脚本没有任何作用，我已经尝试了很长时间。

 function fun(control){
   $.ajax({
        url:'<?=base_url()?>admin/proveedores/userDetails/'+control.id,
        method: 'post',
        data: {uid: control.id},
        dataType: 'json',
        success: function(response){
         var len = response.length;

         if(len > 0){
          // Read values
          var uname = response[0].razon_social;
          var name = response[0].cuit;
          var email = response[0].rubro;

          $('#suname').text(uname);
          $('#sname').text(name);
          $('#semail').text(email);
 }
</script>

HTML部分

<div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">
          <div >
            Username : <span id='suname'></span><br/>
            Name : <span id='sname'></span><br/>
            Email : <span id='semail'></span><br/>
           </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>

    </div>
  </div>

函数调用

<tr id="<?= $e['id'] ?>" onclick="fun(this)" data-toggle="modal" data-target="#myModal" >

控制器

public function userDetails($cid){
        // POST data
        //  $postData = $this->input->post();

          // get data
          $data = $this->model_proveedores->get($cid);

          echo json_encode($data);
    }

Answer 1

我认为这将对您有所帮助。请将模式内容保留在ID为[[myModal的div内，并在模式显示动作中调用ajax。

模态

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        // your modal content
    </div>
</div>

呼叫按钮

<tr data-id="<?= $e['id'] ?>" data-toggle="modal" data-target="#myModal">

脚本

var modal = $("#myModal");
modal.on('show.bs.modal', function (event) {
    var button = $(event.relatedTarget);
    var id      = button.data('id'); 

    $.ajax({
        url      : '<?= base_url() ?>admin/proveedores/userDetails/'+id,
        type     : 'post',
        dataType : 'json',
        data     : { uid: id},
        success  : function(response)
        {
            var len = response.length;

            if(len > 0){
                // Read values
                var uname = response[0].razon_social;
                var name = response[0].cuit;
                var email = response[0].rubro;

                $('#suname').text(uname);
                $('#sname').text(name);
                $('#semail').text(email);
            }
        },
        error    : function(xhr)
        {
            console.log(xhr)
        }
    });
});