使用jquery進行模式確認的頁面刷新

Question

我有一個AJAX函數可以從數據庫中刪除記錄。我的問題是一旦數據被刪除，它就停留在刪除URL上。相反，我想將其重定向到我的列表頁面。我應該如何更改我的JavaScript代碼。

然後我的腳本：

<script> 
function confirm_modal(delete_url,title) 
    { 
     jQuery('#modal_delete_m_n').modal('show', {backdrop: 'static',keyboard :false}); 
     jQuery("#modal_delete_m_n .grt").text(title); 
     document.getElementById('delete_link_m_n').setAttribute("href" , delete_url); 
     document.getElementById('delete_link_m_n').focus(); 
    } 
    </script> 

我與模態HTML頁面：

<div id="container"> 
<div id="wrapper"> 
    <?php 
    if (isset($success_message)) { 
      echo $success_message; 
     } 
?> 
<h1>Staff List </h1><hr/> 
<div id="menu"> 
<table> 
<tr> 
<th>Name</th> 
<th>Designation</th> 
<th>Delete</th> 
</tr> 
<?php if(isset($result_set)): 
    foreach ($result_set as $username): ?> 
    <tr> 

    <td><?php echo $username->user_name; ?></td> 
    <td><?php echo $username->designation; ?></td> 
    <td><a href="" class="btn btn-danger" data-toggle="modal"  onclick="confirm_modal('<?php echo "delete_staff/".$username->staff_id;? >','Account');" data-target="#myModal">Delete</a></td> 
    </tr> 


<?php endforeach; 
else: echo "No Results Available"; 
endif; 
?> 
</table> 
</div> 

<div class="modal fade" id="modal_delete_m_n" data-backdrop="static" data-keyboard="false"> 
     <div class="modal-dialog"> 
      <div class="modal-content" style="margin-top:100px;"> 

       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
        <h4 class="modal-title" style="text-align:center;">Are you sure to Delete this <span class="grt"></span> ?</h4> 
       </div> 

       <div class="modal-footer" style="margin:0px; border-top:0px; text-align:center;"> 
        <span id="preloader-delete"></span> 
        </br> 
         <a class="btn btn-danger" id="delete_link_m_n" href="">Delete</a> 
        <button type="button" class="btn btn-info" data-dismiss="modal" id="delete_cancel_link">Cancel</button> 

       </div> 
      </div> 
     </div> 
    </div> 

Answer 1

在代碼上的結構工作。在confirm_modal()函數中，您正在使用Javascript混合jQuery。最好保持一切。

當您更換

document.getElementById('delete_link_m_n').setAttribute("href" , delete_url); 
document.getElementById('delete_link_m_n').focus(); 

與

jQuery('#delete_link_m_n').attr("href" , delete_url); 
jQuery('#delete_link_m_n').focus(); 

功能將成爲

function confirm_modal(delete_url,title) 

    // About the modal itself 
    jQuery('#modal_delete_m_n').modal('show', {backdrop: 'static',keyboard :false}); 
    jQuery("#modal_delete_m_n .grt").text(title); 

    // About the delete button 
    jQuery('#delete_link_m_n').attr("href" , delete_url); 
    jQuery('#delete_link_m_n').focus(); 

    // Prevent page refreshing 
    return false; 
} 

一點題外話，

<?php echo "delete_staff/".$username->staff_id;? > 

在?和>之間不應有空格。

還要確保jQuery加載正確，如果沒有，控制檯中會出現錯誤。最後一件事，這段代碼中沒有涉及AJAX。您只需更新href即可將用戶重定向到其他頁面。