Shulou(Shulou.com)06/03 Report--

Installation and deployment: development environment:

Java and SpringMVC are used in the background server.

The data is stored in the\ demo_web\ WEB-INF\ FileDatabase.txt file and does not need to rely on DB.

Eclipse Java EE IDE for Web Developers,Eclipse Version: Photon Release (4.8.0) was used.

Server: tomcat-7.0.90.

Import the project into eclipse:

Demo_web.zip is a compression package that directly converts the eclipse project.

You can decompress it directly to the workspace of eclipse and import it into the Existing Projects into Workspace project.

Deployment method:

Configure tomcat to associate with eclipse, add the project add to the list of tomcat applications, and start tomcat.

Procedure: visit:

When you deploy locally, you can access the home page through http://127.0.0.1:8080/demo_web/view?path=index.

Create a template:

There are three types of templates to create: form binding, cell binding, and table binding.

The demo_web package also contains three template SSJSON files: a form binding example, a cell binding example, and a table binding example, which allow users to create templates.

Form binding preview area description: if you select the template type drop-down menu, the preview area will change according to the template type, cell binding and table binding only ssjson template preview one area. As shown in the figure:

Figure 1: create a form binding template page

4. After the form template is uploaded successfully, the preview page looks like the following figure:

Figure 2: preview after uploading form binding template

5. If you need to upload a cell binding template or a table binding template, you need to click the "Type" drop-down menu and select the corresponding type before performing the upload operation.

6. After uploading the template and filling in the basic information of the template, click the Save button.

Administrative templates:

The list of administrative templates shows the template information that has been created in the system.

Click the download button of the corresponding template to download the ssjson file of the template, which can be directly imported into the SpreadJS designer for modification.

Click the fill-in button of the corresponding template to enter the form filling page.

Fill in:

Take the form binding template as an example, as shown in the figure:

Figure 3: example of a form binding template filling page

two。 New: reload the current template without retaining all the data that has been filled in.

3. New row: add a new row for the filled data, corresponding to the bound dataSource with one more data element (this button is not available in the cell binding template).

4. Save: save the filling data to the background file.

5. History: fill in the submitted historical data in the current template.

Historical data list:

As shown in the picture: click View to query the historical data.

Figure 4: fill in the list of historical data page

Historical data:

As shown in the figure:

Figure 5: fill in the historical data page

QA:Q: the local area network is inaccessible?

A: the SpreadJS control used in this Demo is unauthorized and can only be operated locally.

Q: form binding template, how to customize bound fields?

A: you can import the form binding template example .ssjson into the designer to view. The first row of the form binding template is the field name corresponding to dataSource, the field name shown in the second behavior, and the style corresponding to the third behavior table.

Q: cell binding template, how to customize the bound field?

A: you can import the example of the cell binding template .ssjson into the designer to view. The field name corresponding to the binding dataSource is defined in the corresponding cell in the way of [field].

Q: table binding template, how to customize bound fields?

A: in the first row below the header in the table template, you can define the column name in the way of [field]. In the code, you can create a new GC.Spread.Sheets.Tables.TableColumn () instance to map the relationship between the column name and the bound field. For specific methods, please refer to the demo,demo address bound to the table in the learning guide on the official website: https://demo.grapecity.com.cn/SpreadJS/TutorialSample/#/demos/tableBinding.

This approach is also used in this demo.

Q: when filling in the form, the style of the new row does not match the previous row?

A: because the template design style of the table is very flexible and diverse, this demo only uses the method of copying the previous row style to set the new row. In the specific application, you can set the table style according to your needs.

Click here to download Demo for SpreadJS in conjunction with Java for free

About Grape City

Empowered developer! Founded in 1980, Grape City is the world's leading software and service provider integrating development tools, business intelligence solutions, and management system design tools. Xi'an Grape City is its branch in China, providing software research and development services to the global market, and providing international advanced development tools, software and R & D consulting services for the informatization of Chinese enterprises. Grape City's controls and software products have won many awards at home and abroad, and have been widely used by hundreds of thousands of enterprises, schools and government agencies around the world.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.