Uncaught TypeError：$（...）。data（...）。saveAsPDFは関数ではありません。剣道グリッド

Question

私は剣道グリッドでpdfにデータをエクスポートしようとしています。

グリッド：

$("#tax_lists").kendoGrid({ 
     toolbar: ["excel","pdf"], 
     excel: { 
      allPages: true, 
      fileName: "Products.xlsx" 
     }, 
     pdf: { 
      allPages: true, 
      avoidLinks: true, 
      paperSize: "A4", 
      margin: { top: "2cm", left: "1cm", right: "1cm", bottom: "1cm" }, 
      landscape: true, 
      repeatHeaders: true, 
      template: $("#page-template").html(), 
      scale: 0.8 
     }, 
     dataSource: sData, 
     sortable: true, 
     resizable: true, 
      columns: [ 
      {hidden: true, field: "TaxStatementID",attributes:{"class":"tax_statement_id"}}, 
      {field: "Month", title: "Month"}, 
      {field: "AnnualSalary", title: "Annual Salary",attributes:{"class":"AnnualSalary"},footerTemplate: "<div><b>Sum</b> #= compute('.AnnualSalary')#</div>"}, 
      {field: "MonthlySalary", title: "Monthly Salary",attributes:{"class":"MonthlySalary"},footerTemplate: "<div><b>Sum</b> #= compute('.MonthlySalary')#</div>"}, 
      {field: "SlabNo", title: "Tax Slab"}, 
      {field: "MonthlyTax", title: "Monthly Tax", attributes:{"class":"monthly-tax"},footerTemplate: "<div><b>Sum</b> #= compute('.monthly-tax')#</div>"}, 
      {field: "TaxAdjustment", title: "Tax Adjustment",template:"#=TaxAdjustment#"}, 
      {field: "TaxAreas", title: "Tax Arrears"}, 
      {title: "Tax Payable",template:"#=adjustment_type==1?parseFloat(MonthlyTax)+parseFloat(TaxAdjustment)+parseFloat(TaxAreas):(parseFloat(MonthlyTax)+parseFloat(TaxAreas))-parseFloat(TaxAdjustment)#", attributes:{"class":"TaxPayable"},footerTemplate: "<div><b>Sum</b> #= compute('.TaxPayable')#</div>"}, 
      {hidden: true, field: "employee_id",attributes:{"class":"employee_id"}}, 
      {hidden: true, field: "employment_id",attributes:{"class":"employment_id"}}, 
      ], 
     }); 

まず、私は剣道ツールバーのPDFを試してみたが、それは働いていない、それは代わりにPDFにエクスポートするページをrefresesh。 次に、ボタンをグリッドの上部に置きます。

<button id="grid-pdf">Export to PDF</button> 

と機能に

関数定義：

$("#grid-pdf").kendoButton(
    { 
     click:function(){ 
     var grid = $("#tax_lists").data("kendoGrid").saveAsPDF(); 
     } 
    }); 

Compute function for calculating sum manually

function compute(){ 
    $(cls).each(function() { 
     if (cls==".AnnualSalary") { 
      AnnualSalary += parseInt($(this).text()); 
     }else if(cls==".MonthlySalary"){ 
      MonthlySalary += parseInt($(this).text()); 
     }else if(cls==".monthly-tax"){ 
      monthlyTax += parseInt($(this).text()); 
     }else{ 
      TaxPayable +=parseInt($(this).text()); 
     } 
    }); 
    if (cls==".AnnualSalary") { 
     return AnnualSalary; 
    }else if(cls==".MonthlySalary"){ 
     return MonthlySalary; 
    }else if(cls=".monthly-tax"){ 
     return monthlyTax; 
    }else{ 
     return TaxPayable; 
    } 
} 

を再びそれを失敗と言う：

Uncaught TypeError: $(...).data(...).saveAsPDF is not a function*

のリソースは私が使用：

<script type="text/javascript" src="<?=base_url('assets/plugins/kendo/jszip.min.js')?>"></script> 
<script type="text/javascript" src="<?=base_url('assets/plugins/kendo/kendo.all.min.js')?>"></script> 
<script type="text/javascript" src="<?=base_url('assets/plugins/kendo/pako_deflate.min.js')?>"></script> 

間違ってここに何が起こっているのか任意のアイデア...

Answer 1

あなたが問題を示す作業jsfiddleを提供する場合、それが良いだろう。

とにかく、任意のデータでコードを使用してjsfiddleを作成しました。あなたはそれを見つけることができますhere。一度詳細を入力すると、必要に応じてコードを調整することができます。

これはあなたのコードが変更されます。

$("#tax_lists").kendoGrid({ 
    toolbar: ["excel", "pdf"], 
    excel: { 
    allPages: true, 
    fileName: "Products.xlsx" 
    }, 
    pdf: { 
    allPages: true, 
    avoidLinks: true, 
    paperSize: "A4", 
    margin: { 
     top: "2cm", 
     left: "1cm", 
     right: "1cm", 
     bottom: "1cm" 
    }, 
    landscape: true, 
    repeatHeaders: true, 
    template: $("#page-template").html(), 
    scale: 0.8 
    }, 
    dataSource: { 
    data: [{ 
     "Month": 1, 
     "AnnualSalary": 9.2, 
     "MonthlySalary": 1994, 
     "MonthlyTax": "The Shawshank Redemption" 
    }] 
    }, 
    sortable: true, 
    resizable: true, 
    columns: [{ 
    hidden: true, 
    field: "TaxStatementID", 
    attributes: { 
     "class": "tax_statement_id" 
    } 
    }, { 
    field: "Month", 
    title: "Month" 
    }, { 
    field: "AnnualSalary", 
    title: "Annual Salary", 
    attributes: { 
     "class": "AnnualSalary" 
    } 
    }, { 
    field: "MonthlySalary", 
    title: "Monthly Salary", 
    attributes: { 
     "class": "MonthlySalary" 
    } 
    }, { 
    field: "SlabNo", 
    title: "Tax Slab" 
    }, { 
    field: "MonthlyTax", 
    title: "Monthly Tax", 
    attributes: { 
     "class": "monthly-tax" 
    } 
    }], 
});