SNF Rapid Development Platform 3.0--asp.net MVC4 powerful export and bulk import without uploading files to excel

Data import and export, in many systems are more common, this import and export operations, in the WinForm is relatively easy to implement, but on the web How should we implement it? This paper mainly introduces the use of Mvc4+easyui features, and combined with the file upload control, the implementation of the file does not need to upload to the server can be immediately processed and displayed, and then confirm the data written to the database process.

We know that thereis a difference between the processing of Excel and WinForm on the Web , if it is done on the web, we need to upload the Excel document to the server and then read the file for display. However , it is a challenge to implement the same technology as WinForm, which does not need to be uploaded to the server, but is read directly on SNF.

Currently, the functional requirements of the SNF import component are as follows:

1. to be universal, not a single page of the same work to do again, even if replication is not because the maintenance costs are too high.

2. to have an import preview, verify that the data is correct before saving.

3. do not display True/false or 1/0 for formatting such data types.

4. You can delete a row for the imported preview data.

5. You can download the import template.

6. simple and practical to operate

7. Web Import also do not upload to the server before the way to read, but also like WinForm do not upload to the server for direct reading. We all know that the requirements of BS is still more difficult, no way since there is a need to think of ways.

In WinForm, our interface for processing Excel data import is shown below.

The main interface on the web is shown below.

The import interface looks like this

The effects are displayed after the file is selected, and the import file valid columns 1 and 0 are formatted as follows

After confirming the data is not a problem, click Save to import the data after successful following prompt:

To import a template:

2 , Web processing logic and code for data import

In order to implement the data import and export operation on the web, we need to add two buttons, one is the import button and the other is the export button.

class="easyui-linkbutton" data-bind="Click:importclick  "href="#" icon="icon-page_white_excel" plain="true" title=" import "> Import </a></ Div>

The input JS processing code is shown below.

// Import            this. Importclick = function () {        '(role-Import role data) ' Importroletemplate ' system role-template '- Api-sys-role-postimportrole'icon-group');

The above is mainly a pop-up window (above the Import Data window), to facilitate customers to select Excel files and save data or download import templates and other operations.

Then in import.cshtml's view code, we need to initialize the DataGrid and the associated interface elements, and the code to initialize the DataGrid is shown below.

<divclass="Z-toolbar"> <a id="A_save"href="#"plain="true" class="Easyui-linkbutton"icon="Icon-save"title="Save Import data"Data-bind="Click:saveclick"> Save Import data </a> <a id="A_delete"href="#"plain="true" class="Easyui-linkbutton"icon="Icon-cross"title ="Delete"Data-bind="Click:deleteclick"> Delete </a> <a id="A_refresh"href="#"plain="true" class="Easyui-linkbutton"icon="Icon-arrow_refresh"title="Refresh"Data-bind="Click:refreshclick"> Refresh </a> <div style="position:absolute; right:10px;"> <a id="A_downloadfile"href="#"target="_blank"  class="Icon-page_excel"title="template. xls"Data-bind="attr: {' title ': Form.templatename},click:downloadfileclick"> &nbsp;&nbsp;<span data-bind="Text:form.templateName"style="margin-left:5px;"></span></a> </div> </div> <table id="Grid"Data-bind="Datagrid:grid"> </table>

3. SNF Standard data export operation on the Web

Show Add Export button:

<a href="#" plain="true"class="  Easyui-splitbutton" data-options="menu: ' #dropdown1 ', iconcls: ' Icon-download ' "  data-bind="click:downloadclick"  > Export </a>

Author: Wang Chuntin 2015-01-22

Author Blog:http://www.cnblogs.com/spring_wang

Original: http://www.cnblogs.com/spring_wang/p/4240939.html

If you feel good, please reprint.

SNF Rapid Development Platform 3.0--asp.net MVC4 powerful export and bulk import without uploading files to excel