HTML tablosunu C# kullanarak dosyayı indirmiyor Excel'e dışa aktarın.

Question

Umbraco web sitesi oluşturuyorum ve Umbraco'nun arka ucu için bir eklenti yaratıyorum, böylece kullanıcı bir HTML çalışma sayfasını bir HTML tablosundan dışa aktarabiliyor. Bunu yapmak için AngularJS ve C# denetleyicisini kullanıyorum. İşte dosyalarım.

//This is my C# Controller at /App_Code/ExportBlankDictionaryController.cs 

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.Mvc; 
using Umbraco.Web.Editors; 
using Umbraco.Core.Persistence; 
using System.Data.SqlClient; 
using System.Web.UI.WebControls; 
using System.Web.UI; 
using System.IO; 

namespace AngularUmbracoPackage.App_Code 
{ 
    [Umbraco.Web.Mvc.PluginController("AngularUmbracoPackage")] 
    public class ExportBlankDictionaryController : UmbracoAuthorizedJsonController 
    { 
     //[System.Web.Http.AcceptVerbs("GET", "POST")] 
     //[System.Web.Http.HttpGet] 
     public void ExportExcell() 
     { 
      var keys = new System.Data.DataTable("BlankDictionaryItems"); 
      keys.Columns.Add("Keys", typeof(string)); 
      keys.Columns.Add("Description", typeof(string)); 

      keys.Rows.Add("Enter First Dictionary Name Here", " "); 

      var grid = new GridView(); 
      grid.DataSource = keys; 
      grid.DataBind(); 

      HttpContext.Current.Response.ClearContent(); 
      HttpContext.Current.Response.BufferOutput = true; 
      HttpContext.Current.Response.AddHeader("Content-disposition", "attachment; filename=BlankDictionaryItems.xls"); 
      HttpContext.Current.Response.ContentType = "application/vnd.ms-excel"; 

      HttpContext.Current.Response.Charset = ""; 
      StringWriter sw = new StringWriter(); 
      HtmlTextWriter htw = new HtmlTextWriter(sw); 

      grid.RenderControl(htw); 

      HttpContext.Current.Response.Output.Write(sw.ToString()); 
      HttpContext.Current.Response.Flush(); 
      HttpContext.Current.Response.End(); 
     } 
    } 
} 

// This is my AngularJS controller at /App_Plugins/datatable/datatable.controller.js: 

angular.module("umbraco") 
    .controller("AngularUmbracoPackage.ExportBlankDictionaryController", function ($scope, keyResource) { 
     keyResource.exportToExcell().then(function (response) { 
      alert("Table Generated!"); 
     }) 
    }); 

Bu benim datatable.resource.js aynı dizin içinde dosya geçerli:

{ 
    propertyEditors:[ 
    { 
     name: "DataTable editor", 
     alias: "my.datatable.editor", 
     editor:{ 
      view: "~/app_plugins/datatable/table.html", 
      valueType: "JSON" 
     } 
    } 
    ], 
    javascript: [ 
    "~/app_plugins/datatable/datatable.controller.js", 
    "~/app_plugins/datatable/datatable.resource.js" 
    ] 
} 

:

// Adds the resource to umbraco.resources module: 
angular.module('umbraco.resources').factory('keyResource', 
    function ($q, $http) { 
     // The factory object returned 
     return { 
      // This calls the API controller we setup earlier 
      exportToExcell: function() { 
       console.log("button clicked"); 
       return $http.post("backoffice/AngularUmbracoPackage/ExportBlankDictionary/ExportExcell"); 
      } 
     }; 
    } 
); 

Gerekirse burada package.manifest.json dosyasıdır

İşte tablo.html dosyası olan görünümdür:

<div class="ExportDiv" ng-controller="AngularUmbracoPackage.ExportBlankDictionaryController"> 
    <table id="table1" class="table table-bordered" runat="server"> 
     <thead> 
      <tr> 
       <th>Key</th> 
       <th>Populate Dictionary Item Names in Key Column</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <td>Enter First Dictionary Name Here</td> 
       <td></td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

<button class="btn btn-success" ng-click="exportToExcel()">Export Table</button> 

Tamam

yüzden Umbraco sayfa yüklenirken, uyarı kutusu backoffice geliştiricisi bölümü açılır, ama İhracat Tablo düğmesini tıkladığınızda, hiçbir şey olmuyor çıkageldi. Bu düğmeye tıklandığında indirmek için bir Excel sayfası almaya çalışıyorum. Bunu nasıl yapabilirim? Bir şey mi eksik?

Answer 1

angular.module("umbraco") 
    .controller("AngularUmbracoPackage.ButtonController", function ($scope, keyResource) { 
     $scope.ButtonClickHandler = function(){ 
      console.log("clicked me!"); 
      keyResource.exportToExcell().then(function (response) { 
      //do something with the response from the server 
     } 
    }); 

sonra düğme elemanını değiştirmek ekleyin:

<button ng-controller="AngularUmbracoPackage.ButtonController" class="btn btn-success" ng-click="ButtonClickHandler()">Export Table</button>