私のajaxレンダリングプロパティのアンカータグでグリフコンを変更するには？

Question

「ターゲット0」：「レンダリング」：「アンカータグ」

私は最初に「グリフコングリフコンシェブロン右」を使用しています。 "glyphicon glyphicon-chevron-down"にonclickを変更したいと思います。

$(document).ready(function() { 
    $("#PageNo").text(currentPage); 
    tblErrorLog = $('#tblErrorLog').DataTable(
    { 
     serverSide: true, 
     ajax: { 
      url: '@Url.Content("~/ErrorLogs/ErrorLogDataSaurce")', 
      data: ErrorLogParameter, 
      dataSrc: ErrorLogGridDataBound, 
      type: "POST" 
     }, 
     select: true, 
     paging: false, 
     searching: false, 
     info: false, 
     columnDefs: [ 
      { 
       targets: 0, 
       render: function (data, type, full, meta) { 
        return '<a id=' + full.ID + ' onclick="return ViewErrorDetails(' + full.ID + ')"><i class="glyphicon glyphicon-chevron-right"></i></a>' 
       } 
      }, 
      { 
       targets: 1, 
       data: "Message", 
       orderable: true 
      }, 
      { 
       targets: 2, 
       data: "Source", 
       orderable: true 
      }, 
     ], 

    }); 
}); 

Answer 1

あなたのアンカーは、これらのようにする必要があります。

<a class="glyphicon glyphicon-chevron-right" id=' + full.ID + ' onclick="return ViewErrorDetails(' + full.ID + ', this)"></a> 

そして、関数ViewErrorDetails（）は、このタイプのコードを追加します。

function ViewErrorDetails(id, itm) 
{ 
    $(itm).removeClass('glyphicon-chevron-right'); 
    $(itm).addClass('glyphicon-chevron-left'); 
} 

Answer 2

私はあなたの問題を間違って理解しているかもしれませんが、これを試してください。

アンカータグにIDを付けます。

<a id='anchor_sym'></a>

その後、onClick()方法では、次の上の操作を行います。

/* Plain Javascript*/ 
var element = document.getElementById("anchor_sym"); 
element.className += " glyphicon-chevron-left"; 
element.className = element.className.replace("glyphicon-chevron-right", ""); 

/* Using JQuery*/ 
$('anchor_sym') 
    .addClass('glyphicon-chevron-left') 
    .removeClass('glyphicon-chevron-right'); 

Answer 3

完璧な方法は、この作業を行うことです。..

<a style="color:#ccc" class="glyphicon glyphicon-chevron-right" id=' + full.ID + ' onclick="return ViewErrorDetails(' + full.ID + ', this)"></a> 

function ViewErrorDetails(ID, itm) { 
    var tr = $('#' + ID).closest('tr'); 
    var row = tblErrorLog.row(tr); 
    if (row.child.isShown()) { 
     // This row is already open - close it 
     row.child.hide(); 
     tr.removeClass('shown'); 
     $(itm).addClass('glyphicon-chevron-right'); 
     $(itm).removeClass('glyphicon-chevron-down'); 
    } 
    else { 
     // Open this row 
     row.child(format(row.data())).show(); 
     tr.addClass('shown'); 
     $(itm).removeClass('glyphicon-chevron-right'); 
     $(itm).addClass('glyphicon-chevron-down'); 
    } 

}