如何在確認彈出窗口後使用ajax/jquery發佈數據

Question

當彈出確認消息並且用戶單擊確定時，我想從窗體中的隱藏輸入類型發送一個id。現在我甚至不能在沒有確認彈出框的情況下編碼，沒有錯誤，只是刷新而沒有任何反應。您可能會想，爲什麼我需要確認將商品添加到購物車中，但這是因爲我還需要稍後從數據庫中刪除商品。

<script src="http://code.jquery.com/jquery-latest.js"></script> 
<script type="text/javascript"> 

$(document).ready(function(){ 
$('#add').click(function(){ 
var id = $("#get_id").val() 

$.confirm({ 
     'title'  : 'Delete Confirmation', 
     'message' : 'You are about to delete this User.Continue?', 
     'buttons' : { 
      'Yes' : { 

       'action': function(){$a.ajax({ 
url: 'http://localhost/com/index.php/shopping_basket/view_basket', 
type: 'POST', 
data: { id: id }, 
    success: (function(){ 
    alert('added' + id); 

}); 
       } 


      }, 
      'No' : { 

       'action': function(){} // Nothing to do in this case. You can as well omit the action property. 
      } 
     } 
    }); 

}); 
}); 
</script> 

形式

<form id="basket" method="post" action=""> 
<input type="hidden" id="get_id" value="<?php echo $id ?>"> 
<input type="submit" id="add" value="Add"> 
</form> 

順便說一句什麼在使用window.location.href送東西，而不是這有什麼區別？

Answer 1

<?php $id ?>將不包含任何沒有echo - 作爲Ruler指出的，你忘了反正它命名爲：

<input type="hidden" name="whatsmyname" value="<?php echo $id ?>"> 

此外，你需要一個submit處理程序添加到形式，而不是一個click處理程序，並取消其正常行爲：

$('#basket').on('submit',function(e){ 
    e.preventDefault(); // prevents the form from submitting normally 
    $a.ajax({ 
     url: 'http://localhost/com/index.php/cart/add_cart', 
     type: 'POST', 
     data: { id: id }, // this comma was missing 
     success: (function(){ 
      alert('added' + id); 
     }); 
    }); 
}); 

Answer 2

有很多事情要做。

1）把echo這裏

<input type="hidden" value="<?php echo $id ?>"> 

2）爲元素提供名稱。那麼只有你可以訪問任何地方

<input type="hidden" name="id" id="id" value="<?php echo $id ?>"> 

3）另外，在jQuery的，有什麼用變量id的。你從哪裏得到它？補充一點..

var id = $("#id").val(); 
$a.ajax({ 
    url: 'http://localhost/com/index.php/cart/add_cart', 
    type: 'POST', 
    data: { id: id } 
     success: (function(){ 
     alert('added' + id); 

}); 

4）最後，您能不能給表單元素單擊功能，將其更改爲submit()

Answer 3

試試這個：

下載JS文件 http://www.bvbcode.com/code/5ytvmx8r-879020-down

jquery.confirm.js

<script src="http://code.jquery.com/jquery-latest.js"></script> 
<script src="jquery.confirm.js"></script> 
$(document).ready(function(){ 
$('#add').click(function(){ 
var id = $("#get_id").val() 

$.confirm({ 
      'title'  : 'Delete Confirmation', 
      'message' : 'You are about to delete this User.Continue?', 
      'buttons' : { 
       'Yes' : { 

        'action': function(){$a.ajax({ 
    url: 'http://localhost/com/index.php/cart/add_cart', 
    type: 'POST', 
    data: { id: id } 
     success: (function(){ 
     alert('added' + id); 

    }); 
        } 


       }, 
       'No' : { 

        'action': function(){} // Nothing to do in this case. You can as well omit the action property. 
       } 
      } 
     }); 

}); 
}); 
<form id="basket" method="post" action=""> 
<input type="hidden" id="get_id" value="<?php echo $id ?>"> 
<input type="submit" id="add" value="Add"> 
</form>