Asp.net| program ASP. NET, so that the network programmers to design the program when fully found the "design program" feeling, of course, more, they feel the asp.net handy. However, without the desire to be lazy there is no progress, if you rely solely on ASP.net own powerful function and do not want to other means, then you will soon find that people design programs than you will be much faster and lightly loose. Now, let's learn a few lazy ways to make others admire you behind you.
Friends who have used ASP must remember that many of the ASP's functions require a number of Third-party component implementations, such as file upload function is often implemented using ASPCNUP components. Using these components, not only can expand the functionality of the ASP program, but also greatly improve the speed of program development. We introduce the lazy means, that is to introduce some of our usual design closely related components.
One, Super data table: Superdatagrid
Asp. NET Datgrid is powerful and customizable, but because it is not designed specifically for database applications. So, when we connect to the database, we have to first connect to the database and then bind the data. And Superdatagrid is designed specifically for the database, so the cumbersome connection to the database we do not need to write. Need
Superdatagrid to simplify some of the properties of the DataGrid, using this control, we can easily implement the database data display, sorting, modify data, these functions, as long as a few lines of code can be. We are now looking at its use.
A) Display data tables
The following code demonstrates how to use Superdatagrid to simply display all the data in a datasheet:
<%@ Register tagprefix= "Super" namespace= "Superexpert.data"
Assembly= "Superexpert.superdatagrid"%>
<super:superdatagrid
Connectionstring= "Server=localhost; Uid=demo;pwd=secret;database=pubs "
Tablename= "Titles"
runat= "Server"/>
Please see the effect:
Http://www.superexpertcontrols.com/superdatagrid/samples/sample1.aspx
Now let's simply analyze the above code. The first exercise invokes the Superdatagrid control, which we will use in future examples. The second line, similar to the standard DataGrid, let's look at some of the properties of Superdatagrid:
ConnectionString: Because it is connected to the database, of course, the database connection statement. This parameter is the statement that connects the data;
TableName: To show the specific table, we'll define it here.
See here, we have felt "simple", but in practical applications, like this direct display of a table is very rare. So, we need more features. Most directly, we need the result of the return of the SELECT statement.
<%@ Register tagprefix= "Super" namespace= "Superexpert.data"
Assembly= "Superexpert.superdatagrid"%>
<super:superdatagrid
Connectionstring= "Server=localhost; Uid=sa;pwd=secret;database=northwind "
commandtext= "Select ProductName, CategoryName
From the products, Categories Where Products.categoryid=categories.categoryid "
runat= "Server"/>
Please see the effect:
Http://www.superexpertcontrols.com/superdatagrid/samples/sample2.aspx
The above code returns the result of the SELECT statement. Here, we see a new property:
CommandText: Like command, is a SELECT statement;
II) data ordering
In the DataGrid, data sorting is simple, but there are still a lot of code. Let's now look at how to sort the data in Superdatagrid:
<%@ Register tagprefix= "Super" namespace= "Superexpert.data"
Assembly= "Superexpert.superdatagrid"%>
<form runat= "Server" >
<super:superdatagrid
Connectionstring= "Server=localhost; Uid=sa;pwd=secret;database=pubs "
Tablename= "Titles"
Enablesorting= "True"
runat= "Server"/>
</form>
Please see the effect:
Http://www.superexpertcontrols.com/superdatagrid/samples/sample3.aspx
Look at the above code, in fact, set a Enablesortinga property is true. That is, turn on the sort function. One thing that needs careful attention is to include superdatagrid in the form.
III) Data Paging
In the ASP, a lot of friends will worry about paging, now, we look at how Superdatagrid page:
<%@ Register tagprefix= "Super" namespace= "Superexpert.data"
Assembly= "Superexpert.superdatagrid"%>
<form runat= "Server" >
<super:superdatagrid
Connectionstring= "Server=localhost; Uid=sa;pwd=secret;database=pubs "
Tablename= "Titles"
Enablepaging= "True"
Pagesize= "3"
Pagerstyle-mode= "NumericPages"
runat= "Server"/>
</form>
Please see the effect:
Http://www.superexpertcontrols.com/superdatagrid/samples/sample4.aspx
Let's look at some of the new properties of Superdatagrid:
EnablePaging: First of all, we have to open the data paging;
PageSize: Like a DataGrid, the number of bars per page of data displayed;
Pagerstyle-mode: Like a DataGrid, the page number is displayed;
IV) Data Editing
We know that in the DataGrid we can edit the data directly, but we rarely use this feature because it is not convenient or practical to edit the data, and there are more code writing. Now, Superdatagrid also provides this function, of course, we do not need to write so much code, just need simple settings can be, the other, Superdatagrid all help us to fix.
<%@ Register tagprefix= "Super" namespace= "Superexpert.data"
Assembly= "Superexpert.superdatagrid"%>
<form runat= "Server" >
<super:superdatagrid
Connectionstring= "Server=localhost; Uid=sa;pwd=secret;database=northwind "
Tablename= "Products"
Enableediting= "True"
Enablepaging= "True"
runat= "Server"/>
</form>
Please see the effect:
Http://www.superexpertcontrols.com/superdatagrid/samples/sample5.aspx
Look at the above code, if you need to edit the data, just add the enableediting attribute. Is it particularly simple? Of course, we still have to put the superdatagrid in the form.
V) caching
Asp. NET caching capabilities we already know very powerful, but, specifically to Superdatagrid, you will find it more convenient. When using Superdatagrid, the data that has been displayed is automatically cached to improve program efficiency. The caching feature can be set using the Cachescope property, and we can set the cache type to Application,,session and None.
Superdatagrid the default cache type is application, that is, all users share the cache, and if you use session, the cache is for special users only; If set to none, that is do not cache functionality.
By default, the cache is kept for 30 minutes, and of course we can use the CacheDuration property to set the cache time in minutes.
Second, super form: Superexpert DataForm
We've just seen that Superdatagrid already has data modification capabilities, but since data browsing and modification takes place at the same time, we actually rarely use that approach, and more, we say, a single record modification.
In the past, when we use the form to modify or increase the database data, we need to do a lot of work, such as setting the data format, etc., if the data is more, it is more cumbersome. Now, with Superexpert DataForm, we can simply implement these features.
Superexpert DataForm can automatically save or modify database data, you can also use it to automatically generate forms from the database (actually browsing the data), we can even customize the style to automatically modify, update the database table.
i) generate forms automatically from the database
Suppose we use the following SQL statement to generate a data table called Customersurveys:
Create Table Customersurvey
(
customer_id INT not NULL IDENTITY Primary Key,
Customer Varchar not NULL,
Age INT is not NULL,
Birthdate DateTime not NULL,
Comments Text
)
This datasheet has five fields, customer_id, Customer, age, birthdate, and comments. We can use Superexpert DataForm to automatically generate a form that we can use to add data directly to the datasheet.
<%@ Register tagprefix= "Super" namespace= "Superexpert.data"
Assembly= "Superexpert.dataform"%>
<body>
<super:sqldataform
Tablename= "Customersurvey"
Connectionstring= "Server=localhost; Uid=sa; Pwd=secret;database=pubs "
Mode= "AddRecord"
runat= "Server"/>
</body>
The specific effect is as follows:
Http://www.superexpertcontrols.com/dataform/samples/sample1.aspx
To better understand Superexpert DataForm, we must understand that those things can be generated automatically:
1, the form of the textbox width is based on the data table data width automatically generated;
2, fill in the form of data validation is automatically generated. If the data table requires that the data be not NULL, the input is required when the form is submitted, and if the data is int, the integer is required, and datetime data is required if the data is DateTime.
3. After clicking the Submit button, the data is automatically saved to the datasheet.
All we have to do is provide the data table name and database connection string.
(ii) Setting up DataForm mode
DataForm has the following modes:
1, AddRecord: increase the data model;
2, UpdateRecord: Modify a single data model;
3, updatetable: Batch modification data mode;
4, Custom: The submission of data can be set up their own logical verification;
In order to modify an existing data, we must set the DataForm mode to UpdateRecord. Then we have to make sure that we modify that piece of data, we uniquely determine the data through DataKeyField and Datakeyvalue, DataKeyField is the primary key of the datasheet, and the Datakeyvalue is the value of the primary key of a piece of data.
The following code modifies the third record in the datasheet:
<%@ Register tagprefix= "Super" namespace= "Superexpert.data"
Assembly= "Superexpert.dataform"%>
<body>
<super:sqldataform
Tablename= "Customersurvey"
Connectionstring= "Server=localhost; Uid=sa; Pwd=secret;database=pubs "
Datakeyfield= "customer_id"
Datakeyvalue= "3"
Mode= "UpdateRecord"
runat= "Server"/>
</body>
The specific effect is as follows:
Http://www.superexpertcontrols.com/dataform/samples/sample2.aspx
The above code sets mode to UpdateRecord, sets DataKeyField to customer_id, and sets Datakeyvalue to 3.
If we need to modify all the data in the datasheet, we can set the DataForm mode to updatetable. After you set up to modify the entire table, a navigation bar is generated above the data form, through which we can browse through all the data in the datasheet.
<%@ Register tagprefix= "Super" namespace= "Superexpert.data"
Assembly= "Superexpert.dataform"%>
<body>
<super:sqldataform
Tablename= "Customersurvey"
Connectionstring= "Server=localhost; Uid=sa; Pwd=secret;database=pubs "
Datakeyfield= "customer_id"
Mode= "Updatetable"
runat= "Server"/>
</body>
The specific effect is as follows:
Http://www.superexpertcontrols.com/dataform/samples/sample3.aspx
If we set the pattern to custom, we can set the action after submitting the form. For example, the following code implementation automatically transfers to the Thankyou.aspx page after submitting the form.
<%@ Register tagprefix= "Super" namespace= "Superexpert.data"
Assembly= "Superexpert.dataform"%>
<script runat= "Server" >
Sub Form_submit (s as Object, E as EventArgs)
Myform.save ()
Response.Redirect ("thankyou.aspx")
End Sub
</Script>
<body>
<super:sqldataform
Id= "MyForm"
Tablename= "Customersurvey"
Connectionstring= "Server=localhost; Uid=sa; Pwd=secret;database=pubs "
Mode= "Custom"
runat= "Server"/>
</body>
The specific effect is as follows:
Http://www.superexpertcontrols.com/dataform/samples/sample4.aspx
Three) set DataForm style
DataForm has four styles we can modify:
1, HeaderStyle: Define the header style of the data form;
2. LabelStyle: Define the label style of the data form;
3, Fieldstyle: Define the field style of the data form;
4, FooterStyle: Define the footer style of the data form;
DataForm also supports the following property settings:
Gridlines: Defines the line format for a data form, including: None, Both, horizontal, and vertical.
Height: Data form Control heights;
Width: data form control widths;
Boderstyle: Data table unilateral box format;
BorderWidth: Data table single-sided box width;
BorderColor: Data table one-sided frame color;
CellPadding: The size of the data form control;
cellspacing: Spacing between data form controls;
We now look at an example:
<%@ Register tagprefix= "Super" namespace= "Superexpert.data"
Assembly= "Superexpert.dataform"%>
<body>
<super:sqldataform
Headerstyle-backcolor= "Salmon"
Fieldstyle-backcolor= "Yellow"
Labelstyle-font-name= "Script"
Labelstyle-font-size= "28pt"
Footerstyle-backcolor= "Blue."
Cellpadding= "10"
cellspacing= "0"
Gridlines= "Both"
Borderstyle= "Dashed"
Bordercolor= "Red"
Borerwidth= "10px"
Labelstyle-backcolor= "LightGreen"
Tablename= "Customersurvey"
Connectionstring= "Server=localhost; Uid=sa; Pwd=secret;database=pubs "
runat= "Server"/>
</body>
The specific effect is as follows:
Http://www.superexpertcontrols.com/dataform/samples/sample5.aspx
IV) Custom layout of the DataForm
We can also add controls to design the data form layout, which can be added to the following controls:
Datatextbox
DataDropDownList
Dataradiobutton
Datacheckbox
Datalistbox
Dataradiobuttonlist
DataLabel
None of the controls extends the functionality of the standard controls. These controls have two properties: DataField and DataType. DataField lets you associate a control with a specific field of a database, datatype defines the type of input data. Here is an example of adding data:
<%@ Register tagprefix= "Super" namespace= "Superexpert.data"
Assembly= "Superexpert.dataform"%>
<script runat= "Server" >
Sub Form_submit (s as Object, E as EventArgs)
Myform.save ()
Response.Redirect ("thankyou.aspx")
End Sub
</Script>
<body>
<super:sqldataform
Id= "MyForm"
Tablename= "Customersurvey"
Connectionstring= "Server=localhost; Uid=sa; Pwd=secret;database=pubs "
runat= "Server" >
Customer Name:
<br>
<super:datatextbox
Datafield= "Customer"
runat= "Server"/>
<p>
Age:
<br>
<super:datatextbox
Datafield= "Age"
runat= "Server"/>
<p>
Birthdate:
<br>
<super:datatextbox
datafield= "Birthdate"
runat= "Server"/>
<p>
<asp:button
text= "Add New customer!"
runat= "Server"/>
<p>
</super:SqlDataForm>
</body>
Please see the effect:
Http://www.superexpertcontrols.com/dataform/samples/sample6.aspx
Three, super image Text control: Superexpert imagetext
We know that ASP. NET can generate images of text, but for most of my users, these features are hidden a bit deep. Superexpert Imagetext makes it easy to create images of text. We can generate images using any of the fonts that are installed on the server, or we can use all the image effects we're going to mention below to generate the image.
We can use Superexpert imagetext to quickly generate images, the advantage of which is that we can fully control the style of the text.
i) automatic generation of images
To use Superexpert Imagetext, we simply provide a unique ID and text that needs to be converted. The following example will generate "Hello World":
<%@ Register tagprefix= "Super" namespace= "Superexpert"
Assembly= "Superexpert.imagetext"%>
<super:imagetext
Id= "Ctrlhello"
text= "Hello world!"
runat= "Server"/>
Please see the effect:
Http://www.superexpertcontrols.com/imagetextbeta2/samples/sample1.aspx
For better results, we can set the font and color for the text, or set the image background, as the following examples are:
<%@ Register tagprefix= "Super" namespace= "Superexpert"
Assembly= "Superexpert.imagetext"%>
<super:imagetext
Id= "Ctrlcomic"
text= "Hello world!"
Font-name= "Comic Sans MS"
Font-size= "34"
Forecolor= "Darkblue"
runat= "Server"/>
<p>
<super:imagetext
Id= "Ctrlimpact"
text= "Hello world!"
Font-name= "Impact"
Font-size= "24"
Forecolor= "Red"
Backcolor= "BLACK"
runat= "Server"/>
Please see the effect:
Http://www.superexpertcontrols.com/imagetextbeta2/samples/sample2.aspx
What you need to know is, no matter what font, as long as the server installed on the use of the font on the line, as long as the image has been converted, all browsers can be displayed correctly.
II Shadow Effects
By setting the DropShadow property, we can convert the text to an image with a shadow effect:
<%@ Register tagprefix= "Super" namespace= "Superexpert"
Assembly= "Superexpert.imagetext"%>
<super:imagetext
Id= "Ctrldrop"
text= "Hello world!"
Font-name= "Impact"
Font-size= "34"
Dropshadow-display= "True"
dropshadow-xoffset= "3"
runat= "Server"/>
The specific effect is as follows:
Http://www.superexpertcontrols.com/imagetextbeta2/samples/sample3.aspx
For shadow effects, we can also set the following properties to enhance:
Dropshadow-xoffset: Horizontal Offset
Dropshadow-yoffset: Vertical Offset
Dropshadow-alpha: Set Shadow Transparency
Dropshadow-color: Set Shadow Color
III Rotating text effects
By setting the RotateFlip property of the text, we can rotate the text:
<%@ Register tagprefix= "Super" namespace= "Superexpert"
Assembly= "Superexpert.imagetext"%>
<super:imagetext
Id= "Ctrlhello"
text= "Hello world!"
Font-size= "24"
rotateflip= "Rotate90flipnone"
runat= "Server"/>
<p>
<super:imagetext
Id= "CtrlHello2"
text= "Hello world!"
Font-size= "24"
rotateflip= "Rotate180flipnone"
runat= "Server"/>
Please see the effect:
Http://www.superexpertcontrols.com/imagetextbeta2/samples/sample4.aspx
IV) Control image background
We can set the background to a progressive color, a picture, or a special pattern, and here is an example of a progressive color background:
<%@ Register tagprefix= "Super" namespace= "Superexpert"
Assembly= "Superexpert.imagetext"%>
<super:imagetext
Id= "Ctrlhello"
Background-gradient= "True"
Cellpadding= "4"
text= "Hello world!"
runat= "Server"/>
Please see the effect:
Http://www.superexpertcontrols.com/imagetextbeta2/samples/sample5.aspx
We can also use the Background-hatchstyle property to set special background patterns and pattern colors, and here is an image of a ripple pattern background:
<%@ Register tagprefix= "Super" namespace= "Superexpert"
Assembly= "Superexpert.imagetext"%>
<super:imagetext
Id= "Ctrlhello"
Cellpadding= "10"
Background-hatchstyle= "Weave"
Background-startcolor= "Green"
text= "Hello world!"
runat= "Server"/>
Please see the effect:
Http://www.superexpertcontrols.com/imagetextbeta2/samples/sample6.aspx
V. Multiple lines of text
You can achieve multiple lines of text by setting the width of the image:
<%@ Register tagprefix= "Super" namespace= "Superexpert"
Assembly= "Superexpert.imagetext"%>
<super:imagetext
Id= "Ctrlhello"
Text= "This is a long paragraph so demonstrates how can wrap text with the Imagetext control"
Cellpadding= "20"
Width= "200"
Backcolor= "Orange"
runat= "Server"/>
Please see the effect:
Http://www.superexpertcontrols.com/imagetextbeta2/samples/sample7.aspx
Vi. finalization of the image
If you do not want to regenerate the image every time the page changes, you can set the final property to true.
Iv. Summary
Some of the controls described above, we used in peacetime design may be more, very useful. While we are studying asp.net, we can learn how to use these tools to improve our work efficiency and effectiveness.
