cột hình ảnh trong jqGrid?

Question

Tôi muốn một cột hình ảnh trong jQGrid của tôi, tôi đã sử dụng một trình định dạng, nhưng không hoạt động, xin vui lòng cho tôi giải pháp cho việc này.

mã của tôi là như sau:

jQuery(document).ready(function() { 
     var TheGrid ; 
     var resp; 
     jQuery("#registerUsers").jqGrid({ 
       url: 'EventsList.aspx', 
       datatype: "json", 
       colNames: ['Name', 'Company Name', 'Responsible Name', 'Date/Time', 'Id'], 
       colModel: [{ name: 'GuestName', index: 'GuestName', width: 150, editable: true, editoptions: {readonly: true, size: 10} }, 
          { name: 'CompName', index: 'CompName', width: 150, editable: false, editoptions: { readonly: true, size: 10} }, 
          { name: 'RespName', index: 'RespName', width: 150, editable: false, editoptions: { readonly: true, size: 10} }, 
          { name: 'RegisterDate', index: 'RegisterDate', width: 150, editable: false, editoptions: { readonly: true, size: 10} }, 
          { name: 'Register_Id', index: 'Register_Id', width: 100, align: 'left', formatter: checkboxFormatter }, 
         ], 
       rowNum: 10, 
       rowList: [10, 20, 30], 
       pager: jQuery('#Userpager'), 
       sortname: 'Register_Id', 
       viewrecords: true, 
       sortorder: "desc", 
       imgpath: '/scripts/themes/steel/images', 
       caption: "Registered Users" 
      }); 
     }); 
     jQuery("#registerUsers").jqGrid('navGrid', '#Userpager', { edit: false, add: false, del: false }); 

    function checkboxFormatter(el, cval, opts) { 
      debugger; 
      cval = cval + ""; cval = cval.toLowerCase(); 
      //   var bchk = cval.search(/(false|0|no|off|n)/i) < 0 ? " checked=\"checked\"" : ""; 
      var UserId = jQuery("#registerUsers").getCell(RowId, 'Register_Id'); 
      $(el).html("<center><img src='../images/gnome-session-logout.png' width='15px' height='15px' onclick=javascript:LogOutUser(" + UserId + ");/></center>"); 
      //   <input type='checkbox' onclick=\"ajaxSave('" + opts.rowId + "', this);\" " + bchk + " value='" + cval + "' offval='no' /> 



     } 

Xin hãy giúp tôi

cảm ơn Ritz

Answer 1

Xem can-you-have-images-or-any-custom-html-displayed-in-jquery-grid-jqgrid-cells để được hướng dẫn hiển thị hình ảnh trong các tế bào.

Về cơ bản, có vẻ như bạn có thể cần xóa dấu ngoặc kép khỏi phần tử src của mình.

Answer 2

bạn chỉ có thể trả lại thẻ img như là một chuỗi trong định dạng ví dụ:

function unitsInStockFormatter(cellvalue, options, rowObject) { 
    var cellValueInt = parseInt(cellvalue); 
    if (cellValueInt > 10) 
     return "<img src='../../Content/images/ui-flag_green.png' alt='" + cellvalue + "'title='" + cellvalue + "' />"; 
    else if (cellValueInt > 0) 
     return "<img src='../../Content/images/ui-flag_blue.png' alt='" + cellvalue + "'title='" + cellvalue + "' />"; 
    else 
     return "<img src='../../Content/images/ui-flag_red.png' alt='" + cellvalue + "'title='" + cellvalue + "' />"; 
    }; 

như đã mô tả ở đây: http://tpeczek.com/2009/11/jqgrid-and-aspnet-mvc-formatting.html

Answer 3

Một giải pháp đơn giản có thể được thực hiện trực tiếp từ các truy vấn:

chọn idres, 'HTML-IMG-SRC = images/tick_' || reserved || '.png' như được đặt trước, chỉ định, lỗi thời từ bảng; - truy vấn postgres

đâu Reserved là 0 hoặc 1 và phản ánh trong tên tập tin hình ảnh "tick_1.png" hoặc "tick_0.png" tùy thuộc vào giá trị của lĩnh vực 'reserved'

Hy vọng nó giúp

Answer 4

tôi đã tìm thấy giải pháp này.

Nếu trong trang của bạn, bạn chỉ bao gồm các bảng bằng cách chèn các script và stylesheet và sau đó có trang grid.php, bạn có thể định dạng các tế bào để hiển thị hình ảnh theo cách này:

Đặt mã dưới đây vào lưới của bạn. php:

$grid->setColProperty("COLUMN NAME", array("formatter"=>"js:formatImage")); 

Sau đó, đặt trong một biến chuỗi, kịch bản java cho chức năng formatImage theo cách này:

$IMAGE_FORMAT_STRING = <<<IMAGE_FORMAT_FUNCTION 
function formatImage(cellValue, options, rowObject) { 
    var imageHtml = ""; 
    if(cellValue){ 
     if(cellValue.indexOf("_thumb") == -1){ 
      imageHtml = '<div><a href="' + cellValue + '" title="" target="_blank">' + cellValue + '</a></div>';  
     }else{ 
      imageHtml = '<div class="gallery"><a href="' + cellValue.replace('_thumb', '') + '" title=""><img src="' + cellValue + '" width="50" height="50" alt="" border="0"/></a></div>'; 
     } 
    } 
    return imageHtml; 
} 
function unformatImage(cellValue, options, cellObject) { 
    return $(cellObject.html()).attr("originalValue"); 
} 
IMAGE_FORMAT_FUNCTION; 

và trên grid-> renderGrid, đặt đặt Mã JavaScript theo cách này:

$grid->setJSCode($IMAGE_FORMAT_STRING); 

Tôi hy vọng nó sẽ giúp ai đó!