6

में छिपे हुए कॉलम निर्यात नहीं कर सकता मैं केंडो ग्रिड पर कुछ कॉलम छिपाना चाहता हूं और उन्हें दृश्यमान कॉलम के रूप में एक्सेल में निर्यात करना चाहता हूं। हालांकि, का उपयोग करके छुपा (सत्य) या दृश्यमान (झूठा) कोई समझ नहीं आता है और इन फ़ील्ड को निर्यात नहीं किया जाता है। this पृष्ठ पर कामकाज काम नहीं कर रहा है। कोई उपाय?केंडो ग्रिड

दृश्य:

@(Html.Kendo().Grid<ContactViewModel>() 
    .Name("Grid") 
    .Columns(columns => 
     { 
      columns.Bound(m => m.NameSurname).Title("Name Surname").Width("%100"); 
      columns.Bound(m => m.InstituteName).Title("Institute Name").Width("250px"); 
      columns.Bound(m => m.CityName).Title("City").Width("145px"); 
      columns.Bound(m => m.RegionName).Title("Region").Width("145px"); 
      columns.Bound(m => m.ContactMobile).Title("Mobile").Width("125px"); 
      columns.Bound(m => m.ContactAddress).Title("Address").Hidden(true); //I want to export these fields 
      columns.Bound(m => m.ContactAddress).Title("Address").Visible(false); //I want to export these fields  
     }) 
    .ToolBar(toolbar => 
     { 
      toolbar.Template(@<text> 
       <div class="toolbar">       
        <button class="btn btn-primary btn-xs pull-right k-button k-button-icontext k-grid-excel"> 
         <span class="k-icon k-excel"></span> 
         Liste (xls) 
        </button> 
       </div> 
      </text>); 
     }) 

    .Excel(excel => excel 
     .FileName("List.xlsx") 
     .Filterable(true) 
     .AllPages(true) 
     .ProxyURL(Url.Action("Excel_Export_Save", "Controller")) 
    ) 
    .DataSource(dataSource => dataSource 
     .Ajax() 
     .Read(read => read.Action("Index_Read", "Controller")) 
     .ServerOperation(false) 
     .PageSize(12) 
     ) 
    ) 
) 

उत्तर

1

इस समाधान Plunker देखें, Telerik वेबसाइट पर समाधान का सुझाव दिया। अपनी निर्यात कार्यक्षमता में कॉलम दिखाने के लिए, उस ग्रिड के 'एक्सेल एक्सपोर्ट' ईवेंट को बाध्य करें।

var exportFlag = false; 
$("#grid").data("kendoGrid").bind("excelExport", function (e) { 
    if (!exportFlag) { 
    // e.sender.showColumn(0); for demo 
    // for your case show column that you want to see in export file 
     e.sender.showColumn(5); 
     e.sender.showColumn(6); 
     e.preventDefault(); 
     exportFlag = true; 
     setTimeout(function() { 
      e.sender.saveAsExcel(); 
     }); 
    } else { 
     e.sender.hideColumn(5); 
     e.sender.hideColumn(6); 
     exportFlag = false; 
    } 
}); 

डेमो: छुपाएं प्रथम स्तंभ और निर्यात फ़ाइल में शो

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <base href="http://demos.telerik.com/kendo-ui/grid/excel-export"> 
 
    <style> 
 
    html { 
 
     font-size: 12px; 
 
     font-family: Arial, Helvetica, sans-serif; 
 
    } 
 
    </style> 
 
    <title></title> 
 
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.318/styles/kendo.common-material.min.css" /> 
 
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.318/styles/kendo.material.min.css" /> 
 
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.318/styles/kendo.dataviz.min.css" /> 
 
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.318/styles/kendo.dataviz.material.min.css" /> 
 

 
    <script src="http://cdn.kendostatic.com/2015.1.318/js/jquery.min.js"></script> 
 
    <script src="http://cdn.kendostatic.com/2015.1.318/js/jszip.min.js"></script> 
 
    <script src="http://cdn.kendostatic.com/2015.1.318/js/kendo.all.min.js"></script> 
 
</head> 
 

 
<body> 
 
    <div id="example"> 
 
    <div id="grid" style="width: 900px"></div> 
 
    <script> 
 
     $("#grid").kendoGrid({ 
 
     toolbar: ["excel"], 
 
     excel: { 
 
      fileName: "Kendo UI Grid Export.xlsx", 
 
      proxyURL: "http://demos.telerik.com/kendo-ui/service/export", 
 
      filterable: true 
 
     }, 
 
     dataSource: { 
 
      type: "odata", 
 
      transport: { 
 
      read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Products" 
 
      }, 
 
      schema: { 
 
      model: { 
 
       fields: { 
 
       UnitsInStock: { 
 
        type: "number" 
 
       }, 
 
       ProductName: { 
 
        type: "string" 
 
       }, 
 
       UnitPrice: { 
 
        type: "number" 
 
       }, 
 
       UnitsOnOrder: { 
 
        type: "number" 
 
       }, 
 
       UnitsInStock: { 
 
        type: "number" 
 
       } 
 
       } 
 
      } 
 
      }, 
 
      pageSize: 7 
 
     }, 
 
     sortable: true, 
 
     pageable: true, 
 
     columns: [{ 
 
      width: "10%", 
 
      field: "ProductName", 
 
      title: "Product Name", 
 
      hidden: true 
 
     }, { 
 
      width: "10%", 
 
      field: "UnitPrice", 
 
      title: "Unit Price" 
 
     }, { 
 
      width: "10%", 
 
      field: "UnitsOnOrder", 
 
      title: "Units On Order" 
 
     }, { 
 
      width: "10%", 
 
      field: "UnitsInStock", 
 
      title: "Units In Stock" 
 
     }] 
 
     }); 
 
     
 
     
 
     var exportFlag = false; 
 
$("#grid").data("kendoGrid").bind("excelExport", function (e) { 
 
    if (!exportFlag) { 
 
     
 
     e.sender.showColumn(0); 
 
     e.preventDefault(); 
 
     exportFlag = true; 
 
     setTimeout(function() { 
 
      e.sender.saveAsExcel(); 
 
     }); 
 
    } else { 
 
     e.sender.hideColumn(0); 
 
     exportFlag = false; 
 
    } 
 
}); 
 
    </script> 
 
    </div> 
 

 

 
</body> 
 

 
</html>

+0

धन्यवाद

ViewModel कुछ इस तरह है उत्तर के लिए एस है। लेकिन, इस मुद्दे को बनाने से पहले, मैंने उस पृष्ठ पर उल्लिखित सभी चरणों को लागू किया था। दूसरी तरफ, जैसा कि आप देखते हैं मैं ग्रिड बनाने के लिए जावास्क्रिप्ट के बजाय लपेटकर उपयोग करता हूं। तो, मैं mt ग्रिड (@ (Html.Kendo()। ग्रिड ()) में जावास्क्रिप्ट विधि को कैसे अनुकूलित कर सकता हूं? –

+0

केंडो ग्रिड कोड-एमवीसी कोड बनाना जारी रहेगा क्योंकि यह छुपा हुआ है (सत्य) ; उन स्तंभों के लिए जिन्हें आप – 111

+0

नहीं देखना चाहते हैं, आप बस कुछ jquery कोड जोड़कर कोशिश करें: ग्रिड कॉलम को दिखाने/छिपाने के लिए उस ग्रिड के 'एक्सेल एक्सपोर्ट' ईवेंट हैंडलर को बांधें .. जैसा कि मैंने आपको अपने उदाहरण – 111

1

मैं इस उदाहरण भी साथ प्रयास करते हैं, यह एक ही है के रूप में अपने पिछले जवाब सिर्फ jQuery बाध्यकारी घटना हो जाएगा विभिन्न।

आपको ग्रिड इवेंट Events(x => x.ExcelExport("excelExport")) और jQuery function excelExport(e) {} जोड़कर कोड में बदलाव करने की आवश्यकता है। ग्रिड कॉलम को छुपाने के लिए केवल Hidden(true) का उपयोग करें।

public class ContactViewModel 
    { 
     public string NameSurname { get; set; } 

     public string InstituteName { get; set; } 

     public string CityName { get; set; } 

     public string RegionName { get; set; } 

     public string ContactMobile { get; set; } 

     public string ContactAddress { get; set; } 
    } 

नियंत्रक हो जाएगा::

public class TestController : Controller 
    { 
     public ActionResult Index() 
     { 
      return View(); 
     } 

     public ActionResult Index_Read([DataSourceRequest]DataSourceRequest request) 
     { 
      var listOfContactViewModel = new List<ContactViewModel>() { 
      new ContactViewModel(){ NameSurname = "N1", InstituteName = "I1", CityName ="C1",RegionName = "R1",ContactMobile = "M1", ContactAddress = "C1" }, 
      new ContactViewModel(){ NameSurname = "N2", InstituteName = "I2", CityName ="C2",RegionName = "R2",ContactMobile = "M2", ContactAddress = "C2" }, 
      new ContactViewModel(){ NameSurname = "N3", InstituteName = "I3", CityName ="C3",RegionName = "R3",ContactMobile = "M3", ContactAddress = "C3" }, 
      new ContactViewModel(){ NameSurname = "N4", InstituteName = "I4", CityName ="C4",RegionName = "R4",ContactMobile = "M4", ContactAddress = "C4" }, 
      new ContactViewModel(){ NameSurname = "N5", InstituteName = "I5", CityName ="C5",RegionName = "R5",ContactMobile = "M5", ContactAddress = "C5" } 
      }; 

      return Json(listOfContactViewModel.ToDataSourceResult(request),JsonRequestBehavior.AllowGet); 
     } 

     [HttpPost] 
     public ActionResult Excel_Export_Save(string contentType, string base64, string fileName) 
     { 
      var fileContents = Convert.FromBase64String(base64); 
      return File(fileContents, contentType, fileName); 
     } 
    } 

और देखें इस के लिए:

<h2>Index</h2> 

@(Html.Kendo().Grid<KendoUIMVC5.Models.ContactViewModel>() 
    .Name("Grid") 
    .Events(x => x.ExcelExport("excelExport")) 
    .Columns(columns => 
     { 
      columns.Bound(m => m.NameSurname).Title("Name Surname").Width("%100"); 
      columns.Bound(m => m.InstituteName).Title("Institute Name").Width("250px"); 
      columns.Bound(m => m.CityName).Title("City").Width("145px"); 
      columns.Bound(m => m.RegionName).Title("Region").Width("145px"); 
      columns.Bound(m => m.ContactMobile).Title("Mobile").Width("125px"); 
      columns.Bound(m => m.ContactAddress).Title("Address").Hidden(true); //I want to export these fields 
      columns.Bound(m => m.ContactAddress).Title("Address").Hidden(false); //I want to export these fields 
     }) 
     .ToolBar(toolbar => 
     { 
      toolbar.Template(@<text> 
       <div class="toolbar"> 
        <button class="btn btn-primary btn-xs pull-right k-button k-button-icontext k-grid-excel"> 
         <span class="k-icon k-excel"></span> 
         Liste (xls) 
        </button> 
       </div> 
      </text>); 
     }) 
    .Excel(excel => excel 
       .FileName("List.xlsx") 
       .Filterable(true) 
       .AllPages(true) 
        .ProxyURL(Url.Action("Excel_Export_Save", "Test")) 
      ) 
     .DataSource(dataSource => dataSource 
      .Ajax() 
      .Read(read => read.Action("Index_Read", "Test")) 
      .ServerOperation(false) 
      .PageSize(12) 
      ) 
) 


<script type="text/javascript"> 
    var exportFlag = false; 
    function excelExport(e) 
    { 
     if (!exportFlag) { 
      e.sender.showColumn(5); 
      e.sender.showColumn(6); 
      e.preventDefault(); 
      exportFlag = true; 
      setTimeout(function() { 
       e.sender.saveAsExcel(); 
      }); 
     } else { 
      e.sender.hideColumn(5); 
      e.sender.hideColumn(6); 
      exportFlag = false; 
     } 
    } 
</script> 
+0

'Kendo.Mvc.UI.Fluent।GridEventBuilder 'में' ExcelExport 'की परिभाषा नहीं है और' ExcelExport 'प्रकार का पहला तर्क स्वीकार करने वाला कोई एक्सटेंशन विधि' Kendo.Mvc.UI.Fluent.GridEventBuilder 'नहीं मिल सकता है (क्या आप एक निर्देश या असेंबली संदर्भ का उपयोग कर रहे हैं?) त्रुटि आई :( –

+1

केंडो.एमवीसी संस्करण समस्या हो सकती है, मैं kendo.mvc के v2014.3.1125.545 संस्करण का उपयोग करता हूं। ऑब्जेक्ट ब्राउज़र में केंडो.एमवीसी डीएल का संदर्भ देखें, क्लास ग्रिडवेन्टबिल्डर है जो ExcelExport (स्ट्रिंग हैंडलर) विधि के साथ है, तो यह काम करेगा। अन्यथा आपको kendo.mvc – 111

+0

के अद्यतन संस्करण का उपयोग करना होगा हां, यह संस्करण समस्या प्रतीत होता है ... मुझे लगता है कि जावास्क्रिप्ट विधि जोड़कर इसे करने का कोई तरीका नहीं है, है ना? धन्यवाद ... –

संबंधित मुद्दे