我写过这个剧本:
function acceptButtonClick(th) {
var id = $(th).attr('data-id');
$(th).parent().parent().find('div.Declined').attr('class', "Approved");
$(th).parent().parent().find('div.Requested').attr('class', "Approved");
$.ajax({
type: "POST",
url: "/TableRequest/AcceptRequest",
data: { 'id': id },
success: function (msg) {
}
});
$(th).hide();
$(th).parent().find('button.decline-button').show();
$(th).parent().parent().find('span.decline-img').hide();
$(th).parent().parent().find('span.accept-img').show();
$(th).parent().parent().find('span.requested-img').hide();
}
function declineButtonClick(th) {
tempId = $(th).attr('data-id');
$('#dialog').attr('data-id', tempId);
$("#dialog").modal('show');
}
$(document).ready(function () {
$('#requestTable').dataTable({
"bServerSide": true,
"sAjaxSource": "TableRequest/GetDataTable",
"bProcessing": true,
"fnRowCallback": function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
$('td', nRow).find('button').attr('data-id', aData.ID);
$('td', nRow).find('button.accept-button').click(function () {
acceptButtonClick(this);
});
$('td', nRow).find('button.decline-button').click(function () {
declineButtonClick(this);
});
if ($('td:eq(1)', nRow).find('div').attr('class') == "Approved") {
$('td', nRow).find('button.accept-button').hide();
$('td', nRow).find('span.decline-img').hide();
$('td', nRow).find('span.requested-img').hide();
}
else if ($('td:eq(1)', nRow).find('div').attr('class') == "Declined") {
$('td', nRow).find('button.decline-button').hide();
$('td', nRow).find('span.accept-img').hide();
$('td', nRow).find('span.requested-img').hide();
}
else if ($('td:eq(1)', nRow).find('div').attr('class') == "Requested") {
$('td', nRow).find('span.accept-img').hide();
$('td', nRow).find('span.decline-img').hide();
}
},
"aoColumns": [
{ "data": "ID", "visible": false, bSortable: false, bSearchable: false },
{ "data": "Name" },
{
"data": "VacationRequestStatus",
bSortable: false,
bSearchable: false,
"mRender": function (data, type, full) {
//return '<div class = "' + data + '"><img src="/Content/images/Accept_picture.png" class="img-rounded accept-img" height = "25px" /><img src="/Content/images/Decline_picture.png" class="img-rounded decline-img" height = "25px" /><img src="/Content/images/Requested-picture.png" class="img-rounded requested-img" height = "25px" /></div>';
return '<div class = "' + data + '"><span class="glyphicon icon-question-sign accept-img" height = "25px" /><span class="glyphicon glyphicon-ok decline-img" height = "25px" /><span class="glyphicon glyphicon-remove requested-img" height = "25px" /></div>';
}
},
{ "mData": "Position", bSortable: false, bSearchable: false },
{ "mData": "DateStart", bSortable: false, bSearchable: false },
{ "mData": "DateEnd", bSortable: false, bSearchable: false },
{
bSortable: false,
bSearchable: false,
data: null,
className: "center",
defaultContent: '<button class="btn btn-danger decline-button">Decline</button> <button class="btn btn-primary accept-button">Accept</button>'
}
]
});
$('button.ok-request').click(function () {
var tempId = $('#dialog').attr('data-id');
var message = $('textarea#commentForDecline').val();
$.ajax({
type: "POST",
url: "/TableRequest/DeclineRequest",
data: { 'message': message, 'id': tempId },
success: function (msg) {
}
});
$("#dialog").modal('hide');
$('button[data-id="' + tempId + '"]').parent().parent().find('div.Approved').attr('class', "Declined");
$('button[data-id="' + tempId + '"]').parent().parent().find('div.Requested').attr('class', "Declined");
$('button[data-id="' + tempId + '"]').parent().parent().find('span.decline-img').show();
$('button[data-id="' + tempId + '"]').parent().parent().find('span.accept-img').hide();
$('button[data-id="' + tempId + '"]').parent().find('button.decline-button').hide();
$('button[data-id="' + tempId + '"]').parent().find('button.accept-button').show();
$('button[data-id="' + tempId + '"]').parent().parent().find('span.requested-img').hide();
$('textarea#commentForDecline').val('');
});
});
我先把<img>
放在首位。此脚本与<img>
一起正常运行,但现在我需要放置Bootstrap Glyphicons
而不是<img>
。我将<span>
添加到选择器而不是<img>
。我评论了与<img>
的对话。有人能帮我吗?我究竟做错了什么?
答案 0 :(得分:0)
我很确定你的问号只有不正确的类。尝试将glyphicon icon-question-sign
更改为glyphicon glyphicon-question-sign
Here's a fiddle以“test”代替您的data
变量。呈现的所有图标。