实现WebPart编辑功能

实现WebPart的编辑功能需要用到VS2005提供的EditorZone控件和EditorPart系列控件。EditorPart系列控件包括AppearanceEditorPart、BehaviorEditorPart、LayoutEditorPart、PropertyGridEditPart。
要实现WebPart的编辑功能需要几个条件：（1）用户处于共享页面范围（2）显示模式为编辑模式。
对于（1）来说，只要在Web.config文件中配置一下就OK了。
<allowusers="Tom"verbs="enterSharedScope"/> 表示用户名"Tom" 被授权共享页面范围，否则切换成编辑模式会报错。

实现WebPart编辑功能实现WebPart编辑功能Web.config
<!--<br><br>Code highlighting produced by Actipro CodeHighlighter (freeware)<br>http://www.CodeHighlighter.com/<br><br>-->实现WebPart编辑功能<?xmlversion="1.0"?>
实现WebPart编辑功能<configurationxmlns="http://schemas.microsoft.com/.NetConfiguration/v2.0">
实现WebPart编辑功能<appSettings/>
实现WebPart编辑功能<connectionStrings/>
实现WebPart编辑功能<system.web>
实现WebPart编辑功能<compilationdebug="true"/>
实现WebPart编辑功能<authorization>
实现WebPart编辑功能<denyusers="?"></deny>
实现WebPart编辑功能</authorization>
实现WebPart编辑功能<authenticationmode="Forms">
实现WebPart编辑功能<formsloginUrl="Login.aspx"></forms>
实现WebPart编辑功能</authentication>
实现WebPart编辑功能<webParts>
实现WebPart编辑功能<personalization>
实现WebPart编辑功能<authorization>
实现WebPart编辑功能<allowusers="Tom"verbs="enterSharedScope"/>
实现WebPart编辑功能</authorization>
实现WebPart编辑功能</personalization>
实现WebPart编辑功能</webParts>
实现WebPart编辑功能</system.web>
实现WebPart编辑功能</configuration>

对于（2），在页面中添加2个LinkButton，在cs文件中切换一下显示模式，也可以用DropDownList来实现。
EditorPart系列控件中的BehaviorEditorPart、PropertyGridEditPart需要特别说明一下。
BehaviorEditorPart控件看名字也知道大概能做什么了，它在默认情况下可能不会显示出来，实现这个控件需要2个步骤：一、配置Web.config文件，方法上面已经说了，二、以编程的方式将页从用户级别改为共享级别，可以通过使用ToggleScope方法实现。
PropertyGridEditPart：是对自定义属性的修改。

在EditorPart中实现折叠的功能
利用Css和JavaScript脚本来实现。初始情况下，让LEGEND的显示“＋”号，并隐藏区块中的内容，通过Click“＋”号改变Css。

示例代码如下：
实现WebPart编辑功能实现WebPart编辑功能Default.aspx
<!--<br><br>Code highlighting produced by Actipro CodeHighlighter (freeware)<br>http://www.CodeHighlighter.com/<br><br>-->实现WebPart编辑功能<%@PageLanguage="C#"AutoEventWireup="true"CodeFile="Default2.aspx.cs"Inherits="_Default"%>
实现WebPart编辑功能
实现WebPart编辑功能<%@RegisterTagPrefix="cc1"Namespace="Samples.AspNet.CS.Controls"%>
实现WebPart编辑功能<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
实现WebPart编辑功能<html>
实现WebPart编辑功能<headid="Head1"runat="server">
实现WebPart编辑功能<linkhref="StyleSheet.css"rel="stylesheet"type="text/css"/>
实现WebPart编辑功能
实现WebPart编辑功能<scripttype="text/javascript">
实现WebPart编辑功能//为每个className值为'EditorPartTitle'的标题头创建onclick处理程序
实现WebPart编辑功能functionCreateExpandingTitles()
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能varelements=document.getElementsByTagName("LEGEND");
实现WebPart编辑功能for(i=0;i<elements.length;i++)
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能if(elements[i].className&&elements[i].className=="EditorPartTitle")
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能elements[i].onclick=newFunction("toggle(this);");
实现WebPart编辑功能}
实现WebPart编辑功能}
实现WebPart编辑功能}
实现WebPart编辑功能//在onload发生时，调用CreateExpandingTitles方法
实现WebPart编辑功能if(window.addEventListener)
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能window.addEventListener('load',CreateExpandingTitles,false);
实现WebPart编辑功能}
实现WebPart编辑功能elseif(window.attachEvent)
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能window.attachEvent('onload',CreateExpandingTitles);
实现WebPart编辑功能}
实现WebPart编辑功能//单击事件处理程序
实现WebPart编辑功能functiontoggle(titleElement)
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能varfirstChild=(titleElement.nextSibling.childNodes[0].id)
实现WebPart编辑功能?titleElement.nextSibling.childNodes[0]
实现WebPart编辑功能:titleElement.nextSibling.childNodes[1];
实现WebPart编辑功能
实现WebPart编辑功能//设置图片显示及显示状态
实现WebPart编辑功能if(firstChild.style.display=="block")
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能firstChild.style.display="none";
实现WebPart编辑功能titleElement.style.backgroundImage="url(images/plus.gif)";
实现WebPart编辑功能}
实现WebPart编辑功能else
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能firstChild.style.display="block";
实现WebPart编辑功能titleElement.style.backgroundImage="url(images/minus.gif)";
实现WebPart编辑功能}
实现WebPart编辑功能}
实现WebPart编辑功能</script>
实现WebPart编辑功能
实现WebPart编辑功能</head>
实现WebPart编辑功能<body>
实现WebPart编辑功能<formid="Form1"runat="server">
实现WebPart编辑功能<asp:WebPartManagerID="WebPartManager1"runat="server"/>
实现WebPart编辑功能<asp:LinkButtonID="LinkButton1"runat="server"Text="浏览模式(BrowseMode)|"OnClick="LinkButton1_Click"
实现WebPart编辑功能CssClass="commonText"></asp:LinkButton>
实现WebPart编辑功能<asp:LinkButtonID="LinkButton2"runat="server"Text="编辑模式(EditMode)"OnClick="LinkButton2_Click"
实现WebPart编辑功能CssClass="commonText"></asp:LinkButton>&nbsp;
实现WebPart编辑功能<tableborder="0"cellpadding="0"cellspacing="0"style="width:547px;height:172px">
实现WebPart编辑功能<tr>
实现WebPart编辑功能<tdstyle="width:268px"valign="top">
实现WebPart编辑功能<asp:WebPartZoneID="WebPartZone1"runat="server"title="Zone1"BorderColor="#CCCCCC"
实现WebPart编辑功能Font-Names="Verdana"Padding="6">
实现WebPart编辑功能<PartTitleStyleFont-Bold="true"ForeColor="White"BackColor="#5D7B9D"Font-Size="0.8em"/>
实现WebPart编辑功能<PartStyleBorderWidth="1px"BorderStyle="Solid"BorderColor="#81AAF2"Font-Size="0.8em"
实现WebPart编辑功能ForeColor="#333333"/>
实现WebPart编辑功能<ZoneTemplate>
实现WebPart编辑功能<cc1:TextDisplayWebPartrunat="server"ID="textwebpart"Title="TextContentWebPart"
实现WebPart编辑功能AllowClose="False"/>
实现WebPart编辑功能</ZoneTemplate>
实现WebPart编辑功能<PartChromeStyleBackColor="#F7F6F3"BorderColor="#E2DED6"Font-Names="Verdana"ForeColor="White"/>
实现WebPart编辑功能<MenuLabelHoverStyleForeColor="#E2DED6"/>
实现WebPart编辑功能<EmptyZoneTextStyleFont-Size="0.8em"/>
实现WebPart编辑功能<MenuLabelStyleForeColor="White"/>
实现WebPart编辑功能<MenuVerbHoverStyleBackColor="#F7F6F3"BorderColor="#CCCCCC"BorderStyle="Solid"
实现WebPart编辑功能BorderWidth="1px"ForeColor="#333333"/>
实现WebPart编辑功能<HeaderStyleFont-Size="0.7em"ForeColor="#CCCCCC"HorizontalAlign="Center"/>
实现WebPart编辑功能<MenuVerbStyleBorderColor="#5D7B9D"BorderStyle="Solid"BorderWidth="1px"ForeColor="White"/>
实现WebPart编辑功能<TitleBarVerbStyleFont-Size="0.6em"Font-Underline="False"ForeColor="White"/>
实现WebPart编辑功能<MenuPopupStyleBackColor="#5D7B9D"BorderColor="#CCCCCC"BorderWidth="1px"Font-Names="Verdana"
实现WebPart编辑功能Font-Size="0.6em"/>
实现WebPart编辑功能</asp:WebPartZone>
实现WebPart编辑功能</td>
实现WebPart编辑功能<tdstyle="width:204px">
实现WebPart编辑功能<asp:EditorZoneID="EditorZone1"runat="server"BackColor="#EFF3FB"BorderColor="#CCCCCC"
实现WebPart编辑功能BorderWidth="1px"Font-Names="Verdana"Padding="6">
实现WebPart编辑功能<HeaderStyleBackColor="#D1DDF1"Font-Bold="True"Font-Size="0.8em"ForeColor="#333333"/>
实现WebPart编辑功能<LabelStyleFont-Size="0.8em"ForeColor="#333333"/>
实现WebPart编辑功能<HeaderVerbStyleFont-Bold="False"Font-Size="0.8em"Font-Underline="False"ForeColor="#333333"/>
实现WebPart编辑功能<PartChromeStyleBorderColor="#D1DDF1"BorderStyle="Solid"BorderWidth="1px"/>
实现WebPart编辑功能<ZoneTemplate>
实现WebPart编辑功能<asp:AppearanceEditorPartID="AppearanceEditorPart1"runat="server"CssClass="EditorPartHidden"/>
实现WebPart编辑功能<asp:BehaviorEditorPartID="BehaviorEditorPart1"runat="server"CssClass="EditorPartHidden"/>
实现WebPart编辑功能<asp:LayoutEditorPartID="LayoutEditorPart1"runat="server"CssClass="EditorPartHidden"/>
实现WebPart编辑功能<asp:PropertyGridEditorPartID="PropertyGridEditorPart1"runat="server"CssClass="EditorPartHidden"/>
实现WebPart编辑功能</ZoneTemplate>
实现WebPart编辑功能<PartStyleBorderColor="#EFF3FB"BorderWidth="5px"/>
实现WebPart编辑功能<FooterStyleBackColor="#D1DDF1"HorizontalAlign="Right"/>
实现WebPart编辑功能<EditUIStyleFont-Names="Verdana"Font-Size="0.8em"ForeColor="#333333"/>
实现WebPart编辑功能<InstructionTextStyleFont-Size="0.8em"ForeColor="#333333"/>
实现WebPart编辑功能<ErrorStyleFont-Size="0.8em"/>
实现WebPart编辑功能<VerbStyleFont-Names="Verdana"Font-Size="0.8em"ForeColor="#333333"/>
实现WebPart编辑功能<EmptyZoneTextStyleFont-Size="0.8em"ForeColor="#333333"/>
实现WebPart编辑功能<PartTitleStyleFont-Bold="True"Font-Size="0.8em"ForeColor="#333333"CssClass="EditorPartTitle"/>
实现WebPart编辑功能</asp:EditorZone>
实现WebPart编辑功能</td>
实现WebPart编辑功能</tr>
实现WebPart编辑功能</table>
实现WebPart编辑功能</form>
实现WebPart编辑功能</body>
实现WebPart编辑功能</html>

实现WebPart编辑功能实现WebPart编辑功能Default.aspx.cs
<!--<br><br>Code highlighting produced by Actipro CodeHighlighter (freeware)<br>http://www.CodeHighlighter.com/<br><br>-->实现WebPart编辑功能usingSystem;
实现WebPart编辑功能usingSystem.Data;
实现WebPart编辑功能usingSystem.Configuration;
实现WebPart编辑功能usingSystem.Web;
实现WebPart编辑功能usingSystem.Web.Security;
实现WebPart编辑功能usingSystem.Web.UI;
实现WebPart编辑功能usingSystem.Web.UI.WebControls;
实现WebPart编辑功能usingSystem.Web.UI.WebControls.WebParts;
实现WebPart编辑功能usingSystem.Web.UI.HtmlControls;
实现WebPart编辑功能
实现WebPart编辑功能publicpartialclass_Default:System.Web.UI.Page
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能protectedvoidPage_Load(objectsender,EventArgse)
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能
实现WebPart编辑功能}
实现WebPart编辑功能protectedvoidLinkButton1_Click(objectsender,EventArgse)
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能//进入浏览模式
实现WebPart编辑功能WebPartManager1.DisplayMode=WebPartManager.BrowseDisplayMode;
实现WebPart编辑功能}
实现WebPart编辑功能protectedvoidLinkButton2_Click(objectsender,EventArgse)
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能//调用ToogleScope方法，修改页面个性化范围
实现WebPart编辑功能if(WebPartManager1.Personalization.Scope!=PersonalizationScope.Shared)
实现WebPart编辑功能实现WebPart编辑功能实现WebPart编辑功能{
实现WebPart编辑功能WebPartManager1.Personalization.ToggleScope();
实现WebPart编辑功能}
实现WebPart编辑功能//进入编辑模式
实现WebPart编辑功能WebPartManager1.DisplayMode=WebPartManager.EditDisplayMode;
实现WebPart编辑功能}
实现WebPart编辑功能}

实现WebPart编辑功能实现WebPart编辑功能StyleSheet.css
<!--<br><br>Code highlighting produced by Actipro CodeHighlighter (freeware)<br>http://www.CodeHighlighter.com/<br><br>-->实现WebPart编辑功能body
实现WebPart编辑功能实现WebPart编辑功能{实现WebPart编辑功能}{
实现WebPart编辑功能}
实现WebPart编辑功能.mainTitle
实现WebPart编辑功能实现WebPart编辑功能{实现WebPart编辑功能}{
实现WebPart编辑功能font-size:12pt;
实现WebPart编辑功能font-weight:bold;
实现WebPart编辑功能font-family:宋体;
实现WebPart编辑功能}
实现WebPart编辑功能.commonText
实现WebPart编辑功能实现WebPart编辑功能{实现WebPart编辑功能}{
实现WebPart编辑功能font-size:10pt;
实现WebPart编辑功能font-family:宋体;
实现WebPart编辑功能text-decoration:none;
实现WebPart编辑功能}
实现WebPart编辑功能.littleMainTitle
实现WebPart编辑功能实现WebPart编辑功能{实现WebPart编辑功能}{
实现WebPart编辑功能font-size:10pt;
实现WebPart编辑功能font-weight:bold;
实现WebPart编辑功能font-family:宋体;
实现WebPart编辑功能}
实现WebPart编辑功能.EditorPartHidden
实现WebPart编辑功能实现WebPart编辑功能{实现WebPart编辑功能}{
实现WebPart编辑功能display:none;
实现WebPart编辑功能}
实现WebPart编辑功能
实现WebPart编辑功能.EditorPartTitle
实现WebPart编辑功能实现WebPart编辑功能{实现WebPart编辑功能}{
实现WebPart编辑功能background-position:left;
实现WebPart编辑功能background-repeat:no-repeat;
实现WebPart编辑功能background-image:url(images/plus.gif);
实现WebPart编辑功能cursor:pointer;
实现WebPart编辑功能padding-left:14px;
实现WebPart编辑功能}

效果图：

实现WebPart编辑功能

相关文章：

  • 2021-12-28
  • 2021-11-15
  • 2021-03-31
  • 2022-01-20
  • 2021-04-06
  • 2021-09-04
  • 2021-05-23
  • 2022-12-23
猜你喜欢
  • 2021-10-16
  • 2022-02-12
  • 2022-12-23
  • 2022-12-23
相关资源
相似解决方案
热门标签
Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode