我如何突出顯示單元格內容的焦點

我有以下jqGrid的工作方式，除非我選擇一個單元格時我希望選中內容而不必雙擊。我已將類屬性添加到「閱讀」列中。我如何突出顯示單元格內容的焦點

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> 
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%> 

<div class="miscdisplayheader"> 
    <img title="Close" class="modified20 ifetestestdetailsFormClose_cellEdit floatright" src="/QMSWebApp/Images/close[1].jpg"> 
</div> 

<table id="ifetestdetailslist"></table> 
<div id="ifetestdetailspager"></div>

$(document).ready(function() { 
    var lastsel; 
    var selID = ""; 

    $("#ifetestdetailslist").jqGrid({ 
     url: '/QMSWebApp/IFETestingControllerServlet?lifecycle=loadifetestdetailsDataModel', 
     editurl: '/QMSWebApp/IFETestingControllerServlet?lifecycle=editifetestdetailsdatamodel', 
     datatype: "json", 
     height: "auto", 
     colNames: ['Index', 'Test Index', 'Reference', 'Value'], 
     colModel: [{ 
      name: 'id', 
      index: 'id', 
      width: 100, 
      hidden: true, 
      editable: true, 
      editrules: { 
       edithidden: true 
      }, 
      formoptions: { 
       rowpos: 1, 
       colpos: 1, 
       label: "Index:" 
      } 
     }, { 
      name: 'testindex', 
      index: 'testindex', 
      width: 100, 
      hidden: true, 
      editable: true, 
      editrules: { 
       edithidden: true 
      }, 
      formoptions: { 
       rowpos: 2, 
       colpos: 1, 
       label: "Test Index:" 
      } 
     }, { 
      name: 'refno', 
      index: 'refno', 
      width: 300, 
      hidden: false, 
      editable: false, 
      editoptions: { 
       readonly: 'readonly' 
      }, 
      editrules: { 
       edithidden: true 
      }, 
      formoptions: { 
       rowpos: 3, 
       colpos: 1, 
       label: "Reference:" 
      } 
     }, { 
      name: 'reading', 
      index: 'reading', 
      width: 300, 
      hidden: false, 
      editable: true, 
      editrules: { 
       edithidden: true 
      }, 
      formoptions: { 
       rowpos: 4, 
       colpos: 1, 
       label: "Value:" 
      }, 
      editrules: { 
       custom: true, 
       custom_func: myValidate1 
      }, 
      classes: 'highlightAll' 
     }, ], 
     rowNum: 10, 
     rowList: [10, 20, 30], 
     loadonce: true, 
     pager: '#ifetestdetailspager', 
     'cellEdit': true, // TRUE = turns on celledit for the grid. 
     'cellsubmit': 'remote', 
     cellurl: '/QMSWebApp/IFETestingControllerServlet?lifecycle=editifetestdetailsdatamodel', 
     viewrecords: true, 
     gridview: true, 
     loadComplete: lComplete, 
     reloadAfterSubmit: true, 
     caption: "Test Details" 
    }); 

    function lComplete(data) { 
     $('.highlightAll').on("focus", function() { 
      $(this).select(); 
     }); 
     hideProgressDisplay(); 
    }; 

    function myValidate1(value, colname) { 
     var readingV = parseFloat(value); 
     if (readingV <= 0 || readingV >= 30) { 
      return [false, " Value must be > 0 and < 30."]; 
     } else { 
      return [true, ""]; 
     } 
    } 

    $('.ifetestestdetailsFormClose_cellEdit').on("click", function() { 
     //$("#ifetestingdatalist").jqGrid('setGridParam',{ datatype: 'json' }).trigger('reloadGrid')   
     $('.miscdisplay').hide("slide", { 
      direction: "right" 
     }, 1000); 
    }); 
});

更新：我想這也是，但仍然是行不通的。如在內容中沒有被選擇準備好進行編輯。您仍然需要手動選擇或雙擊。

colNames:['Index','Test Index','Reference','Value'], 
    colModel:[ 
     {name:'id', index:'id', width:100, hidden: true, editable: true, editrules:{edithidden:true}, formoptions:{rowpos:1, colpos:1,label:"Index:"}}, 
     {name:'testindex', index:'testindex', width:100, hidden: true, editable: true, editrules:{edithidden:true}, formoptions:{rowpos:2, colpos:1,label:"Test Index:"}}, 
     {name:'refno', index:'refno', width:300, hidden: false, editable: false, editoptions:{ readonly:'readonly'}, editrules:{edithidden:true}, formoptions:{rowpos:3, colpos:1,label:"Reference:"}}, 
     {name:'reading', index:'reading', width:300, hidden: false, editable: true, editrules:{edithidden:true}, formoptions:{rowpos:4, colpos:1,label:"Reading:"}, editrules: {custom: true, custom_func: myValidate1}, classes: 'highlightAll'}, 
     ], 
     rowNum:10, 
     rowList:[10,20,30], 
     loadonce: true, 
     pager: '#ifetestdetailspager', 
     'cellEdit': true, // TRUE = turns on celledit for the grid. 
     'cellsubmit' : 'remote', 
     cellurl: '/QMSWebApp/IFETestingControllerServlet?lifecycle=editifetestdetailsdatamodel', 
     beforeEditCell: function(rowid,cellname,value,iRow,iCol){ 
      $("#" + rowid + "_reading").select(); 

     }, 
     viewrecords: true, 
     gridview: true, 
     loadComplete: lComplete, 
     reloadAfterSubmit: true, 
     caption:"Test Details" 

    });

來源

2016-11-04 Steve Dyke

我想出了答案：

afterEditCell: function(rowid,cellname,value,iRow,iCol){ 
      $('.edit-cell > input').select(); 
     },

來源

2016-11-04 21:13:27

我如何突出顯示單元格內容的焦點

回答

相關問題