在JQGrid中編輯單元格屬性

我是JQ網格中的初學者。在我的JQ網格中，我在列中添加了一個圖像作爲錨標籤。點擊特定的單元格，我只需要爲該單元格更改圖像。我加入一個類的clickableTitle'柱上，試圖訪問當前單元格爲：在JQGrid中編輯單元格屬性

$('.clickableTitle').live('click', function() { 
    $(this).parents('table:first').getCell($(this).parents('tr:first').attr('id'), 'comment')); 
});

這讓我在下面的格式錨標記，但我不能夠在運行時改變它的圖像源。

<A href="Proj.aspx?PID=795&Store=#Comment"><IMG class=commentIcon src="/_Layouts/images/iconCommentOn.png"></A>

您能否讓我知道什麼是最好的方法來實現這一目標。謝謝！！！

來源

2012-03-30 Vashu

首先嚐試使用的JavaScript庫的名稱：jqGrid。在the documentation或the main side的任何地方，您都可以找到以相同形式書寫的同一名稱。

你的主要問題。看起來你可以使用onCellSelect回調來捕捉圖像上的點擊事件，或者只需點擊某個單元格。 onCellSelect回調的e參數是event object和e.target將被點擊的元素。

The demo演示如何使用它。

enter image description here

我用作用於鎖定jQuery的用戶界面的初始背景圖像。

formatter: function() { 
    return "<a href='#'><span class='ui-icon ui-icon-locked'></span></a>" 
}

點擊圖像上通過改變<span>元素的類改變了圖像從"ui-icon-locked"到"ui-icon-unlocked"：

onCellSelect: function (rowid, iCol, cellcontent, e) { 
    var $dest = $(e.target), $td = $dest.closest('td'); 
    if ($td.hasClass("clickableTitle")) { 
     if ($dest.hasClass("ui-icon-locked")) { 
      $dest.removeClass("ui-icon-locked").addClass("ui-icon-unlocked"); 
     } else { 
      $dest.removeClass("ui-icon-unlocked").addClass("ui-icon-locked"); 
     } 
    } 
}

您可以輕鬆更改代碼，如果你喜歡有<img>，而不是背景圖片在<span>。

來源

2012-03-30 16:32:17 Oleg

@Oleg：感謝您的輸入。我相信，urs是正確的方式，但由於現有實施的限制，我必須使用下面提到的解決方案。

$('.clickableTitle').live('click', function() { 
    $('body').css('cursor', 'wait'); 
    var commentIconStat = $(this).parents('table:first').getCell($(this).parents('tr:first').attr('id'), 'comment'); 
    //Turn read comment off 
    if (commentIconStat.search(/iconCommentOn/i) > -1) { 
     commentIconStat = commentIconStat.replace(/iconCommentOn/i, "iconCommentOff"); 
     $(this).parents('table:first').setCell($(this).parents('tr:first').attr('id'), 'comment', commentIconStat, '') 

    } 
    $('body').css('cursor', 'default'); 
});

來源

2012-04-04 07:52:25 Vashu

在JQGrid中編輯單元格屬性

回答

相關問題