Usage of DWZ in APS. NET WebForm (1), dwzwebform

Usage of DWZ in APS. NET WebForm (1), dwzwebform
1. Preface

In recent project development, the front-end framework DWZ was used. DWZ is a relatively good background management interface framework, but the officially published documents are really shameful, simple pages, a little irresponsible for their own products. At the same time, I would like to thank the netizen Shi for his enthusiastic help and help me a lot when I am a cainiao.

2. Introduction

Official Description: The DWZ rich client framework (jQuery RIA framework) is an open-source Ajax RIA framework developed by Chinese people based on jQuery. The design goal of the DWZ rich client framework is simple and practical, easy to expand, fast development, RIA ideas, and lightweight.

The advantage is that it can reduce the Compilation Time of Jquery in project development and focus on business development.

3. Use

Because the length is too long for reading, we plan to split the content into two parts. This post describes how to set up and use DWZ. The next post describes problems encountered in personal development.

1. Check DWZ in your project.

It is easy to do this. First download the latest DWZ package from the official website: Buy

(Figure 3.1.1)

To avoid conflicts and maintain the integrity of dwz files, we recommend that you create folders such as imags and js.

2. Build the Home Page

Find the Home Page example, paste the corresponding code into Index. aspx, modify the corresponding path, and then build, 3.2.1.

You may have the following questions: 1. Is it necessary to reference so many js files? 2. What does js initialization code mean? 3. What does target and rel in a tag mean?

I will answer the following questions one by one:

1. Is it necessary to reference so many js files?

The answer is no.

In the example, js is used to display all functions. In actual development, if the project is not involved, there is no need to reference it, such as rich text editing.

This framework has the following features: reference on the home page, which can be referenced on other subpages. The reason is that sub-pages are embedded on the home page in the form of div, so this effect can be achieved.

Back to the topic, you will find that references are divided into four aspects (css, external js, framework js, and language definition ). If you are sure that the rich text and file upload functions are not available in the project, remove the red area 3.2.2. Figure 3.2.3 shows the js required by the DWZ framework. When I first saw it, I shouted My God. In fact, this is the purpose of the DWZ development team to open source, each function is encapsulated into a js, so that debugging is convenient. In the bin folder of dwz, you will find that dwz. mini. js and dwz. mini. js combine the preceding js and compress it into a js. In project development, we can directly replace dwz. mini. js with the js shown in Figure 3.2.3, because we basically do not need to modify js. If you have to modify some js files, you can use gzjs. bat in the binfile to repackage dwz. mini. js.

Tip: if the introduction of dwz. mini. js directly from the binfile has no effect, you can copy it to the js folder.

 

(Figure 3.2.1)

(Figure 3.2.2)

(Figure 3.2.3)

2. What does js initialization code mean?

In one sentence: Initialize and define the resources required by the framework. As shown in 3.2.4, ①: load XML, which saves all the configurations required by the DWZ framework at the beginning. It can also be understood as a configuration file. ②: Defines the logon page URL. When the authentication identity fails, it is used to log on again. ③: Defines the status code, indicating the request result ④: defines the paging parameter ⑤: can be understood as a key-value pair, statusCode is ③, and message indicates the description of the status, return in json format. ⑥: HideMode: hidden mode of navTab component switching. Supported values include 'display' and 'offsets' negative offset values. Default Value: 'display' 7: debugging mode: Hide: callback: Call the initialization function. Callback: load the interface topic.

(Figure 3.2.4)

3. What does target and rel in a tag mean?

Target: page display mode. navTab displays the page as a tab, and dialog displays the page as a pop-up layer.

Rel: it can be understood as the page ID. This is especially important when you specify to refresh a page through js Code. In actual development, we recommend that you set a different ID for each interface, which is also more standardized.

 

3. Use of tag controls

The use of tags can be combined with demo examples and official documents.

 

 

 

The following chapter describes the issues that need attention in the development process.

An APSNET issue

The point of using ASP. net, is that you don't bother embed VB/C # code in the HTML Code. instead, you use CodeBehind to put all the codes in, and put all the design stuff in the webpage. imagine the situation that you may end up with, say you and a web designer working together on a project. you, as a coder, knows nothing about web design, and the web designer knows nothing about coding VB/C # as well. in the traditional embedded web programming language (PHP, ASP, etc .), the above senario is very hard to overcome. it becomes extremely difficult for both of you to work together. you may end up with telling him to finish the design first, then you can do you code, which is far more inefficient, than seperating the web design job and code behind up. I stronugly recommend you to read more asp.net books, thoroughly. then you will see the way to substitute <% =... %>

APSNET40 is just getting started. Every time you create a new web application and open defaultapsx, there will always be

You have set a master page. form has a selection option on the new Web form panel on the master page, removing the check box for the master page!