Introduction to ASP. Aries 3: Develop a list page and manipulate Sany

Objective:

Aries framework is the development framework after all, so the focus is to write code, so that developers will not be unemployed, ha.

Step 1: Create a new HTML

650) this.width=650; "src=" Http://images2015.cnblogs.com/blog/17408/201611/17408-20161115164800076-1844630651.png "/>

To build an HTML, there are three main steps:

1: Introduce ARIES.LOADER.JS2: get a table tag 3:new a Ar.datagrid

Of course, although only so little code, I also from userlist.html copy come over to change.

Step Two: Configure the menu permissions and run F5.

Configure menu permissions on the previous article, do not repeat. (PS: Reuse the previous menu and change the menu path directly.) ）

650) this.width=650; "Src=" http://images2015.cnblogs.com/blog/17408/201611/17408-20161115165440435-566031455.png "/>

The effect of F5 after operation is this:

650) this.width=650; "src=" Http://images2015.cnblogs.com/blog/17408/201611/17408-20161115165938342-2033938421.png "/>

ObjName are all article, so the configuration is the same.

But the edited and deleted action columns are missing? (because no inline edits are specified, and no code is added, so it's wooden)

after the base configuration header is configured, users come here to dream B, because they start to have a variety of needs to be implemented through the code:

Step 3: Set the JS smart tip in HTML:

To start writing JS code, in order to have the perfect smart hints in JS, you need to set up this:

With smart tips, you knock JS Smart, or you can only go around from the demo copy code.

I can say this function, in fact, I just know it!!!

650) this.width=650; "Src=" http://images2015.cnblogs.com/blog/17408/201611/17408-20161115173426154-313267437.png "/>

Step 4: Manipulate the query ribbon1: What if I add the default data sorting criteria? (Options for Easyui parameters)

var dg = new AR.    DataGrid ("article", "article", "grid"); Dg.options = {sortname: "Createtime desc"};d g.bind ();

What if I have multiple conditional orders? (Simplified the SortOrder attribute of the Easyui)

var dg = new AR.    DataGrid ("article", "article", "grid"); Dg.options = {sortname: "Createtime asc,title desc"};d g.bind ();

2: What if I add the default query criteria?

650) this.width=650; "Src=" http://images2015.cnblogs.com/blog/17408/201611/17408-20161115174250201-662901030.png "/>

Here are a few caveats to the default conditions:

1: The condition is permanent, and every query on the interface will be taken. 2: If the Query box field is the same as this, it will be covered by the query box (if the query box has a value).

3: There is a friend of frustration asked, want to query conditions only once, disappear how to do?

Think instead of asking: After the page is loaded, clear the condition, so the correct code is: (To understand the Easyui parameters in the event)

650) this.width=650; "src=" Http://images2015.cnblogs.com/blog/17408/201611/17408-20161115175531107-1079091240.png "/>

4: Want to manipulate the query box, to fill it with a value to do?

For example, the page loads just like this:

650) this.width=650; "Src=" http://images2015.cnblogs.com/blog/17408/201611/17408-20161115181616607-933860541.png "/>

There are two solutions:

1: Just fill in the value, but do not trigger the query criteria (another thought is the list after the assignment of the value)

650) this.width=650; "src=" Http://images2015.cnblogs.com/blog/17408/201611/17408-20161115181924060-1208718570.png "/>

Someone writes this line of code to Dg.bind () and does not see the effect asking why not?

Answer: Because the event is asynchronous.

2: Fill in the value, and according to the value of the filter condition (a change of mind, that is, the query box after the construction of the assigned value)

650) this.width=650; "Src=" http://images2015.cnblogs.com/blog/17408/201611/17408-20161115182248810-487983025.png "/>

Results:

650) this.width=650; "Src=" http://images2015.cnblogs.com/blog/17408/201611/17408-20161115182258967-605534464.png "/>

5: What do I do if I don't want to reset the button?

var dg = new AR.    DataGrid ("article", "article", "grid"); Dg. Search.BtnReset.isHidden = True;...dg.bind ()

6: What do you want to do with the entire query box?

var dg = new AR.    DataGrid ("article", "article", "grid"); Dg. Search.ishidden = True;...dg.bind ()

7: What if I want to add a custom query condition?

Configure header increment field, adjust ordinal, hide, search.

650) this.width=650; "src=" Http://images2015.cnblogs.com/blog/17408/201611/17408-20161115185113685-1386488819.png "/>

8: What do I do to add a custom button to the Query button and reset button?

Can only tell you: DG. Search.btnquery. $target get the JQ object and then insert a node behind it with the JQ operation.

9: What do I do if I want to replace the entire query box with custom HTML?

Dg. Search. $target = $ (' Node ID ');

10: What do I do if I want to customize the text title of the query box?

Configuration header: Formatting rules (Title property).

650) this.width=650; "src=" Http://images2015.cnblogs.com/blog/17408/201611/17408-20161115183518388-2109848135.png "/>

11: What if the query box wants to become a range query?

Configuration header: Formatting rules (clone property).

650) this.width=650; "src=" Http://images2015.cnblogs.com/blog/17408/201611/17408-20161115184249217-1350297925.png "/>

Effect:

650) this.width=650; "Src=" http://images2015.cnblogs.com/blog/17408/201611/17408-20161115184334748-804460978.png "/>

12: What do I do if I want to ask for a query, interception conditions or additional conditions?

var dg = new AR.  DataGrid ("article", "article", "grid"); ..... dg.    Search.BtnQuery.onBeforeExecute = function (para) {alert (Json.stringify (para)); } dg.bind ();

Click Results:

650) this.width=650; "src=" Http://images2015.cnblogs.com/blog/17408/201611/17408-20161115190024982-1620996962.png "/>

Para is an array, you can push the new one, you can remove the old ones, and you can modify the existing ones.

Don't ask me how JS operates an array.

return FALSE if you want to stop the event;

Other: What if an interface should show multiple lists?

HTML puts n table,new n Ar.datagrid.

End:

At present, the most common play has been written, there should be no other disturbing gameplay.

Write a tutorial to write a day, really tiring, eat to ~ ~ ~ ~

The next section describes how the toolbars and list areas are played.

Introduction to ASP. Aries 3: Develop a list page and manipulate Sany