This is a set of ASP recently developed for my own use. net Control, which extends the original ASP. net control, combined with jquery, is used to develop the xx management system to view the most outgoing data and query pages. My final goal is to use the original ASP. just like webform development, you only need to drag the control and set properties to create pages with Ajax effects. At the same time, it does not destroy the original webform mechanism, I can still drag a button and send it a return event. Of course, unlike powerful ASP. NET Ajax or anthem, it does not have such passing ability. Next, I will introduce its usage and effects. You are welcome to give this cainiao some comments. It may not be available in the hall.
Idea Source
The idea of doing this set of controls comes from my new understanding of development, from initial drag controls to subsequent script flood, and finally back to drag controls, how to maintain the rapid development of drag controls and save rich scripts for a good user experience, Asp. net Ajax or anthem are not in my consideration. Do it yourself and find something to do for yourself. It's good. It's very idle recently ....
Next is the text.
Let's take a look at the following page:
This is an ordinary page in a simple order management system that I made for my girlfriend. It consists of three parts. I wrote it out. Of course, there are also several additions and deletions, the modification button is not truncated. The top two radio pages are equivalent to the tab page function. When you click one of them, it will jump to another page. There are some query functions in the middle, which everyone on the Earth knows. The following is a list and some paging buttons, and the Earth knows. This original page only uses the simplest ASP. Net Control and a paging user control. All functions are returned.
Next, let's start the transformation and replace it with my own controls.
- First, I put the second and third parts of the page into a div with the ID "tab1"
<div runat ="server" id ="tab1">//。。。。。。。。。。。。。。。。</div>
<Xxf: tabradio runat = "server" id = "radio1" groupname = "tab" divid = "tab1" hidden = "true" Checked = "true"/> <label for = "radio1"> order list </label> <xxf: tabradio runat = "server" id = "Radio2" groupname = "tab" divid = "tab2" hidden = "true"/> <label for = "Radio2"> product list </ label>
The divid attribute corresponds to the newly inserted Div. The checked attribute is used to indicate which tab is displayed after the page is loaded.
- Replace the "query" button. The new control inherits from the button and has a new property to indicate its corresponding paging control.
<Xxf: selectbutton id = "button1" runat = "server" text = "query" pagebreakcontrol = "PBS"/>
- Change the Repeater control. Now it is like this.
<xxf:Repeater ID="Repeater2" runat="server"onasynbind="Repeater2_AsynBind" >
The onasynbind event is used to bind data. Its code is as follows. When switching by PAGE and clicking the query button, the event function is used. Obtain parameters and bind data just like normal webform
protected void Repeater2_AsynBind(object sender, EventArgs e) { IProduce_ProductRepository produce_productRep = IoC.Resolve<IProduce_ProductRepository>(); string orderid = tbOrderid.Text; string clientid = tbClientid.Text; Repeater2.DataSource = produce_productRep.GetDetailList(false, clientid, orderid, pb2.Break_Param, pb2.Sort_Param); Repeater2.DataBind(pb2 .Break_Param.DataCount); }
- Finally, I replaced the paging user control and deleted all the background Code so that it could inherit one of my controls.
public partial class PageBreak : PageBreakBase { }
The paging control cannot be encapsulated too much, because the HTML code of each project is different, and it naturally has some foreground event functions, such
<TD width = "50"> . firstpage () "/> </TD>
The above is all to do. I cannot demonstrate it here, but now, the page that all functions need to be returned does not exist. After the page is loaded, the page is displayed based on the selection of radio, and data is loaded in Ajax mode. When you switch to radio, data is loaded only when the first display is displayed ). Pages are Ajax and queries are Ajax. I don't need to write any scripts, and the background code is still the webform event mode that I am familiar. In addition, currently, I only need to generate a small number of scripts, such as this page
script type="text/javascript"> //<![CDATA[var _Radio1 = new Xxf.Tab("tab1");
_Radio1.subscribe(pb1.dataBind,pb1);$(document).ready(function(){_Radio1.show();});var _Radio2 = new Xxf.Tab("tab2");
function button1_select(){pb2.param['tbClientid']=$('#tbClientid').val();pb2.param['tbOrderid']=$('#tbOrderid').val();pb2.dataBind();}_Radio2.subscribe(pb2.dataBind,pb2);//]]></script> No
The above is all the introductions. I hope you can give some comments.