2016-04-06 37 views
0

Benim jqgrid tabloyla, ilk iki sorun var, sütun başlıklarını tıklattığınızda artan veya azalan sırada sıralama yapmaz.Jqgrid: satır çarpması çalışmıyor

ben yaşıyorum sorun ben oldu

sanal sütunda çıkışını NUM1 ve NUM2 çarpma ve ben Num1 ve Num2 mutilpy nasıl, sanal Sonuç sütununda çıkışını göstermek ve göstermek istediğim Bu örnekte, benim kodum How do I make a non database column in jqGrid?

. benim Sonucu kolon NUM1 sonucu herhangi NUM2

AŞAĞIDA
 <!DOCTYPE html> 
    <html lang="en"> 
    <head> 

      <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 

     <link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.2/themes/redmond/jquery-ui.css" /> 
     <link rel="stylesheet" type="text/css" href="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.5/css/ui.jqgrid.css" /> 
     <style type="text/css"> 
      html, body { font-size: 75%; } 
     </style> 
    <script type="text/ecmascript" src="https://code.jquery.com/jquery-1.12.0.min.js"></script> 
     <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.2/jquery-ui.min.js"></script> 
     <script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.5/js/i18n/grid.locale-en.js"></script> 
     <script type="text/javascript"> 
      $.jgrid.no_legacy_api = true; 
      $.jgrid.useJSON = true; 
     </script> 
     <script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.5/js/jquery.jqGrid.src.js"></script> 

     <title>Jqgrid data </title> 
    </head> 
    <body> 
    <div style="margin-left:20px"> 
     <table id="nplGrid"></table> 

    </div> 
     <script type="text/javascript"> 

     $(document).ready(function() { 
      $("#nplGrid").jqGrid({ 
       url: 'json/data-bcp2.json', 
       datatype: "json", 
       colModel: [ 
        { label: 'Id', name: 'Id', width: 145 }, 
        { label: 'Symbol', name: 'Symbol', width: 90 }, 
        { label: 'Quantity', name: 'Quantity', width: 100, align: "right" }, 
        /*{ label: 'Value1', 
         name: 'Value1', 
         width: 80, 
         sorttype: 'number', 
         formatter: 'number', 
         align: 'right' 
        }, */ 
        { label: 'Price', name: 'Price', width: 180, sorttype: 'number' , align: "right",formatter: 'currency', formatoptions: { prefix: " $", suffix: " "}}, 
        { label: 'Value', name: 'Value', width: 180, sorttype: 'number', align: "right",formatter: 'currency', formatoptions: { prefix: " $", suffix: " "} }, 
        { label: 'Pledged', name: 'Pledged', width: 80, sorttype: 'integer' } , 
        { label: 'Num2', name: 'Num2', width: 80, formatter:'currency' }, 
        { label: 'Result', name: 'Result', width: 80,formatter:'currency', 
         formatter:function(cellvalue, options, rowObject) { 
          var amount = parseInt(rowObject.Num1,10), 
          tax = parseInt(rowObject.Num12,10); 
          return $.fmatter.util.NumberFormat(amount*tax,$.jgrid.formatter.currency); 
         } 
        } 
       ], 

       gridview: true, 
       rownumbers: true, 
       sortname: "invdate", 
       viewrecords: true, 
       sortorder: "desc", 
       caption: "Just simple local grid", 
       height: "100%", 
       footerrow: true, 


       loadComplete: function() { 
        var $self = $(this), 
         sum = $self.jqGrid("getCol", "Price", false, "sum"); 

        $self.jqGrid("footerData", "set", {invdate: "Total:", Price: sum}); 

         sum1 = $self.jqGrid("getCol", "Value", false, "sum"); 

        $self.jqGrid("footerData", "set", {invdate: "Total:", Value: sum1}); 
       } 


      }); 

     }); 

    </script> 


    </body> 
    </html> 

JSON VERİ x göstermek doesnt:

{ 
    "rows":[ 
     { 
       "Id":"C14999", 
       "Symbol":"AA", 
       "Quantity":"10000000 ", 
       "Price":"2500000", 
       "Value":"2500000", 
       "Pledged":"Y", 
       "Num1":"4", 
       "Num2":"20" 

       }, 
       { 
       "Id":"C14999", 
       "Symbol":"IRTX", 
       "Quantity":"253432250", 
       "Price":"3382000", 
       "Value":"857107.87", 
       "Pledged":"Y", 
       "Num1":"12", 
       "Num2":"31" 
       }, 
       { 
       "Id":"C14999", 
       "Symbol":"MMM", 
       "Quantity":"143440000", 
       "Price":"100000", 
       "Value":"1434400", 
       "Pledged":"Y", 
       "Num1":"22", 
       "Num2":"20" 

       }, 
       { 
       "Id":"C14999", 
       "Symbol":"FMCX", 
       "Quantity":"285657660", 
       "Price":"187125", 
       "Value":"62476901 ", 
       "Pledged":"N", 
       "Num1":"232", 
       "Num2":"20" 
       }, 
       { 
       "Id":"C14999", 
       "Symbol":"CEB", 
       "Quantity":"1228000000", 
       "Price":"949000", 
       "Value":"116537200 ", 
       "Pledged":"Y", 
       "Num1":"2", 
       "Num2":"10" 
       }, 
       { 
       "Id":"C23456", 
       "Symbol":"VETF", 
       "Quantity":"13984000000", 
       "Price":"256000", 
       "Value":"357990400", 
       "Pledged":"Y", 
       "Num1":"14", 
       "Num2":"20" 
       } 
    ] 
} 
+0

Önceki sorunuza benziyor, ancak 'Quantity' hala virgül ve 3 sütunundan 'Quantity', 'Value' ve' Value' değerlerini içeren gereksiz alanları içeriyor. Tüm tam sayı ve yüzer sayıları yerine JSON olarak dizgiler olarak dahil edilmiştir. Ek problemler çıkarır ve aktarılan verilerin büyüklüğünü gereksiz kılar. Sayıları sadece rakamlar olarak serileştirmek pratik olur. – Oleg

+0

Şu anda benim tablo doğru bir şekilde oluşturuyor, sorun şu ki Num1 ve Num2 çarpmak ve sanal Sonuç sütununda çıkışı göstermek istiyorum, Num1 ve Num2'yi nasıl mutilpy yapabilirim ve çıktıyı sanal sütunda gösterebilir – user244394

cevap

1

Planınız bir soru gibi görünüyor, ama Miktar hala virgül ve 3'ten değerleri içerir sütunlar Miktar, Değer ve Değer, gereksiz boşlukları içerir. Tüm tam sayı ve yüzer sayıları yerine JSON olarak dizgiler olarak dahil edilmiştir. Ek problemler çıkarır ve aktarılan verilerin büyüklüğünü gereksiz kılar. Sayıları sadece rakamlar olarak serileştirmek pratik olur. Ben, sunucu tarafında kullanabilirsiniz çoğu standart seri hale kütüphaneler, otomatik olarak gereksiz kesilecek

{ 
    "Id":"C14999", 
    "Symbol":"AA", 
    "Quantity":" 1,000.0000 ", 
    "Price":" 25.00000 ", 
    "Value":" 25000.00 ", 
    "Pledged":"Y", 
    "Num1":"4", 
    "Num2":"20" 
} 

arada

{ 
    "Id":"C14999", 
    "Symbol":"AA", 
    "Quantity":1000.0000, 
    "Price":25.00000, 
    "Value":25000.00, 
    "Pledged":"Y", 
    "Num1":4, 
    "Num2":20 
} 

gibi Ürünü dönmek daha iyi olurdu demek 0 sayıların ondalık noktasından sonraki değerler. Nedense, jqGrid'in beforeProcessing geri arama içindeki değişikliği yapabilir, ancak daha az etkili olur.

Şimdi sıralama ile ilgili sorun hakkında. Sunucudan döndürülen verilerin formatı garip görünüyor. Bunun yerine sadece

[ 
    {...}, 
    {...}, 
    ... 
    {...} 
] 

hiçbir şekilde, yanıt toplam sayfa sayısı hakkında herhangi bir bilgi yok

{ 
    "rows": [ 
     {...}, 
     {...}, 
     ... 
     {...} 
    ] 
} 

gibidir. Böylece, herhangi bir sunucu tarafında veriyi sıraya koyma, sayfalama veya filtreleme uygulamamanız gerektiğini düşünebilirim. Durumda loadonce: true seçeneğini kullanmalısınız. Bu, yerel yerel verisini (data ve _index iç parametrelerine kaydedilmiş JavaScript nesnesi olarak) döndürülen verileri kaydetmek için jqGrid'i bilgilendirir. İlk yüklemeden sonra jqGrid ilk datatype'u "local" olarak değiştirecek ve sıradaki tüm sayfalama ve sıralama istekleri sunucuyla iletişim kurmadan yerel olarak yapılacaktır.

Kılavuz sortname: "invdate", sortorder: "desc" seçeneğini kullanıyorsunuz, ancak kılavuzda invdate adında bir sütun yok.

Kendi sunucumdan yüklenen eski jqGrid yerine CDN'den ücretsiz jqGrid kullanmak için önerimi (önceki sorudaki cevabımda) yazdım. Free jqGrid, forceClientSorting: true seçeneğini belirtmenize izin verir, bu da istemcinin verileri ilk yüklemede sıraladığı anlamına gelir.

Devam edebilirim, ancak https://jsfiddle.net/OlegKi/mnf72611/3/ numaralı demoyu oluşturdum.Uygulamak istediğiniz şeylere yakın olması gerektiğini düşünüyorum.

+0

Oleg- Teşekkürler çok, bu gerçekten yardımcı oldu. JSOn hizmetini sunucudan alıp jqGrid'de görüntüleyerek uygulamamı basit tutmaya çalışıyorum. Ayrıca, 1. sütundaki herkese bir bağlantı eklemek istiyorum. Örneğin, "C14999" C14999 olacaktır, böylece kullanıcı bunu tıkladığında, bir "C14999" ile ilgili bazı bilgiler içeren yeni sayfa ve daha sonra "C14999" kimliğine dayalı bir jgGrid tablosu görüntüler. bunu yapmak mümkün mü? – user244394

+0

@ user244394: Rica ederim! Yapması çok kolay. Bir biçimlendirici: "showlink" 'i kullanabilir (bkz. [Wiki makalesi] (https://github.com/free-jqgrid/jqGrid/wiki/improvement-of-formatter:-%22showlink%22)). Değiştirilen demo https://jsfiddle.net/OlegKi/mnf72611/4/ – Oleg

+0

olacak Oleg - stringify için parametre serverResponse kullandığını fark ettim, ancak sunucudan gelen gerçek JSON'da sadece var serverResponse olmayacak [...], Peki JSON.stringify'a ("") nasıl ve ne geçiyorum? – user244394