jqGrid कॉलम कॉलम हेडर

Question

के साथ गठबंधन नहीं किया गया यह प्रश्न यहां पूछा गया था। jqGrid column not aligned with column headers

लेकिन सीमा-दाएं रंग की शैली मेरे लिए काम नहीं कर रही है।

मैं jqGrid 3.8 और IE 8

उपयोग कर रहा हूँ इस jqGrid

shrinkToFit:true, 
colModel :[ 
    {name:'leid', index:'leid', width:70, label:'LEID'}, 
    {name:'cdr', index:'cdr', width:40, label:'CDR'}, 
    {name:'name', index:'name', width:160, label:'Name'}, 
    {name:'country', index:'country', width:98, label:'Country'}, 
    {name:'fc', index:'fc', width:50, label:'FC'}, 
    {name:'bslaMe', index:'bslaMe', width:65, label:'BSLA/ME'}, 
    {name:'business', index:'business', width:130, label:'Business'}, 
    {name:'amtFc', index:'amtFc', width:98, label:'Amt(FC)', align:'right', 
    formatter:'currency', formatoptions:{decimalSeparator:".", 
    thousandsSeparator: ",", decimalPlaces: 2, prefix: "", suffix:"", 
    defaultValue: '0'} }, 
    {name:'amtUsd', index:'amtUsd', width:98, label:'Amt(Cur)', align:'right', 
    formatter:'currency', formatoptions:{decimalSeparator:".", 
    thousandsSeparator: ",", decimalPlaces: 2, prefix: "", suffix:"", 
    defaultValue: '0'} }, 
    {name:'cashPoolHeader', index:'cashPoolHeader', width:120, 
    label:'Cash Pool Header'}, 
    {name:'cashPoolCDR', index:'cashPoolCDR', width:60, label:'CP CDR'}, 
    {name:'cashPoolName', index:'cashPoolName', width:160, label:'Cash Pool Name'} 
], 

किसी भी विचार के लिए मेरे सेटअप है?

Answer 1

मैं एक ही मुद्दा हो रही थी, मैं gridComplete में कोड की 4 लाइनों जोड़कर इस समस्या हल हो जाती है, इन 4 लाइनों td की शैली बदल जाएगा 'सामग्री क्षेत्र के रों [पहली पंक्ति td की शैली संशोधन के लिए पर्याप्त है]।

यह jqgid में एक मुद्दा है, जो वास्तव td स्थापित कर रही है है '<thead> अंदर रों लेकिन इस शैली td में दर्शाती नहीं है' सामग्री क्षेत्र की है। Jqgrid के विकास के दौरान उन्होंने माना कि पूरे स्तंभ चौड़ाई एक पंक्ति के td एस की चौड़ाई बदलकर प्रभावित होगी लेकिन वे केवल <thead> के लिए बदल गए हैं जो कि यहां जारी मुद्दा है।

colModel में सेट स्तंभ चौड़ाई:

colModel: [ 
    { 
     name: 'Email', 
     index: 'Email', 
     editable: true, 
     edittype: 'custom', 
     width: 220, 
     editoptions: { 
      custom_element: function(value, options) { 
       return EmailAddressCustomElement(value, options); 
      }, 
      custom_value: function(elem) { 
       var inputs = $("input", $(elem)[0]); 
       return inputs[0].value; 
      } 
     } 
    }, 
    { 
     name: 'LocationAndRole', 
     index: 'LocationAndRole', 
     editable: true, 
     align: "left", 
     edittype: "button", 
     width: 170, 
     editoptions: { 
      value: 'Edit Location And Role', 
      dataEvents: [{ 
       type: 'click', 
       fn: function(e) { 
        ShowUsersLocationAndRoles(e); 
       } 
      }] 
     } 
    } 
] 

gridComplete स्थिति में नीचे कोड जोड़ें:

gridComplete: function() { 
    var objRows = $("#list_accounts tr"); 
    var objHeader = $("#list_accounts .jqgfirstrow td"); 

    if (objRows.length > 1) { 
     var objFirstRowColumns = $(objRows[1]).children("td"); 
     for (i = 0; i < objFirstRowColumns.length; i++) { 
      $(objFirstRowColumns[i]).css("width", $(objHeader[i]).css("width")); 
     } 
    } 
} 

मुझे आशा है कि इसके बाद के संस्करण कोड मुद्दे को हल में मदद मिलेगी।

Answer 2

मेरे old answer पर देखें जो कॉलम हेडर संरेखण को बदलने का तरीका बताता है।

यह वही नहीं है जो आप चाहते हैं, तो आपको एक तस्वीर पोस्ट करनी चाहिए जो दिखाती है कि ग्रिड कैसा दिखता है और आपके प्रश्न में एचडीएमएल कोड सहित ग्रिड का पूरा कोड, jqGrid के संस्करण के बारे में जानकारी जो आप उपयोग करते हैं और परीक्षण डेटा। तो सभी को आपकी समस्या को पुन: उत्पन्न करने की आवश्यकता है।

Answer 3

कोड ऊपर मेरे लिए काम नहीं कर रहा था

मैं इसे एक छोटे से बदल दिया है: ठीक काम कर रहा 4.6.0

var objHeader = $("table[aria-labelledby=gbox_" + gridName+ "] tr[role=rowheader] th"); 

for (var i = 0; i < objHeader.length; i++) { 
    var col = $("table[id=" + gridName+ "] td[aria-describedby=" + objHeader[i].id + "]"); 
    var width= col.outerWidth(); 
    $(objHeader[i]).css("width", width); 
}