削除確認のために機能するスクリプトがあります...
$('document').ready(function(){
$('.ask').jConfirmAction();
});
製品リストの表は下にあります
<?php if(isset($query)){ ?>
<input disabled type="hidden" id="recNum" value="<?php echo $rec ?>"/>
<table id="rounded-corner" summary="2007 Major IT Companies' Profit" width="100%">
<thead>
<tr>
<th scope="col" class="rounded-company"></th>
<th scope="col" class="rounded">Product ID</th>
<th scope="col" class="rounded">Product Name</th>
<th scope="col" class="rounded">Product slug</th>
<th scope="col" class="rounded">Type</th>
<th scope="col" class="rounded">Product Category</th>
<th scope="col" class="rounded">Edit</th>
<th scope="col" class="rounded-q4">Delete</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="7" class="rounded-foot-left"><em>All The Pages That Being Included</em></td>
<td class="rounded-foot-right"> </td>
</tr>
</tfoot>
<tbody>
<?php
foreach($query as $key => $row) {
?>
<tr>
<td><input type="checkbox" name="" /></td>
<td><?php echo $row['product_id'];?></td>
<td><?php echo $row['product_name'];?></td>
<td><?php echo $row['product_slug'];?></td>
<td><?php echo $row['type'];?></td>
<td><img src="<?php echo base_url().$row['product_image'];?>" width="80px" height="80px"/></td>
<td><a href="<?php echo base_url();?>admin.php/products/edit_product/<?php echo $row['product_id'];?>"><img src="<?php echo base_url();?>assets/admin_assets/images/user_edit.png" alt="" title="" border="0" /></a></td>
<td><a href="<?php echo base_url();?>admin.php/products/delete_product/<?php echo $row['product_id'];?>" class="ask"><img src="<?php echo base_url();?>assets/admin_assets/images/trash.png" alt="" title="" border="0" /></a></td>
</tr>
<?php
}?>
</tbody>
</table>
<a href="<?php echo base_url();?>admin.php/products/add_product" class="bt_green"><span class="bt_green_lft"></span><strong>Add new item</strong><span class="bt_green_r"></span></a>
<a href="<?php echo base_url();?>admin.php/products/view_product" class="bt_blue"><span class="bt_blue_lft"></span><strong>View all items from category</strong><span class="bt_blue_r"></span></a>
<a href="#" class="bt_red"><span class="bt_red_lft"></span><strong>Delete items</strong><span class="bt_red_r"></span></a>
jQuery確認用のjqueryは次のとおりです。
/*
* jQuery Plugin : jConfirmAction
*
* by Hidayat Sagita
* http://www.webstuffshare.com
* Licensed Under GPL version 2 license.
*
*/
(function($){
jQuery.fn.jConfirmAction = function (options) {
// Some jConfirmAction options (limited to customize language) :
// question : a text for your question.
// yesAnswer : a text for Yes answer.
// cancelAnswer : a text for Cancel/No answer.
var theOptions = jQuery.extend ({
question: "Are You Sure ?",
yesAnswer: "Yes",
cancelAnswer: "Cancel"
}, options);
return this.each (function () {
$(this).bind('click', function(e) {
e.preventDefault();
thisHref = $(this).attr('href');
if($(this).next('.question').length <= 0)
$(this).after('<div class="question">'+theOptions.question+'<br/> <span class="yes">'+theOptions.yesAnswer+'</span><span class="cancel">'+theOptions.cancelAnswer+'</span></div>');
$(this).next('.question').animate({opacity: 1}, 300);
$('.yes').bind('click', function(){
window.location = thisHref;
});
$('.cancel').bind('click', function(){
$(this).parents('.question').fadeOut(300, function() {
$(this).remove();
});
});
});
});
}
})(jQuery);
すべてがうまく機能し、
次に、リストの ana jax ページネーションを作成しました。
問題は、このタスクの後、jquery の確認が機能しないことです。jquery スクリプトをこのような単純な jquery 関数に変換したい
function ask()
{
}
編集：
私は関数を書いた
function ask(obj)
{
alert('hii');
//var theOptions = jQuery.extend ({
var question= "Are You Sure ?";
var yesAnswer= "Yes";
var cancelAnswer= "Cancel";
//e.preventDefault();
var thisHref = $(obj).attr('href');
alert(thisHref) ;
if($(obj).next('.question').length <= 0)
$(obj).after('<div class="question">'+question+'<br/> <span class="yes">'+yesAnswer+'</span><span class="cancel">'+cancelAnswer+'</span></div>');
$(obj).next('.question').animate({opacity: 1}, 300);
$('.yes').bind('click', function(){
window.location = thisHref;
});
$('.cancel').bind('click', function(){
$(obj).parents('.question').fadeOut(300, function() {
$(obj).remove();
});
});
}
そして、私はこれを呼び出しています
<a href="<?php echo base_url();?>admin.php/products/delete_product/<?php echo $row['product_id'];?>" class="ask" onclick="ask(this);"><img src="<?php echo base_url();?>assets/admin_assets/images/trash.png" alt="" title="" border="0" /></a>
その影響も受けます。しかし、アニメーション効果がリンクにリダイレクトされた直後に、ユーザーがオプションを選択できるようにする必要があります。しかし、私はできません...
MORE EDIT:
わかりました。答えがわかりました。小さなコード return false を使用して問題を解決しました
しかし、別の問題があります
このコード行は機能していません
$('.cancel').bind('click', function(){
$(obj).parents('.question').fadeOut(300, function() {
$(obj).remove();
});
});