如何将锚标签的data-id值传递给Code-Igniter控制器功能并以数据模式显示结果？

Question

I'm working on Code-Igniter project and I'm trying to show data on click event of anchor tag. For that I'm passing data-index value using AJAX to Controller and to Model . After that I'm getting result, but the result is not shown in modal-box .

Here is my Code:

View:

<a id="propDetail" name="propDetail" data-toggle="modal" 
    data-index="<?= $property->property_id; ?>" 
    title="Details of <?= $property->property_code; ?>" 
    data-target="#myModal" class="open-Details">
    <?= $property->property_code; ?>
</a>

AJAX Code:

<script type="text/javascript">
$('.open-Details').click(function() {
    $.ajax({
      url : '<?= base_url(); ?>property',
      data: {
        propDetail: $(this).data("index")
      },
      type: "POST",
      success: function(data) {
        console.log('success');
        console.log(data);
      }
    });
  });
</script>

I'm putting the value in variable in controller.

Controller Code:

public function index()
    {   

        $user = $this->ion_auth->user()->row();
        $data['username'] = $user->username;
        $data['user_id'] = $user->id;

        $id=$this->input->post('property_id');
        $area=$this->input->post('area_id');
        $cluster=$this->input->post('cluster_id');
        if( $area =='') {
            $area =0;
        }
        if($cluster == ''){
            $cluster=0;
        }

        $propDetail = $this->input->post('propDetail');

        $data['areas'] = $this->p->area();
        $data['clusters'] = $this->p->cluster();
        //$data['clusters'] = $this->p->clusterAll($area);
        $data['title'] = 'Property List';

        $data['properties'] = $this->p->getPropertyByAreaCluster($area, $cluster);
        $data['propDetails'] = $this->p->defectsView($propDetail);

        $this->load->view('template/header', $data);
        $this->load->view('Property/property_view', $data);
        $this->load->view('template/footer');
    }

Model Code:

public function defectsView($propDetail)
   {
        $query = $this->db->query("call modalView(?)", $propDetail);
        if ($query) {
            $data = $query->result();
            $query->next_result(); 
            $query->free_result();
            return $data;
        } else {
            return false;
        }
   }

I'm getting result if I'm passing hard coded value to the procedure (I'm using Stored Procedure).

Here is my Modal view:

<div class="modal fade displaycontent" id="myModal">
  <div class="modal-dialog" id="propertyDetails" role="document">
    <div class="modal-content displaycontent">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
        <h4 class="modal-title">Property Datails of</h4>
      </div>
      <div class="modal-body">
        <table class="table table-striped ">
          <tbody>
            <?php if($propDetails) { 
              foreach ($propDetails as $propDetail) { ?> 
              <tr>
                <td>Property Code:</td>
                <td><?= $propDetail->property_code; ?></td>
              </tr>
              <tr>
                <td>Defect Added DAte :</td>
                <td><?= $propDetail->property_added_date; ?></td>
              </tr>
              <tr>
                <td>Room ASYS No.:</td>
                <td><?= $propDetail->property_ASYS_no;?></td>
              </tr> 
              <tr>
                <td>Address:</td>
                <td><?= $propDetail->property_address_1;?></td>
              </tr> 
              <tr>
                <td>Room Count:</td>
                <td><?= $propDetail->rooms;?></td>
              </tr> 
              <tr>
                <td>Defect Count:</td>
                <td><?= $propDetail->defects;?></td>
              </tr> 
            <?php } } ?>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>

Edit: here is my output:

I'm not getting, where I'm made a mistake. Any kind of help is welcome, Thanks in advance.

Answer 1

Since you are sending response via AJAX, you need to echo the output. Else ajax will get blank the response.

Also depending on how you send the response add dataType in ajax. Eg: is sending html response add dataType:'html' , if sending json response add dataType : 'json'

JS CODE :

<script type="text/javascript">
$('.open-Details').click(function() {
    $.ajax({
      url : '<?= base_url(); ?>property',
      data: {
        propDetail: $(this).data("index")
      },
      dataType :"html"
      type: "POST",
      success: function(data) {
        console.log('success');
        console.log(data);
      }
    });
  });
</script>

PHP CODE :

echo $this->load->view('Property/property_view', $data,true);