JQGrid

Question

में कॉलम वर्डवाप कोई भी जानता है कि JQGrid में कॉलम नामों को कैसे लपेटें। कृपया नीचे मेरी JSON कोड को खोजने

colModel: [ {नाम: 'RequestID', सूचकांक: 'CreditRequest.CreditRequestID', चौड़ाई: 100, संरेखित: 'छोड़'}, .....

के साथ उपरोक्त कोड का संदर्भ यदि सामग्री का आकार अधिक हो गया है, तो मैं इसे लपेटना चाहता हूं। कोई विचार या टिप्पणियां

Answer 1

खैर सबसे आसान तरीका है एक लाइन ब्रेक सुनिश्चित करने के लिए है में एक <BR/> टैग डाल करने के लिए कॉलम नाम जहां आपको कभी भी लाइन ब्रेक की आवश्यकता होती है। उदाहरण के लिए ClientPrimaryName, Client<BR/>PrimaryName के रूप में लिखा जा सकता है इतना है कि यह वास्तव में renders के रूप में:

ग्राहक
PrimaryName

Answer 2

आप सामान्य रूप से वें टैग की एक सफेद-स्थान सीएसएस संपत्ति सेट कर सकते हैं। JQuery का उपयोग किया जाना चाहिए कि:

$('.ui-jqgrid .ui-jqgrid-htable th div').css('white-space', 'normal'); 

Answer 3

आप वें स्तंभ शीर्ष लेखों अपने jqGrid के लिए लागू विशिष्ट वर्गों पर एक नज़र लेने के लिए की जरूरत है। ui-th-div-ie ui-jqgrid-sortable

थोड़ा आगे मैंने पाया कि वहाँ दो सीएसएस मुद्दे थे देख रहे हैं:

1. white-space: सामान्य
2. ऊंचाई: 16px

दोनों मेरे मामले में मैं निम्नलिखित था इन सीएसएस विशेषताओं जहां ui.jqgrid.css में परिभाषित किया गया है। यह महसूस करते हुए कि मुझे लगता है कि मैं अन्य कार्यान्वयन मैं निम्नलिखित समाधान के साथ आया को प्रभावित करने के लिए नहीं चाहता था इस ग्रिड के लिए एक विशिष्ट आवश्यकता थी:

$(".ui-jqgrid-sortable").css('white-space', 'normal'); 
$(".ui-jqgrid-sortable").css('height', 'auto'); 

Answer 4

बस इसे संदर्भ अपने खुद के सीएसएस फ़ाइल में।

.ui-jqgrid tr.jqgrow td { 
    height: 50px; 
    white-space: normal; 
} 

जब तक आपके सीएसएस फ़ाइल jqGrid.css फ़ाइल के बाद शीर्षक में सूचीबद्ध किया गया है तो यह यह पार कर जाएगी।

Answer 5

क्या इसके लायक है के लिए, यहाँ यह हेडर पंक्ति के लिए है:

.ui-jqgrid .ui-jqgrid-htable th div, .ui-jqgrid-sortable { 
    height:auto; 
    overflow:hidden; 
    white-space:normal !important; 
} 

Answer 6

यहाँ कोशिकाओं में शब्द रैपिंग सक्षम करने के लिए कुछ ही कदम है।

खोलें ui.jqgrid.css .ui-jqgrid tr के लिए खोजें।jqgrow टीडी बदलें "white-space: पूर्व," करने के लिए "white-space: सामान्य,"

सेल में

रैप के लिए:

.ui-jqgrid tr.jqgrow td { 
    white-space: normal !important; 
    height:auto; 
    vertical-align:text-top; 
    padding-top:2px; 
} 

और के लिए स्तंभ शीर्ष लेखों

.ui-jqgrid .ui-jqgrid-htable th div { 
     height:auto; 
    overflow:hidden; 
    padding-right:4px; 
    padding-top:2px; 
    position:relative; 
    vertical-align:text-top; 
    white-space:normal !important; 
} 

Answer 7

इस का प्रयोग करें सीएसएस

.ui-jqgrid tr.jqgrow td { 
     word-wrap: break-word; /* IE 5.5+ and CSS3 */ 
     white-space: pre-wrap; /* CSS3 */ 
     white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ 
     white-space: -pre-wrap; /* Opera 4-6 */ 
     white-space: -o-pre-wrap; /* Opera 7 */ 
     overflow: hidden; 
     height: auto; 
     vertical-align: middle; 
     padding-top: 3px; 
     padding-bottom: 3px 
    } 

Answer 8

तुम सिर्फ एक <BR/> डाल नहीं कर सकते हैं, जबकि कि काम करता है लाइन लपेटकर पर - यह does not ऊंचाई ठीक से

Answer 9

यह jqGrid 4.4.4

.ui-jqgrid .ui-jqgrid-htable th div 
{ 
    white-space:normal; 
    height:auto !important; 
}