Asp. NET control of HTML page elements (ii) _ Practical skills

Source: Internet
Author: User
Tags eval
This is the first step in this permission control, and the scanning interface gets the information of the elements to be assigned to the database.

This step is divided into three small steps:

(1). An element that marks the permissions to be assigned to the interface

(2). Scan interface Gets the element information for the permissions that you want to assign. (ID, title, level relationship)

(3). stored in the database.

1. Mark out the elements of the interface that you want to assign permissions to.

At the beginning of the scan I found it very difficult because there are too many layers of HTML elements. The first is to use the <div> tag to represent the elements of the HTML that you want to assign permissions to, found that the solution is not good, such as adding a user button and div so the style of the button has changed the style of the adjustment I am doing the KS system has nearly 100 interfaces, plus now the interface has been determined good style , adjust the CSS, plus the div words so you have to reset the interface, on this question for two or three days, and finally I think of a custom HTML element tag for:<box></box> for this tag plus ID and title: <box id= " Addid "title= Add button" ></box&gt, use this tag to mark the element to which you want to assign permissions. This will not change the style and get the information you want. The interface background code after the change is:
Copy Code code as follows:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<meta name= "Author" content= "kudychen@gmail.com"/>
<meta http-equiv= "x-ua-compatible" content= "Ie=emulateie7"/>
<title> User Management--query user </title>

<script src= ". /.. /js/div/jquery.js "></script>
<script src= ". /.. /js/div/div.js "></script>
<link href= ". /.. /css/admin.global.css "rel=" stylesheet "type=" Text/css "/>"
<link href= ". /.. /css/admin.content.css "rel=" stylesheet "type=" Text/css "/>"

<style type= "Text/css" >
. btn-middle {
width:76px;
}
</style>

<body>
<form id= "form" method= "POST" runat= "Server" >
<%--box Mark main start tag--%>
<box id= "main" title= "Major" >
<div class= "Location" > Current Location: User admin-> query user </div>

<div class= "Blank10" ></div>
<%--box tag queryuser start tag--%>
<box id= "Queryuser" title= "Query User" >
<div class= "Search Block" >
<div class= "H" >
<span class= "Icon-sprite icon-magnifier" ></span>
</div>
<div class= "TL Corner" ></div>
<div class= "TR Corner" ></div>
<div class= "BL Corner" ></div>
<div class= "BR Corner" ></div>
<div class= "CNT-WP" >
<div class= "CNT" >
<div class= "Search-bar" >
<label class= "Txt-green" > Username:</label>
<input value= "" type= "text" name= "username" id= "username" class= "Input-small"/>


<asp:linkbutton id= "Lbtquery" class= "Btn-lit" runat= "Server"
onclick= "Lbtquery_click" width= "58px" ><span > Query </span></asp:LinkButton>

<%--box tag AddUser start tag--%>
<box id= "AddUser" title= "Add User" >
<a class= "Btn-lit btn-middle" href= "admadduser.aspx" >
<span> Add Users </span>
</a>
</box>
<%--box tag AddUser end tag--%>
</div>
</div>
</div>
</div>
</box>
<%--box tag Queryuser end tag--%>

<%--box tag userlist start tag--%>
<box id= "userlist" title= "user List" >
<span class= "Block" >
<div class= "TL Corner" ></div>
<div class= "TR Corner" ></div>
<div class= "BL Corner" ></div>
<div class= "BR Corner" ></div>
<div class= "CNT-WP" >
<div class= "CNT" >
<div class= "H" >
<span class= "Icon-sprite icon-list" ></span>
</div>
<div class= "Blank10" ></div>

<asp:repeater id= "Rpuserinfo" runat= "Server" onitemcommand= "Rpuserinfo_itemcommand" >
<HeaderTemplate>
<table class= "data-table history" id= "Maintable" border= "0" cellspacing= "0" cellpadding= "0" >
<tr>
<th scope= "col" > User name </th>
<th scope= "col" > Role </th>
<th scope= "col" > Operations Records </th>
<th scope= "col" > Edit </th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
&LT;TD class= "txt160 C" ><% #Eval ("UserName")%></td>
&LT;TD class= "txt C" ><% #Eval ("RoleName")%></td>
&LT;TD class= "Txt80 C" ><a href= "admoperatorrecord.aspx"? userid=<% #Eval ("Userno")%> "title=" Operations Records > Operations Records </a></td>
&LT;TD class= "icon" >
<%--box tag edituserinfo start tag--%>
<box id= "Edituserinfo" title= "Edit User" >
<a class= "opt" title= "edit" href= "Admupdateuser.aspx? userid=<% #Eval ("Userno")%> ">
<span class= "Icon-sprite icon-edit" >
</span>
</a>
</box>
<%--box tag Edituserinfo end tag--%>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</div>
</div>
</span>
<span id= "Spanfirst" > First page </span> <span id= "Spanpre" > Prev </span> <span id= "Spannext" > next page </span> <span id= "spanlast" > Last page </span> <span id= "spanpagenum" ></span> page/Total <span ID = "Spantotalpage" ></span> page
</box>
<%--box tag userlist end tag--%>
</box>
<%--box Mark main end tag--%>
</form>
</body>


2. The scan interface gets the element information for the permissions that you want to assign.

Because the interface has <box> this element to represent the permissions of the elements, so the scan is better, but still encountered a lot of problems, eventually resolved, the most difficult is to scan out the two <box> parent-child relationship. Here is the JS code:
Copy Code code as follows:

$ (document). Ready (function () {

var rootboxs = document.getElementById ("main");
var child = Rootboxs.childnodes;
Findchildbox (Child)


});
Searching child nodes
function Findchildbox (parentnode) {

for (var i = 0; i < parentnode.length; i++) {
///
if (Parentnode[i].nodename = = "box") {

var childboxid = parentnode[i].id;
var childboxtitle = encodeURI (Parentnode[i].title);
var parentbox = Findparentbox (Parentnode[i].parentnode);
var parentboxid = parentbox.id;
if (window. XMLHttpRequest) {
IE7 above,firefox,chrome^^
XMLHTTP = new XMLHttpRequest ();
In order to be compatible with the partial Mozillar browser, when the response from the server is not XML, the resulting unresponsive problem
if (Xmlhttp.overridemimetype) {
Xmlhttp.overridemimetype (' Text/xml ');
}
}
else if (window. ActiveXObject) {
Ie5\ie6
XMLHTTP = new ActiveXObject ("Microsoft.XMLHTTP");
}
if (xmlhttp = null | | xmlhttp = = undefined) {
Alert ("Con ' t create XMLHttpRequest Object");
}
Registering callback Functions
Xmlhttp.onreadystatechange = callback;
Send a message

Xmlhttp.open (' Get ', '.. /.. /manager/rolemanager/addbox.ashx?childboxid= ' + childboxid + ' &childboxtitle= ' + childboxtitle + ' &parentboxId = ' + Parentboxid, true ';
Xmlhttp.send (NULL);


function callback () {
Determines whether the interaction is complete and returns correctly
if (xmlhttp.readystate = = 4 && xmlhttp.status = 200) {

}
}

}

Findchildbox (Parentnode[i].childnodes)

}

}

Querying the parent node
function Findparentbox (child) {

if (Child.nodename = = "box") {
return to child;
} else {
Return Findparentbox (Child.parentnode)

}

}

3. Deposit in the database.

The use of Ajax into the database, the first encounter problems, because the scanning interface takes too long to insert the first data into the database, the second piece of data is here. This results in the second record being substituted for some of the information in the first piece of data, causing problems with the data being stored in the database. At first I was going to add a delay in JS, the result table name is not. And then I'm going to add a lock-like thing to a program that counts as a delay. The data stored here will not be wrong. The following is the code:
Copy Code code as follows:

Using System;
Using System.Collections.Generic;
Using System.Linq;
Using System.Web;
Using BLL. MANAGER.ROLEUSERMANAGERBLL;
Using System.Data;
Using System.Text;
Using Model;
Using BLL;

Namespace ExamSystemV3.Manager.RoleManager
{
<summary>
Summary description of Addbox
</summary>
public class Addbox:ihttphandler
{

public void ProcessRequest (HttpContext context)
{
Context. Response.ContentType = "Text/plain";
System.Threading.Thread.Sleep (1000);
Diventity ediv = new diventity ();
Admdivmanager Admdivmanager = new Admdivmanager ();
PUBLICBLL PUBLICBLL = new PUBLICBLL ();
String strchildboxid = "";
String strchildboxtitle = "";

Strchildboxid = context. request.querystring["Childboxid"]. ToString (). Trim ();
Strchildboxtitle = context. Server.urldecode (context. request.querystring["Childboxtitle"]. ToString (). Trim ());
String Strparentboxid=context. request.querystring["Parentboxid"]. ToString (). Trim ();;
String strstate = "Yes";
String strdatetime = Publicbll.getdate ();
String StrIP = Publicbll.getwebclientip ();
String stroperator = "Xvshu";//context. session["Userno"]. ToString (). Trim ();;
Ediv.id = Strchildboxid;
Ediv.mainrelation = Strparentboxid;
Ediv.divname = Strchildboxtitle;
Ediv.divdescribe = Strchildboxtitle;
Ediv.operator = Stroperator;
Ediv.operatorip = StrIP;
Ediv.state = strstate;
Ediv.datetime = Strdatetime;
Admdivmanager.adddiv (EDIV);
}

public bool IsReusable
{
Get
{
return false;
}
}
}
}

Use the TreeView control to display the following figure:
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.