2010-02-04 20 views
5

मेरे पास ASP.NET MVC व्यू पेज पर HTML तालिका है। अब मुझे इस टेबल को एक्सेल में निर्यात करना है।एक्सेल में HTML तालिका निर्यात करें

(1) मैं आंशिक दृश्य (Inquiries.ascx) का इस्तेमाल किया है (एंटिटी को LINQ का उपयोग करके) डेटाबेस से तालिका डेटा प्रदर्शित करने के (2) मैं रिकॉर्ड (उदाहरण: http://gregweber.info/projects/demo/flavorzoom.html) फिल्टर करने के लिए भी इस्तेमाल किया है UITableFilter प्लगइन

(3) किसी भी समय, मुझे दृश्य रिकॉर्ड को Excel में फ़िल्टर करना होगा।

अपने प्रतिक्रिया की सराहना करें।

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Mvc.Master" Inherits="System.Web.Mvc.ViewPage" %> 


<asp:Content ID="Content2" ContentPlaceHolderID="cphHead" runat="server"> 
<script src="../../Scripts/jquery.tablesorter.js" type="text/javascript"></script> 
    <script src="../../Scripts/jquery.uitablefilter.js" type="text/javascript"></script> 

<script type="text/javascript"> 
//Load Partial View 
$('#MyInquiries').load('/Home/Inquiries'); 

// To Apply Filter Expression using uiTableFilter plugin 
      $("#searchName").keyup(function() { 
       $.uiTableFilter($("#tblRefRequests"), this.value); 
       $("#tblRefRequests").tablesorter({ widthFixed: true, widgets: ['zebra'] }); 
      }); 


//Export the HTML table contents to Excel 
     $('#export').click(function() { 
//Code goes here 

}); 
</script> 
</asp:Content> 

//Main Content 
<asp:Content ID="Content1" ContentPlaceHolderID="cphContent" runat="server"> 
<h2 class="pageName">View All Inquiries</h2> 
<input type="submit" value="Export to Excel" id="export" /> 
<div id='MyInquiries'></div> 
</asp:Content> 

जोरदार टाइप आंशिक दृश्य उपयोगकर्ता नियंत्रण (Inquiries.ascx) उत्पन्न करने के लिए तालिका:

<table> 
    <tr><td valign ="middle">Filter Expression: <%= Html.TextBox("searchName")%></td></tr> 
    </table> 
    <table id="tblRefRequests" > 
    <thead> 
     <tr> 
      <th>Tx_ID</th> 
      <th>TX Date</th> 
      <th>Name</th> 
      <th>Email Address </th> 
      <th>Products</th> 
      <th>Document Name</th> 
     </tr> 
</thead> 

<tbody> 
    <% foreach (var item in Model) { %> 
     <tr> 
      <td visible =false><%= item.RequestID %></td> 
      <td><%= String.Format("{0:d}", item.RequestDate) %></td> 
      <td><%= item.CustomerName %></td> 
      <td><%= Html.Encode(item.Email) %></td> 
      <td><%= item.ProductName %></td> 
      <td><%= Html.Encode(item.DocDescription)%></td> 
     </tr> 
    <% } %> 
</tbody> 
    </table> 

यहाँ है

धन्यवाद

रीता

यहाँ मेरी दृश्य है पूछताछ को लोड करने के लिए मेरे नियंत्रक कोड आंशिक दृश्य:

[HttpGet] 
     public PartialViewResult Inquiries() 
     { 
var model = from i in myEntity.Inquiries 
    where i.User_Id == 5 
         orderby i.TX_Id descending 
         select new { 
          RequestID = i.TX_Id, 
          CustomerName = i.CustomerMaster.FirstName, 
          RequestDate = i.RequestDate, 
          Email = i.CustomerMaster.MS_Id, 
          DocDescription = i.Document.Description, 
          ProductName = i.Product.Name 
         }; 
      return PartialView(model); 
     } 

उत्तर

5

jQuery प्लगइन आज़माएं: table2csv। एक स्ट्रिंग के रूप में csv को वापस करने के लिए तर्क, वितरण: 'मान' का प्रयोग करें।

  1. पेज
  2. के लिए एक नियमित एचटीएमएल इनपुट बटन और एक .NET HiddenField जोड़े कि बटन "निर्यात"
  3. बुलाया में ऑनक्लिक ईवेंट जोड़ें जावास्क्रिप्ट समारोह बनाएँ:

    यहाँ एक कार्यान्वयन है , निर्यात, जो छुपा फ़ील्ड में table2CSV() के वापसी मान को संग्रहीत करता है, और वापस पोस्ट करता है।

  4. सर्वर hiddenfield पद डेटा (स्ट्रिंग के रूप csv)
  5. सर्वर एक csv फ़ाइल

के रूप में ब्राउज़र के लिए स्ट्रिंग आउटपुट प्राप्त करता है।

// javascript 
function Export() 
{  
    $('#yourHiddenFieldId').val() = $('#yourTable').table2CSV({delivery:'value'}); 
    __doPostBack('#yourExportBtnId', ''); 
} 

// c# 
if(Page.IsPostBack) 
{ 
    if(!String.IsNullOrEmpty(Request.Form[yourHiddenField.UniqueId])) 
    { 
     Response.Clear(); 
     Response.ContentType = "text/csv"; 
     Response.AddHeader("Content-Disposition", "attachment; filename=TheReport.csv"); 
     Response.Flush(); 
     Response.Write(Request.Form[yourHiddenField.UniqueID]); 
     Response.End(); 
    } 
} 
+0

मैंने कोशिश की। यह एक नई खिड़की में एक स्ट्रिंग के रूप में आ रहा है। लेकिन मैं एक्सेल फ़ाइल में चाहता हूँ। – Rita

+0

मैंने उदाहरण कोड जोड़ा। इसकी जांच - पड़ताल करें। और मुझे नहीं पता कि आप Excel को निर्यात करने पर कैसे सेट हैं। यह एक अन्य जानवर है। मैं सीएसवी निर्यात करने का सुझाव देते हैं। एक्सेल फ़ाइल बनाम एक CSV फ़ाइल निर्यात करने के लिए यह बहुत आसान, तेज़ और अधिक हल्का और सुरुचिपूर्ण है। आप इसे "एक्सेल के लिए सीएसवी" के रूप में बिल कर सकते हैं। यही तो मैं करता हूं। –

+0

काम पर जाने की तरह लग रहा है। जल्द ही जल्द ही अद्यतन करने की कोशिश करेंगे। – Rita

0

डाउनलोड घटक: NPM स्थापित तालिका करने के लिए एक्सेल

https://github.com/ecofe/tabletoexcel

var tableToExcel=new TableToExcel(); 
 
document.getElementById('button1').onclick=function(){ 
 

 
    tableToExcel.render("table"); 
 

 
}; 
 
document.getElementById('button2').onclick=function(){ 
 
    var arr=[ 
 
     ['LastName','Sales','Country','Quarter'], 
 
     ['Smith','23','UK','Qtr 3'], 
 
     ['Johnson','14808','USA','Qtr 4'] 
 
    ] 
 
    tableToExcel.render(arr,[{text:"create",bg:"#000",color:"#fff"},{text:"createcreate",bg:"#ddd",color:"#fff"}]); 
 
};

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