无法使用 ajax 和 jquery 从数据表中删除行 [ajax 调用无效]

Question

我尝试使用 jquery 和 ajax 从 data-table 中删除一行。即使它在模式中显示确认消息，但 ajax 调用不起作用我还附上了控制台和代码的图像我正在使用 CodeIgniter 框架，所以我还附加了模型和控制器。控制器的代码是-

public function delete(){

$record['id'] = $this->input->post('id');
if($this->Educational_qualification_model->Delete($record['id'])){

  echo json_encode(array( 
                         "Status" =>1                               
                        )); 
       }else{

echo json_encode(array( 
                         "Status" =>0                               
                       ));}}

模型代码是-

public function Delete($id){     
    $this->db->where('id', $id);
    $this->db->delete('educational_qualification');
    return 1;}

jquery 的代码是-

 function deleteQualification(Id){
$("#deleteAlertBox").modal('show');
$('#deleteMessageHeading').html('Delete this qualification information?');
 $('#deleteMessageText').html("Are you sure you want to delete this qualification information?");
    $("#deleteMessageButton").on("click", function () {

   $("#deleteAlertBox").modal('hide');
   $("#Loading").show();
   $.ajax({
       type: 'post',
       url: BASE_URL + 'dashboard/educational_qualification/delete',
       data: {
           'id': Id
       },

      dataType: "json",
                success: function (data) {

                            if(data.Status){

                            $("#messageModal").modal('show');
                            $("#messageBox").html('<p>Qualification information deleted successfully.</p>');
                            $('#item' + Id).remove();
                            $("#Loading").hide();

                            }else{

                            $("#messageModal").modal('show');
                            $("#messageBox").html('<p>Sorry,something went wrong.Try again after sometime.</p>');
                            $("#Loading").hide();  

                            }
                },
                error: function () {

                            $("#messageModal").modal('show');
                            $("#messageBox").html('<p>Sorry,something went wrong.Try again after sometime.</p>');
                            $("#Loading").hide();
                            }
   });
    });
 }

视图的代码是-

    <div class="row"> 
                 <div class="span6">
                 <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
          <h3><a href="#">Example article with thumbnail image</a></h3>
          </div></div>
            <div class="span2">
                 <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
           <a href="<?php echo base_url()."dashboard/educational-qualification/add"; ?>"> <button class="btn btn-small btn-success" type="button">Add Qualification</button></a>
        </div></div>
        </div></div>
        <div class="row">
        <div class="span8">
        <span id="Loading" style="display:none;padding-left:10px;"><img src="<?php echo base_url(); ?>assets/admin/input-spinner.gif"> Please wait...processing</span>

        </div>
        </div>
        <div class="row">

          <div class="span8">
          <table id="mytable" class="stripe" style="width:100%">
    <thead>
        <tr>
            <th>Id</th>
            <th>Year</th>
            <th>Class</th>
            <th>School</th>
            <th>Board</th>
            <th>Percentage</th>
            <th>Tools</th>
        </tr>
    </thead>
    <tbody>
    <?php
    foreach($contentdata as $rows){ 
               ?>
               <tr class="odd gradeX" align="center" id="item<?php echo $rows['id']; ?>">
                 <td>&emsp;&emsp;&emsp;<?php echo $rows['id']; ?></td>
                 <td>&emsp;&emsp;&emsp;<?php echo $rows['year']; ?></td>
                 <td>&emsp;&emsp;&emsp;<?php echo $rows['class']; ?></td>
                 <td>&emsp;&emsp;&emsp;<?php echo $rows['school']; ?></td>
                 <td>&emsp;&emsp;&emsp;<?php echo $rows['board']; ?></td>
                 <td>&emsp;&emsp;&emsp;<?php echo $rows['percentage']; ?></td>
               <td align="center">




                <div>

                <a title="Update" href="<?php echo base_url()."dashboard/educational-qualification/edit/".$rows['id'];?>"><i class="fa fa-edit"></i> </a>



                <a title="Delete" onclick="deleteQualification('<?php echo $rows['id'];?>')"  href="javascript:;" > <i class="  fa fa-trash-o"> </i> </a>

           </div>



                </td> </tr>
    <?php } ?>    
    </tbody>
    <tfoot>
        <tr>
        <th>Id</th>
            <th>Year</th>
            <th>Class</th>
            <th>School</th>
            <th>Board</th>
            <th>Percentage</th>
            <th>Tools</th> 
        </tr>
    </tfoot>
</table>
          </div>
        </div>
      </article>

如有任何帮助，我们将不胜感激。

Answer 1

在您的 $.ajax 调用中，您正在传递 BASE_URL。所以你需要定义 BASE_URL 这是你的 api 主机，比如 localhost:3000.

BASE_URL = 'localhost:3000';

你的 url 会像 url: BASE_URL + '/dashboard/educational_qualification/delete'

Answer 2

在您的视图中定义您的 BASE_URL。

<script>
     BASE_URL = "<?php echo base_url(); ?>";
</script>

然后编辑代码并从 js 文件中的代码中删除此 $("#deleteMessageButton").on("click", function () {});

    function deleteQualification(Id){
$("#deleteAlertBox").modal('show');
$('#deleteMessageHeading').html('Delete this qualification information?');
 $('#deleteMessageText').html("Are you sure you want to delete this qualification information?");    
   $("#deleteAlertBox").modal('hide');
   $("#Loading").show();
   $.ajax({
       type: 'post',
       url: BASE_URL + 'dashboard/educational_qualification/delete',
       data: {
           'id': Id
       },

      dataType: "json",
        success: function (data) {
            if(data.Status){
                $("#messageModal").modal('show');
                $("#messageBox").html('<p>Qualification information deleted successfully.</p>');
                $('#item' + Id).remove();
                $("#Loading").hide();
            }else{
                $("#messageModal").modal('show');
                $("#messageBox").html('<p>Sorry,something went wrong.Try again after sometime.</p>');
                $("#Loading").hide();  
            }
        },
        error: function () {
            $("#messageModal").modal('show');
            $("#messageBox").html('<p>Sorry,something went wrong.Try again after sometime.</p>');
            $("#Loading").hide();
        }
   });
 }

无法使用 ajax 和 jquery 从数据表中删除行 [ajax 调用无效]

Unable to delete a row from datatable using ajax and jquery [ajax call not working]

ajax

datatable

jquery

codeigniter

delete-row