新手问题 自行编写 $.rails.allowAction 导致 jQuery UJS 的 method: :delete 无效
我写了个 js 文件，
$rails.allowAction = function(element) {
var message = element.data('confirm'),
answer = false,
callback;
if (!message) {
return true;
}
console.log("");
if ($.rails.fire(element, 'confirm')) {
answer = $.rails.confirm(element);
callback = $.rails.fire(element, 'confirm:complete', [answer]);
}
return answer && callback;
}
$.rails.confirm = function(element) {.....}
这是为了修改 confirm 时的模态框，加载完这个文件后，点击删除链接（加了 method::delete）,跳转到了 GET 也就是动作 show
7788
#3
2017年04月21日
对
huacnlee
回复
huacnlee
回复
(function(){
$.rails.allowAction = function(element) {
var message = element.data('confirm'),
answer = false, callback;
if (!message) { return true; }
if (rails.fire(element, 'confirm')) {
try {
answer = rails.confirm(element);
} catch (e) {
(console.error || console.log).call(console, e.stack || e);
}
callback = rails.fire(element, 'confirm:complete', [answer]);
}
return answer && callback;
}
$.rails.confirm = function(element) {
var id = 'modalConfirm',
w = element.data('width'),
h = element.data('height'),
title = element.data('title') || '系统提示',
text = element.data('confirm') || '确定删除？',
type = text ? 'text' : 'iframe',
remote = !! element.data('remote');
var target_str = element.attr('target') ? ' target="' + element.attr('target') + '"' : '';
var method_str = element.data('method') ? ' data-method="' + element.data('method') + '"' : '';
var html = '<div class="modal fade" id="' + id + '" tabindex="-1" role="dialog" aria-labelledby="modalConfirmLabel" aria-hidden="true">' +
'<div class="modal-dialog" style="width: ' + w + 'px;">' +
'<div class="modal-content">' +
'<div class="modal-header">' +
'<button type="button" class="close" data-dismiss="modal" aria-hidden="true">关闭</button>' +
'<h4 class="modal-title" id=" ' + id + ' " >' + title + '</h4>' +
'</div><form role="form" action="" method="">';
html += '<div class="modal-body">' + '<div class="form-group text-center">' +
'<p>' + text + '</p></div></div>';
html += '<div class="modal-footer">';
href = remote ? 'javascript:' : element.attr('href');
html += '<a href="' + href + '"' + target_str + method_str + ' class="btn btn-green" id="pop-confrim-submit">确定</a>';
html += '<button type="button" class="btn btn-sm btn-default" data-dismiss="modal">取消</button>';
html += '</div></form>';
html += '</div>';
html += '</div></div></div>';
$('#' + id).remove();
$("body").append(html);
$('#' + id).modal('show');
if (remote) {
$('#modalConfirm-submit').click(function(event) {
event.preventDefault();
$.rails.handleRemote(element);
$(this).next().click();
if (element.data('callback')) {
eval(element.data('callback'));
}
return false;
});
}
if (target_str) {
$('#modalConfirm-submit').click(function(event) {
$(this).next().click();
});
};
return false;
};
}())
这个 method: :delete 走的 GET 动作
可以看看这篇 blog，我之前做过一个类似的，似乎不需要复写 rails.confirm 就可以了。
$.rails.allowAction = function(element){
var message = element.data("confirm");
if (!message) { return true; }
$(".confirm-message").html(message)
$("#confirm_message").show();
setTimeout(function(){
$("#confirm_message").children(".confirm-div").addClass("mask-show");
}, 10);
$("#confirm_ok").click(function(){
element.data("confirm", null);
element.trigger("click.rails");
element.data("confirm", message);
$("#confirm_message").hide();
});
return false;
}
document.addEventListener("turbolinks:load", function() {
$("#confirm_close").click(function(){
$("#confirm_message").hide();
});
});