檔案上傳預覽

 通常在html中要上傳檔案只要將input type 設定成file就可以了

<input type="file" name="Attach" id="Attach" />

但是............如圖

只會出現檔名,有可能我選擇完就忘了.自己選了什麼相片(相信我.年紀到了就會這樣..)

加上兩段code 就可以解決這個問題了

紅色部份是相片預覽的部份,橘色部份是上傳的部份

<div class="form-group row">

       <div class="col-md-8">

         <img id="ShowPrePic" src="#" alt="your image" style="max-width:300px;max-height:300px;" />

       </div>

        <div class="col-md-4">

            <input type="file" name="Attach" id="AJpic" />

        </div>

  </div>

<script >

AJpic.onchange = evt => {

            const [file] = AJpic.files

            if (file) {

                ShowPrePic.src = URL.createObjectURL(file)

            }

        }

</script>

 

Telerik Grid 匯出Excel 加入時間檔名

 有時候使用者匯出excel時.會一直匯一直匯.......(迴圈中~

這時我們只好用上小技巧來讓使用者區分或是知道他們匯出的時間

如同紅色字體顯示.我們只要加上簡單的C#的DateTime.Now.ToString().....

就可以功能的實現這個功能了!

 .Excel(excel => excel

                        .FileName(DateTime.Now.ToString("yyyy-MM-dd-HH-mm-ss")+".xlsx")

                        .ProxyURL(Url.Action("StaticsExcelExport", "Uniform"))

                    )

Telerik Grid 匯出Excel 沒反應

寫程式哪有不犯蠢的.今天再次對自己示範了一次 

在Grid 裡要匯出excel 

於是我加了

.ToolBar(tools => tools.Excel())

也加了

.Excel(excel => excel
        .FileName("Kendo UI Grid Export.xlsx")
        .Filterable(true)
        .ProxyURL(Url.Action("Excel_Export_Save", "Grid"))
    )

但是如圖所示,按了就是沒反應...就只給我橘色的框.

左思右想.不明白.又回頭看了看範例檔(還不止看了一次XD)

登愣~~~原來我少了基本的引用

<script src="//cdnjs.cloudflare.com/ajax/libs/jszip/2.4.0/jszip.min.js"></script>

加了之後就可以使用了...掯(有蠢到~

完整官網範例如下:

<script src="//cdnjs.cloudflare.com/ajax/libs/jszip/2.4.0/jszip.min.js"></script>

@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.ProductViewModel>()
    .Name("grid")
    .Columns(columns => {
         columns.Bound(p => p.ProductName).Width(300)
                .ClientFooterTemplate("Total Count: #=count#")
                .ClientGroupFooterTemplate("Count: #=count#");
         columns.Bound(p => p.UnitPrice).Width(300);
         columns.Bound(p => p.UnitsOnOrder).Width(300)
                .ClientFooterTemplate("Average: #=average#")
                .ClientGroupFooterTemplate("Average: #=average#").Exportable(false);
         columns.Bound(p => p.UnitsInStock).Width(300)
                .ClientFooterTemplate("Min: #= min # Max: #= max #")
                .ClientGroupHeaderTemplate("Units In Stock: #= value # (Count: #= count#)");
     })
    .ToolBar(tools => tools.Excel())
    .Pageable()
    .Sortable()
    .Groupable()
    .Excel(excel => excel
        .FileName("Kendo UI Grid Export.xlsx")
        .Filterable(true)
        .ProxyURL(Url.Action("Excel_Export_Save", "Grid"))
    )
    .Reorderable(r => r.Columns(true))
    .Resizable(r => r.Columns(true))
    .ColumnMenu()
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(7)
        .Group(g => g.Add(p => p.UnitsInStock))
        .Aggregates(aggregates =>
        {
            aggregates.Add(p => p.UnitsInStock).Min().Max().Count();
            aggregates.Add(p => p.UnitsOnOrder).Average();
            aggregates.Add(p => p.ProductName).Count();
            aggregates.Add(p => p.UnitPrice).Sum();
        })
        .Read(read => read.Action("Excel_Export_Read", "Grid"))
    )
)

https://demos.telerik.com/aspnet-mvc/grid/excel-export