1. First look at the effect of the picture:
2.ext Code
Copy Code code as follows:
<reference path= "Http://www.cnblogs.com/Resources/ExtJs/vswd-ext_2.0.2.js"/>
Ext.namespace (' Xqh. Extjs.frame ');
Xqh. ExtJs.Frame.RoleManage = function () {
This.init ();
};
Ext.extend (XQH. ExtJs.Frame.RoleManage, Ext.util.Observable, {
Init:function () {
Form
AddForm = new Ext.form.FormPanel ({
ID: ' Addroleform ',
width:460,
HEIGHT:250,
Style
Bodystyle: ' margin:5px 5px 5px 5px ',
Frame:true,
Xtype: ' Filedset ',
Labelwidth:60,
Items
[
{
Xtype: ' FieldSet ',
Title: ' Role Information ',
Collapsible:true,
Autoheight:true,
Autowidth:true,
Items
[
{
Xtype: ' TextField ',
Name: ' RoleName ',
Fieldlabel: ' Role name ',
Emptytext: ' Must fill ',
Blanktext: ' Role name cannot be empty ',
Allowblank:false,
Maxlength:10,
Maxlengthtext: ' role cannot exceed 10 characters ',
Anchor: ' 98% '
}
]
},
{
Xtype: ' FieldSet ',
Title: ' Role description ',
Collapsible:true,
Autoheight:true,
Autowidth:true,
Items
[
{html: ' This is descriptive information ... '}
]
}
],
Reader:new Ext.data.JsonReader ({
Root: ' Data ',
Fields: [
{name: ' Roleid ', Mapping: ' Roleid ', type: ' int '},
{name: ' rolename ', Mapping: ' RoleName ', type: ' String '}
]
})
});
New User window
Addwin = new Ext.window ({
ID: ' Addrolewin ',
Title: ' New Role ',
width:480,
height:210,
Background mask
Modal:true,
Reset Size
Resizable:false,
Action to perform when the Close button is clicked
Closeaction: ' Hide ',
Plain:true,
Buttonalign: ' Center ',
Items:addform,
Buttons
[
{text: ' Close ', handler:function () {ext.getcmp (' Addrolewin '). Hide ();},
{text: ' Submit ', ID: ' Btnsubmit '}
]
});
Add Role Events
function Addrolefunction () {
var Submitbutton = this;
Submitbutton.disable ();
var userform = ext.getcmp ("Addroleform");
if (UserForm.form.isValid ()) {
UserForm.form.doAction (' Submit ', {
URL: "Http://www.cnblogs.com/Service/SystemService/RoleService.ashx?Method=AddRole",
Method: ' Post ',
Waittitle: "Please Wait",
Waitmsg: ' Adding data ... ',
Success:function (form, action) {
Submitbutton.enable ();
EXT.GETCMP (' Rolegd '). Store.reload ();
UserForm.ownerCt.hide ();
},
Failure:function (form, action) {
var tip = "New failure!";
if (Action.result.rspText!= "")
tip = Action.result.rspText;
Ext.Msg.alert (' hint ', tip);
Submitbutton.enable ();
}
});
}
else {
Submitbutton.enable ();
}
};
Add a button click event
function Btnaddclick () {
EXT.GETCMP (' Addroleform '). Form.reset ();
EXT.GETCMP ("Addrolewin"). Settitle (' new role ');
EXT.GETCMP ("Addrolewin"). Buttons[1].handler = Addrolefunction;
EXT.GETCMP ("Addrolewin"). Show ();
};
Modify Role Events
function Updaterolefunction () {
var Submitbutton = this;
Submitbutton.disable ();
var userform = ext.getcmp ("Addroleform");
var id = userform.form.reader.jsondata.data[0]. Roleid;
if (UserForm.form.isValid ()) {
UserForm.form.doAction (' Submit ', {
URL: ' http://www.cnblogs.com/Service/SystemService/RoleService.ashx?Method=UpdateRoleById&RoleId= ' + ID,
Method: ' Post ',
params:{},
Waittitle: "Please Wait",
Waitmsg: ' Saving data ... ',
Success:function (form, action) {
Submitbutton.enable ();
EXT.GETCMP (' Rolegd '). Store.reload ();
UserForm.ownerCt.hide ();
},
Failure:function (form, action) {
var tip = "Edit activity save failed!" ";
if (Action.result.text!= "" & Action.result.text!= null)
tip = Action.result.text;
Ext.Msg.alert (' hint ', tip);
Submitbutton.enable ();
}
});
}
else {
Submitbutton.enable ();
}
};
Modify a button click event
function Btnupdateclick () {
var Grid = ext.getcmp (' Rolegd ');
if (Grid.getselectionmodel (). Getselections () [0] = = undefined) {
Ext.Msg.alert ("Prompt", "Select rows to modify");
}
else {
EXT.GETCMP (' Addrolewin '). Settitle (' modify role ');
EXT.GETCMP ("Btnsubmit"). Handler = Updaterolefunction;
EXT.GETCMP ("Addroleform"). Form.reset ();
var Roleid = Grid.getselectionmodel (). Getselections () [0].data. Roleid;
var url = ' http://www.cnblogs.com/Service/SystemService/RoleService.ashx?Method=GetRoleById&roleId= ' + Roleid;
EXT.GETCMP ("Addrolewin"). Show ();
EXT.GETCMP ("Addroleform"). Load ({
Url:url,
Waittitle: "Please Wait",
Waitmsg: ' Loading data ... ',
Success:function (form, action) {
},
Failure:function (form, action) {
var tip = "Commit failed";
if (Action.response.responseText!= "")
tip = Action.response.responseText;
Ext.Msg.alert (' hint ', tip);
}
});
}
};
Delete a role function
function Delrolefunction () {
var Grid = ext.getcmp (' Rolegd ');
if (Grid.getselectionmodel (). Getselections () [0] = = undefined) {
Ext.Msg.alert ("Prompt", "Please select role to delete");
}
else {
Ext.MessageBox.confirm (' Hint ', ' Are you sure you want to delete the selected role? ', function (BTN) {
if (btn = = ' yes ') {
var conn = new Ext.data.Connection ();
Conn.request
({
URL: ' Http://www.cnblogs.com/Service/SystemService/RoleService.ashx?Method=DeleteRoleById ',
Params: {Id:grid.getSelectionModel (). Getselections () [0].data. Roleid},
Method: ' Post ',
Scope:this,
Callback:function (options, success, response) {
if (success) {
EXT.GETCMP (' Rolegd '). Store.reload ();
}
else {
Ext.MessageBox.alert ("Hint", "Delete failed!") ");
}
}
});
}
});
}
};
Tool bar
ToolBar = new Ext.toolbar ({
Items
[
{text: ' Add ', ID: ' Btnadd '},
'-',
{text: ' Modify ', ID: ' Btnupdate '},
'-',
{text: ' delete ', handler:delrolefunction}
]
});
New button
var adduserbtn = ext.getcmp (' Btnadd ');
Adduserbtn.on (' click ', Btnaddclick);
Modify button
var btnupdate = ext.getcmp (' btnupdate ');
Btnupdate.on (' click ', Btnupdateclick);
var datastore = new Ext.data.Store ({
Proxy:new Ext.data.HttpProxy ({
URL: ' Http://www.cnblogs.com/Service/SystemService/RoleService.ashx?Method=GetAllRoles '
}),
Reader:new Ext.data.JsonReader ({
Root: ' Table ',
Totalproperty: ' RecordCount ',
ID: ' Roleid ',
Fields: [' Roleid ', ' rolename ']
})
});
Datastore.load ({params: {start:0, limit:20}});
Grid
var rolegrid = new Ext.grid.GridPanel ({
Region: ' Center ',
ID: ' Rolegd ',
Title: ' Role Management ',
Store:datastore,
Columns
[
New Ext.grid.RowNumberer ({header: "number", width:50}),
{header: "Roleid", Width:50, Sortable:false, dataindex: ' Roleid ', hidden:true},
{header: Role name, width:50, Sortable:true, dataindex: ' RoleName '}
],
Loadmask: {msg: "Load ..."},
Striperows:true,
Viewconfig: {
Forcefit:true
},
Sm:new Ext.grid.RowSelectionModel ({singleselect:true}),
Bbar:new Ext.pagingtoolbar ({
PAGESIZE:20,
Store:datastore,
Displayinfo:true,
Displaymsg: "Show {0} to {1} records, altogether {2}",
Emptymsg: "No Record"
}),
Tbar:toolbar
});
Layout
var roleview = new Ext.panel ({
Renderto: ' Rolemain ',
HEIGHT:550,
Layout: ' Border ',
Border:false,
Items: [Rolegrid]
});
},
Destroy:function () {
}
});
3.LINQ Code
Copy Code code as follows:
Using System;
Using System.Collections.Generic;
Using System.Linq;
Using System.Text;
Namespace Xqh. Extjs.linqdatabase
{
public class Rolelinqaccess
{
Linqdatabasedatacontext db = new Linqdatabasedatacontext ();
<summary>
Get all roles
</summary>
<param name= "Start" ></param>
<param name= "Limit" ></param>
<param name= "Total" ></param>
<returns></returns>
Public list<xrole> getallrole (int start,int limit,out int total)
{
var q = from R in Db. Xrole
Select R;
Total = Q.count ();
if (limit = 0)
{
return Q.tolist ();
}
Else
{
Return Q.skip (Start). Take (limit). ToList ();
}
}
<summary>
Get role based on ID
</summary>
<param name= "id" ></param>
<returns></returns>
Public xrole Getrolebyid (int id)
{
var q = from R in Db. Xrole
where R.roleid = = ID
Select R;
return Q.first ();
}
<summary>
New role
</summary>
<param name= "Role" ></param>
<returns></returns>
Public list<xrole> addrole (xrole)
{
Db. Xrole.insertonsubmit (role);
Db. SubmitChanges ();
Return DB. Xrole.tolist ();
}
<summary>
Remove roles by ID
</summary>
<param name= "id" ></param>
<returns></returns>
Public list<xrole> Delrolebyid (int id)
{
var q = from R in Db. Xrole
where R.roleid = = ID
Select R;
Db. Xrole.deleteallonsubmit (q);
Db. SubmitChanges ();
Return DB. Xrole.tolist ();
}
<summary>
Update roles
</summary>
<param name= "Role" ></param>
<returns></returns>
Public list<xrole> updaterole (xrole)
{
var q = from R in Db. Xrole
where R.roleid = = role. Roleid
Select R;
foreach (Xrole r in Q)
{
R.roleid = role. Roleid;
R.rolename = role. RoleName;
}
Db. SubmitChanges ();
Return DB. Xrole.tolist ();
}
}
}
4.ASHX Code
Copy Code code as follows:
<summary>
Get all roles
</summary>
public void Getallroles ()
{
StringBuilder jsondata = new StringBuilder ();
int start = Convert.ToInt32 (request["start");
int limit = Convert.ToInt32 (request["limit"]);
int total = 0;
list<xrole> lsrole = roleaccess.getallrole (start, limit, out total);
jsonconvert<xrole> json = new jsonconvert<xrole> ();
Jsondata = json. Togridpanel (Lsrole, total);
Response.Write (Jsondata);
Response.End ();
}
<summary>
Get role based on ID
</summary>
<param name= "id" ></param>
<returns></returns>
public void Getrolebyid ()
{
StringBuilder jsondata = new StringBuilder ();
BOOL success = FALSE;
String rsptext = String. Empty;
String id = request["Roleid"]. ToString ();
Try
{
Xrole role = Roleaccess.getrolebyid (Convert.ToInt32 (id));
Success = true;
Rsptext = "Success";
jsonconvert<xrole> json = new jsonconvert<xrole> ();
Jsondata = json. Toformpanel (Success, rsptext, role);
}
catch (Exception ex)
{
Success = false;
Rsptext = ex. message;
}
Response.Write (Jsondata);
Response.End ();
}
<summary>
New role
</summary>
public void Addrole ()
{
String jsonstr = String. Empty;
BOOL success = FALSE;
String rsptext = String. Empty;
String rolename = request["RoleName"]. ToString ();
Xrole role = new Xrole ();
Role. RoleName = rolename;
Try
{
Roleaccess.addrole (role);
Success = true;
Rsptext = "new success!";
}
catch (Exception ex)
{
Success = false;
Rsptext = ex. message;
}
Jsonstr = "{success:" + success. ToString (). ToLower () + ", message: '" + Rsptext + "! '}";
Response.Write (JSONSTR);
Response.End ();
}
<summary>
Modify roles based on role number
</summary>
public void Updaterolebyid ()
{
String jsonstr = String. Empty;
BOOL success = FALSE;
String rsptext = String. Empty;
String Roleid = request["Roleid"]. ToString ();
String rolename = request["RoleName"]. ToString ();
Xrole role = new Xrole ();
Role. Roleid = Convert.ToInt32 (Roleid);
Role. RoleName = rolename;
Try
{
Roleaccess.updaterole (role);
Success = true;
Rsptext = "Modify success!";
}
catch (Exception ex)
{
Success = false;
Rsptext = ex. message;
}
Jsonstr = "{success:" + success. ToString (). ToLower () + ", message: '" + Rsptext + "! '}";
Response.Write (JSONSTR);
Response.End ();
}
<summary>
Delete user based on ID
</summary>
public void Deleterolebyid ()
{
String jsonstr = String. Empty;
BOOL success = FALSE;
String rsptext = String. Empty;
Try
{
int id = Convert.ToInt32 (request["id"]. ToString ());
list<xrole> Lsrole = Roleaccess.delrolebyid (ID);
Success = true;
Rsptext = "Success";
}
catch (Exception ex)
{
Success = true;
Rsptext = ex. message;
}
Jsonstr = "{success:" + success. ToString (). ToLower () + ", message: '" + Rsptext + "! '}";
Response.Write (JSONSTR);
Response.End ();
}
