jqGrid

Question

यह संभव jqGrid (jQuery ग्रिड http://www.trirand.com/blog/) कस्टम सेल पाठ रंग उदा के लिए में है कीमत कॉलम में मैं लाल चाहता हूं अगर कीमत> 100 डॉलर और हरा अगर कीमत < 50 $ और ग्रे?

अधिक आम तौर पर

1. jqGrid हुक प्रदान करता है ग्रिड cellview, उदा बदलने के लिए करते हैं मैं कॉलबैक पंजीकृत कर सकता हूं जब मूल्य कॉलम की कोशिकाएं बनाई जाती हैं या संशोधित होती हैं।

2. या क्या अलग मॉडल और दृश्य (क्लाइंट साइड) उदा। सर्वर से मैं कैसे प्रदर्शित करने के लिए यानी प्रत्येक पंक्ति के लिए दो डेटा भेज सकते हैं और क्या प्रदर्शित करने के लिए

संपादित करें: इसलिए यहाँ नमूना फ़ॉर्मेटर है, जो रंग मूल्य के आधार पर सेल दिखा एक उदाहरण है

function infractionInFormatter(el, cellval, opts) 
{ 
    $(el).html(cellval).css('color',infraction_color_map[cellval]); 
} 

colModel :[ 
    ... 
    {name:'date', index:'date', width:120, date:true}, 
    {name:'inf_out', index:'inf_out', width:60, formatter:infractionInFormatter,}, 
    ... 
], 

Answer 1

हां, आप यह कर सकते हैं। custom formatter लिखें। यह केवल एक ऐसा कार्य है जिसे आप अपने colModel में संदर्भ देते हैं। आपको फ़ंक्शन में अंतिम सेल चयनकर्ता का संदर्भ मिलता है, इसलिए आप jQuery के साथ कुछ भी कर सकते हैं जो आप एक फॉर्मेटर में कर सकते हैं। रंग/शैली को बदलने सहित।

Answer 2

मैं एक लाल रंग की पृष्ठभूमि रंग किसी और एक हरे रंग की पृष्ठभूमि सेट होता अगर एक सेल xxx मान होता है, यदि मूल्य yyy है।

..... 
colModel:[ 
    {name:'id',index:'id', width:15,hidden:true, align:"center"}, 
    {name:'title',index:'title', width:150, align:"center"}, 
    {name:'start',index:'start', width:350, align:"center", sorttype:"date"}, 
    {name:'fine',index:'fine', width:350, align:"center", sorttype:"date"}, 
    {name:'completed',index:'completed', width:120, align:"center",formatter:infractionInFormatter},   
    ], 
..... 

और यह समारोह अपने उदाहरण की तरह:

function infractionInFormatter(el, cellval, opts) 
     { 
      ..... 
     } 

मैं इसे स्थापित करने के लिए कैसे

मैं इस कोड लिखा है?

बहुत बहुत धन्यवाद।

Answer 3

तुम भी colModel में वर्ग निर्दिष्ट कर सकते हैं:

colModel: [ 
      { 
      name:'field_x', 
      index:'field_x', 
      align: 'left', 
      width: 35, 
      classes: 'cvteste' 
      }, 
      ..... 
      ]