5.5 Tutorial: Web Parts Personalization Provider

MySQL Connector/Net provides a Web Parts Personalization provider that allows you to use a MySQL server to store personalization data.

Note

This feature was added in MySQL Connector/Net 6.9.0.

This tutorial demonstrates how to configure the Web Parts Personalization provider using MySQL Connector/Net.

Requirements

  • An ASP.NET web site or web application with a membership provider

  • .NET Framework 3.0 or above

  • MySQL Server 5.5 or above

Configuring MySQL Web Parts Personalization Provider

Tasks include:

  • Add References to MySql.Data and MySql.Web to the web site or web application project.

  • Include a MySQL Connector/Net personalization provider into the system.web section in the web.config file:

    
    <webParts>
     <personalization defaultProvider="MySQLPersonalizationProvider">
      <providers>
        <clear/>
        <add name="MySQLPersonalizationProvider"
          type="MySql.Web.Personalization.MySqlPersonalizationProvider, 
            MySql.Web, Version=6.9.3.0, Culture=neutral, 
            PublicKeyToken=c5687fc88969c44d"
          connectionStringName="LocalMySqlServer"
          applicationName="/" />
      </providers>
      <authorization>
        <allow verbs="modifyState" users="*" />
        <allow verbs="enterSharedScope" users="*"/>
      </authorization>
     </personalization>
    </webParts>
    
    
            

Creating Web Part Controls

  • Create a Web application using MySQL Connector/Net ASP.NET Membership. For information about doing this, see Section 5.2, “Tutorial: MySQL Connector/Net ASP.NET Membership and Role Provider”.

  • Create a new ASP.NET page.

  • Change to the Design view.

  • From the Toolbox, drag a WebPartManager control to the page.

  • Now define an HTML table with 3 columns and 1 row.

  • In the left and middle cells, from the WebParts Toolbox, drag and drop a WebPartZone control into each cell.

  • In the right column, from the WebParts Toolbox, drag and drop a CatalogZone with PageCatalogPart and EditorZone controls.

  • Add controls to the WebPartZone, it will look similar to:

    
    <table>
      <tr>
        <td>
          <asp:WebPartZone ID="LeftZone" runat="server" HeaderText="Left Zone">
            <ZoneTemplate>
              <asp:Label ID="Label1" runat="server" title="Left Zone">
                <asp:BulletedList ID="BulletedList1" runat="server">
                  <asp:ListItem Text="Item 1"></asp:ListItem>
                  <asp:ListItem Text="Item 2"></asp:ListItem>
                  <asp:ListItem Text="Item 3"></asp:ListItem>
                </asp:BulletedList>
              </asp:Label>
            </ZoneTemplate>
          </asp:WebPartZone>
        </td>
        <td>
          <asp:WebPartZone ID="MainZone" runat="server" HeaderText="Main Zone">
            <ZoneTemplate>
              <asp:Label ID="Label11" runat="server" title="Main Zone">
                <h2>This is the Main Zone</h2>
              </asp:Label>
            </ZoneTemplate>
          </asp:WebPartZone>
        </td>
        <td>
          <asp:CatalogZone ID="CatalogZone1" runat="server">
            <ZoneTemplate>
              <asp:PageCatalogPart ID="PageCatalogPart1" runat="server" />
            </ZoneTemplate>
          </asp:CatalogZone>
          <asp:EditorZone ID="EditorZone1" runat="server">
            <ZoneTemplate>
              <asp:LayoutEditorPart ID="LayoutEditorPart1" runat="server" />
              <asp:AppearanceEditorPart ID="AppearanceEditorPart1" runat="server" />
            </ZoneTemplate>
          </asp:EditorZone>
        </td>
      </tr>
    </table>
    
            
  • Outside of the HTML table, add a DropDownList, 2 Buttons, and a Label as follows:

    
    <asp:DropDownList ID="DisplayModes" runat="server" AutoPostBack="True" 
       OnSelectedIndexChanged="DisplayModes_SelectedIndexChanged">
    </asp:DropDownList>
    <asp:Button ID="ResetButton" runat="server" Text="Reset" 
       OnClick="ResetButton_Click" />
    <asp:Button ID="ToggleButton" runat="server" OnClick="ToggleButton_Click" 
       Text="Toggle Scope" />
    <asp:Label ID="ScopeLabel" runat="server"></asp:Label>
    
            
  • The following code will fill the DropDownList for the DisplayModes, show the current scope, reset the personalization state, toggle the scope (between user and the shared scope), and change the display mode:

    
    public partial class WebPart : System.Web.UI.Page
    {
      protected void Page_Load(object sender, EventArgs e)
      {
        if (!IsPostBack)
        {
          foreach (WebPartDisplayMode mode in WebPartManager1.SupportedDisplayModes)
          {
            if (mode.IsEnabled(WebPartManager1))
            {
              DisplayModes.Items.Add(mode.Name);
            }
          }
        }
        ScopeLabel.Text = WebPartManager1.Personalization.Scope.ToString();
      }
    
      protected void ResetButton_Click(object sender, EventArgs e)
      {
        if (WebPartManager1.Personalization.IsEnabled &&
          WebPartManager1.Personalization.IsModifiable)
        {
          WebPartManager1.Personalization.ResetPersonalizationState();
        }
      }
    
      protected void ToggleButton_Click(object sender, EventArgs e)
      {
        WebPartManager1.Personalization.ToggleScope();
      }
    
      protected void DisplayModes_SelectedIndexChanged(object sender, EventArgs e)
      {
        var mode = WebPartManager1.SupportedDisplayModes[DisplayModes.SelectedValue];
        if (mode != null && mode.IsEnabled(WebPartManager1))
        {
          WebPartManager1.DisplayMode = mode;
        }
      }
    }
    
            

Testing Web Part Changes

Run the application and open the Web Part page, and it should look like this:

Figure 5.9 Web Parts Page

Web Parts Page

The first time when the user is not authenticated, by default the scope is Shared. The user must be authenticated to change settings on the web part controls.

In the following screenshot shows an authenticated user that is able to customize the controls:

Figure 5.10 Authenticated User Controls

Authenticated User Controls

You can see the DropDownList and all of the display modes for the current user.

Click Toggle Scope to switch the application to the shared scope:

Figure 5.11 Toggle Scope

Toggle Scope

Now you can personalize the zones using the Edit or Catalog display modes at a specific user or all users level.

Figure 5.12 Personalize Zones

Personalize Zones