2016-09-19 1 views
0

i ont la configuration suivante pour la version pivot Jqgrid cela a été extrait de code for pivot mais quand il a couru donné une erreur javascriptpourquoi jqGrid ne se charge pas?

de SCRIPT5007: Impossible d'obtenir la propriété « longueur » de référence jquery.jqGrid non définie ou nulle. min.js, ligne 504 caractère 98

comment résoudre ce problème?

les données se présente comme json de C#

voici mon action MVC

[AllowAnonymous] 
    [HttpGet] 
    public JsonResult GetProducts() { 

     var coll = new List<SampleProductModel>(); 

     //"CategoryName":"Beverages","ProductName":"Steeleye Stout","Country":"UK","Price":"1008.0000","Quantity":"65" 
     var p1 = new SampleProductModel { CategoryName = "Beverages", ProductName = "Steeleye Stout", Country = "UK", Price = "1008.0000", Quantity = "65" }; 
     coll.Add(p1); 


     //"CategoryName":"Beverages","ProductName":"Steeleye Stout","Country":"UK","Price":"1008.0000","Quantity":"65" 
     var p2 = new SampleProductModel { CategoryName = "Beverages", ProductName = "Big John", Country = "UK", Price = "1008.0000", Quantity = "65" }; 
     coll.Add(p2); 

     //{"CategoryName":"Beverages","ProductName":"Laughing Lumberjack Lager","Country":"USA","Price":"140.0000","Quantity":"10"}, 
     var p3 = new SampleProductModel { CategoryName = "Beverages", ProductName = "Laughing Lumberjack Lager", Country = "USA", Price = "140.0000", Quantity = "10" }; 
     coll.Add(p3); 


     //{"CategoryName":"Beverages","ProductName":"Laughing Lumberjack Lager","Country":"USA","Price":"140.0000","Quantity":"10"}, 
     var p4 = new SampleProductModel { CategoryName = "Beverages", ProductName = "Jims", Country = "USA", Price = "140.0000", Quantity = "10" }; 
     coll.Add(p4); 

     return Json(coll, JsonRequestBehavior.AllowGet); 
    } 

ici est mon code qui a été extrait à partir du lien ci-dessus et modifié pour prendre des données C# JSON

<!DOCTYPE html> 
<html> 
<head lang="en"> 

    <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/start/jquery-ui.css" /> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/css/ui.jqgrid.css" /> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js" integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU=" crossorigin="anonymous"></script> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/js/jquery.jqGrid.min.js"></script> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/js/i18n/grid.locale-en.js"></script> 
    <script> 

      jQuery(document).ready(function() { 
       jQuery("#grid").jqGrid('jqPivot', 
         "http://localhost:53721/Home/GetProducts", 
         // pivot options 
         { 
          xDimension : [ 
           {dataName: 'CategoryName', label : 'Category', width: 90}, 
           {dataName: 'ProductName', label : 'Product', width:90} 
          ], 
          yDimension : [ 
           {dataName: 'Country'} 
          ], 
          aggregates : [ 
           {member : 'Price', aggregator : 'sum', width:50, label:'Sum'}, 
           {member : 'Quantity', aggregator : 'sum', width:50, label:'Qty'} 
          ], 
          rowTotals: true, 
          colTotals : true 

         }, 
         // grid options 
         { 
          width: 700, 
          rowNum : 10, 
          pager: "#pager", 
          caption: "Amounts and quantity by category and product" 
         }); 
      }) 
    </script> 
</head> 
<body> 

<table id="grid"></table> 
<div id="pager"></div> 

</body> 
</html> 
+0

Vous essayez de charger les données de 'ports 53721', il ne fonctionnera pas si ce n'est pas le même port à partir de laquelle la page HTML est chargée. Voir [la même politique d'origine] (https://en.wikipedia.org/wiki/Same-origin_policy). De plus, vous ne devriez jamais poster une erreur dans 'jquery.jqGrid.min.js'. Vous devriez refaire le test en utilisant la version 'jquery.jqGrid.src.js' et envoyer le message d'erreur correspondant. Vous devez inclure 'grid.locale-en.js' avant' jquery.jqGrid.min.js' (ou 'jquery.jqGrid.src.js'). – Oleg

Répondre

0

Ne pas Je sais beaucoup de choses sur jqgrid, mais je soupçonnais que les versions que vous avez de jquery et jqgrid ne soient peut-être pas compatibles. Alors je l'ai regardé, et votre version de jqGrid semble être la version 4.6.0 où la version la plus récente semble être 5.0.2:

http://www.trirand.com/jqgridwiki/doku.php

Donc, essayez peut-être mettre à jour?

http://www.trirand.com/blog/?page_id=6

+0

im en utilisant la version gratuite au-delà de 4.6 appartenant à gurrido droite qui n'est pas libre –

+0

@Oleg salut oleg je sais que vous ne faites pas partie de ce fil, mais je sais que vous maintenez actuellement la version gratuite de jqgrid afin que vous ayez la gentillesse de me montrer comment résoudre ce problème? –

+0

@ANP: J'ai lu votre dernier commentaire par hasard seulement. Je reçois une notification uniquement si vous postez le commentaire sur une ancienne réponse ou sur un post où j'ai écrit * mon commentaire * avant. Vous pouvez rechercher [ici] (http://stackoverflow.com/users) pour "Oleg" et vous verrez 54 pages avec des utilisateurs ayant le même nom. Stackovrflow ne peut pas résoudre le nom si aucune autre information (ma réponse ou commentaire) n'existe. – Oleg