jQuery Quick Tip: Extract CSS Background Image

jQuery allows you to get the background image of any element on a web page:

$("#myelement").css("background-image");

However, this returns it in an undesirable format: url(http://example.com/images/image.jpg) or url("http://example.com/images/image.jpg"). With a bit of string replacement, you can get extract the URL:

function extractUrl(input)
{
 // remove quotes and wrapping url()
 return input.replace(/"/g,"").replace(/url\(|\)$/ig, "");
}

So now you can just do this:

extractUrl($("#myelement").css("background-image"))

Which will return the URL on its own http://example.com/images/image.jpg.

ASP.NET Snippet: Delete All Users and Roles

Deleting all users and related data from a site using ASP.NET authentication is fairly simple. Useful if copying a database and you want to remove all the users, but keep the structure and other data (e.g. user content) intact.

Delete all users:

foreach (MembershipUser u in Membership.GetAllUsers())
{
 Membership.DeleteUser(u.UserName, true);
}

Delete all roles:

foreach (string role in Roles.GetAllRoles())
{
 Roles.DeleteRole(role);
}

ASP.NET Snippet: Quick Password Reset

Here is a simple way, via code to reset a password when you are using the built-in ASP.NET authentication system. Useful if you either don't have a reset password form, or you just want to quickly change a password. Create a blank page, and place in the code behind Page_Load event.

C#

    protected void Page_Load(object sender, EventArgs e)
    {
        MembershipUser u = Membership.FindUsersByName("Username")["Username"];
        u.UnlockUser();
        u.ChangePassword(u.ResetPassword(), "newpassword");
    }

VB

    Public Sub Page_Load(sender As Object, e As EventArgs)
        Dim u As MembershipUser = Membership.FindUsersByName("Username")("Username")
        u.UnlockUser()
        u.ChangePassword(u.ResetPassword(), "newpassword")
    End Sub

Just delete the page when done.

Update (8 July 2009): If a question and answer is required when you create a user, you have to pass on the answer to u.ResetPassword, e.g. u.ChangePassword(u.ResetPassword("answer"), "newpassword"), otherwise ResetPassword won't work.

Get ListControl values (CheckBoxList, RadioButtonList, DropDownList, ListBox) from a Repeater the easy way (ASP.NET C#)

Building on Get TextBox values from a Repeater the easy way (ASP.NET C#), here is a function that will get the selected values from WebControls that inherit from ListControl (CheckBoxList, RadioButtonList, DropDownList and ListBox)

It returns null if the ListControl matching the given ID does not exist in the repeater or an empty string array if nothing is selected.

public string[] ListControlValues(RepeaterItem itm, string controlId)
{
 string[] output = null;
 ListControl t = itm.FindControl(controlId) as ListControl;
 if (t != null)
 {
  ArrayList ar = new ArrayList();
  foreach (ListItem li in t.Items)
  {
   if (li.Selected) ar.Add(li.Value);
  }
  output = (string[])ar.ToArray(typeof(string));
 }
 return output;
}

Use in Repeater ItemCommand

protected void MyRepeater_ItemCommand(object sender, RepeaterCommandEventArgs e)
{
 switch (e.CommandName.ToString())
 {
  case "Save":
   int recordID = Convert.ToInt32(e.CommandArgument);
   string[] listBoxValues = ListControlValues("ListBox1");
   if(listBoxValues != null)
   {
     foreach(string s in listBoxValues)
     {
      
     }
   }
   string[] dropDownValues = ListControlValues("DropDown1");
   if(dropDownValues != null)
   {
    // since dropdown can only have one item selected...
    string dropDownValue = dropDownValues[0];
   }
   ....
   
   break;
  default:
   break;
 }
}

Get TextBox values from a Repeater the easy way (ASP.NET C#)

The asp:Repeater control allows you to attach an ItemCommand event to it, for instance, updating a record in a database.

<asp:Repeater ID="MyRepeater" DataSource='<%# MyData %>' runat="server" 
 OnItemCommand="MyRepeater_ItemCommand">
 <HeaderTemplate><ul></HeaderTemplate>
 <ItemTemplate><li>
 Url: <asp:TextBox ID="Urdl" Text='<%# Eval("Url") %>' runat="server" />
 Text: <asp:TextBox ID="Text" Text='<%# Eval("Text") %>' runat="server" />
 <asp:Button ID="SaveButton" CommandName="Save" CommandArgument='<%# Eval("RecordID") %>' Text="Save" runat="server" />
 </li></ItemTemplate>
 <FooterTemplate></ul></FooterTemplate>
</asp:Repeater>

MyRepeater_ItemCommand is then defined:

protected void MyRepeater_ItemCommand(object sender, RepeaterCommandEventArgs e)
{
 switch (e.CommandName.ToString())
 {
  case "Save":
   int recordID = Convert.ToInt32(e.CommandArgument);
   TextBox url = e.Item.FindControl("Url") as TextBox;
   TextBox text = e.Item.FindControl("Text") as TextBox;
   
   ....
   
   break;
  default:
   break;
 }
}

However this has several downsides:

1. If you mistype the control id, you get a NullReferenceException
2. The code can get cluttered and harder to understand as more TextBox's are added.

To help mitigate this, this function gets the value of the TextBox, or null if the TextBox is not found.

public string TextBoxValue(RepeaterItem itm, string controlId)
{
 string output = null;
 TextBox t = itm.FindControl(controlId) as TextBox;
 if (t != null)
 {
  output = t.Text;
 }
 return output;
}

Then you can get the value without an exception occurring:

string url = TextBoxValue(e.Item, "Url");
string text = TextBoxValue(e.Item, "Text");
if(url != null)
{
    // update url in record
}
if(text == null)
{
    // update text in record
}

The code could then be used in a class and used on multiple pages, so if a page doesn't have a TextBox with a certain ID, the corresponding data field is not updated (e.g. on one page you might want a user to update the URL, but on another more restricted page, you may only want them to change the text). Code behind would then just be:

protected void MyRepeater_ItemCommand(object sender, RepeaterCommandEventArgs e)
{
 RepeaterMethods.MyRepeater_ItemCommand(sender, e);
}

And the class could be:

using System;
using System.Collections.Generic;
using System.Web;
using System.Text;
using System.Web.UI;
using System.Web.UI.WebControls;

/// <summary>
/// Summary description for RepeaterMethods
/// </summary>
public class RepeaterMethods
{
 public RepeaterMethods()
 {
  //
  // TODO: Add constructor logic here
  //
 }

 public static void MyRepeater_ItemCommand(object sender, RepeaterCommandEventArgs e)
 {
  switch (e.CommandName.ToString())
  {
   case "Save":
    string url = TextBoxValue(e.Item, "Url");
    string text = TextBoxValue(e.Item, "Text");
    if (url != null)
    {
     // update url in record
    }
    if (text == null)
    {
     // update text in record
    }
    break;
   default:
    break;
  }
 }

 public static string TextBoxValue(RepeaterItem itm, string controlId)
 {
  string output = null;
  TextBox t = itm.FindControl(controlId) as TextBox;
  if (t != null)
  {
   output = t.Text;
  }
  return output;
 }
}

Binding data to a Repeater using Lazy Loading (ASP.NET C#)

Lazy loading is a method of only loading data as and when you need it. Rather than loading it on page load, you can define a property that can then be bound to a WebControl.

For example, in the page is an asp:Repeater:

        <asp:Repeater ID="MyRepeater" DataSource='<%# MyData %>' runat="server">
            <HeaderTemplate><ul></HeaderTemplate>
            <ItemTemplate><li><a href="<%# Eval("Url") %>"><%# Eval("Text") %></a> (Record ID: <%# Eval("RecordID") %>)</li></ItemTemplate>
            <FooterTemplate></ul></FooterTemplate>
        </asp:Repeater>

MyData in the DataSource attribute of asp:Repeater is a property defined in the CodeBehind page:

    private DataTable _MyData;
    public DataTable MyData
    {
        get
        {
            if (_MyData == null)
            {
                _MyData = LoadMyData();
            }
            return _MyData;
        }
    }

LoadMyData gets the data you want to show (normally it would be loaded from a database, rather than rows added in this case)

    private DataTable LoadMyData()
    {
        Trace.Write("LoadMyData");
        DataTable dt = new DataTable();
        dt.Columns.Add(new DataColumn("RecordID", Type.GetType("System.Int32")));
        dt.Columns.Add(new DataColumn("Text", Type.GetType("System.String")));
        dt.Columns.Add(new DataColumn("Url", Type.GetType("System.String")));

        DataRow row;
        int index = 1;

        // new row
        row = dt.NewRow();
        // populate row
        row["RecordID"] = index;
        row["Text"] = "Google";
        row["Url"] = "http://www.google.co.uk";
        // add row to table
        dt.Rows.Add(row);

        // increment index
        index++;

        // new row
        row = dt.NewRow();
        // populate row
        row["RecordID"] = index;
        row["Text"] = "Yahoo";
        row["Url"] = "http://www.yahoo.co.uk";
        // add row to table
        dt.Rows.Add(row);

        return dt;
    }

The Trace.Write is there to show that the data isn't loaded if it is not bound to a WebControl in the page. This can be tested by turning on tracing (adding Trace="True" to <%@ Page) and removing DataSource='<%# MyData %>' from the Repeater.

You would then bind the page on load:

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            DataBind();
        }
    }

LazyLoadRepeater.aspx:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="LazyLoadRepeater.aspx.cs" Inherits="LazyLoadRepeater" Trace="true" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Lazy Loading</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h1>Search Engines</h1>
        <asp:Repeater ID="MyRepeater" DataSource='<%# MyData %>' runat="server">
            <HeaderTemplate><ul></HeaderTemplate>
            <ItemTemplate><li><a href="<%# Eval("Url") %>"><%# Eval("Text") %></a> (Record ID: <%# Eval("RecordID") %>)</li></ItemTemplate>
            <FooterTemplate></ul></FooterTemplate>
        </asp:Repeater>
    </div>
    </form>
</body>
</html>

LazyLoadRepeater.aspx.cs:

using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;

public partial class LazyLoadRepeater : System.Web.UI.Page
{
    private DataTable _MyData;
    public DataTable MyData
    {
        get
        {
            if (_MyData == null)
            {
                _MyData = LoadMyData();
            }
            return _MyData;
        }
    }

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            DataBind();
        }
    }

    private DataTable LoadMyData()
    {
        Trace.Write("LoadMyData");
        DataTable dt = new DataTable();
        dt.Columns.Add(new DataColumn("RecordID", Type.GetType("System.Int32")));
        dt.Columns.Add(new DataColumn("Text", Type.GetType("System.String")));
        dt.Columns.Add(new DataColumn("Url", Type.GetType("System.String")));

        DataRow row;
        int index = 1;

        // new row
        row = dt.NewRow();
        // populate row
        row["RecordID"] = index;
        row["Text"] = "Google";
        row["Url"] = "http://www.google.co.uk";
        // add row to table
        dt.Rows.Add(row);

        // increment index
        index++;

        // new row
        row = dt.NewRow();
        // populate row
        row["RecordID"] = index;
        row["Text"] = "Yahoo";
        row["Url"] = "http://www.yahoo.co.uk";
        // add row to table
        dt.Rows.Add(row);

        return dt;
    }
}

Chinook: Cross-Database (SQL Server, Oracle, MySQL) Sample

The Chinook database is a sample database that is an alternative to the Northwind sample. One of the advantages it has over Northwind is that it can be installed on SQL Server (including the Compact Edition), Oracle and MySQL. Therefore it can be used to test Object-relational mapping (ORM) frameworks (e.g. NHibernate, SubSonic etc).

Code Generation with MyGeneration

Rather than type repetitive code, a code generator could be used to do it for you. MyGeneration is one such piece of software that will help. As the output is just text, you can output code in any language (ASP.NET, C#, VB.NET, PHP, JavaScript etc) - although with a bit of extra work, PDF's can be generated (using iTextSharp - which would need to be downloaded and the dll saved in the MyGeneration install folder). It can query many database types (SQL Server, Oracle, SQLite, MySQL, PostgreSQL and more), but a database isn't required for it to be of use. You can set up an interface (to select columns in a table for example), but it is optional.

For example, to loop through columns in a database table:

Template Code

<%
public class GeneratedTemplate : DotNetScriptTemplate
{
 public GeneratedTemplate(ZeusContext context) : base(context) {}
 
 private string DatabaseName;
 private string TableName;
 private ITable table;
 private ArrayList columns;
 private string PrimaryKey = string.Empty;

 //---------------------------------------------------
 // Render() is where you want to write your logic    
 //---------------------------------------------------
 public override void Render()
 {
  DatabaseName = input["databaseName"].ToString();
  TableName = input["tableName"].ToString();
  table = MyMeta.Databases[DatabaseName].Tables[TableName];
  columns = input["lstColumns"] as ArrayList;
  try
  {
   PrimaryKey = table.PrimaryKeys[0].Name; 
  }
  catch (System.Exception ex)
  {
   // no primary key
  }
  foreach (string columnName in columns)
  {
  %>
  <li><%= columnName %></li><%
  }
 }
 
 // check if column has been selected via UI
 private bool IsInColumns(Column c)
 {
  foreach (string columnName in columns)
  {
   if (columnName == c.Name) return true;
  }
  return false;
 }
}
%>

Interface Code

public class GeneratedGui : DotNetScriptGui
{
 public GeneratedGui(ZeusContext context) : base(context) {}
 
 private string DatabaseName;
 private string TableName;
 private string PrimaryKey = string.Empty;
 private ArrayList columns;
 private ITable table;

 //-----------------------------------------
 // The User Interface Entry Point
 //-----------------------------------------
 public override void Setup()
 {

  ui.Width  = 500;
  ui.Height = 350;
  
  // Setup Database selection combobox.
  GuiLabel lblDatabases = ui.AddLabel("lblDatabases", "Select a database:", "Select a database in the dropdown below.");
  GuiComboBox cmbDatabases = ui.AddComboBox("databaseName", "Select a database.");
  
  // Setup Tables selection multi-select listbox.
  GuiLabel lblTables = ui.AddLabel("lblTables", "Select table:", "Select table from the combobox below.");
  GuiComboBox cmbTables = ui.AddComboBox("tableName", "Select a table.");
  
  // setup columns list box
  GuiLabel lblColumns = ui.AddLabel("lblColumns", "Select columns:", "Select columns from the listbox below.");
  GuiListBox lstColumns = ui.AddListBox("lstColumns", "Select columns.");
  
  lstColumns.Height = 130;
  
  // bind data to the controls
  cmbDatabases.BindData(MyMeta.Databases);
  cmbDatabases.SelectedValue = MyMeta.DefaultDatabase.Name;
  cmbTables.BindData( MyMeta.Databases[cmbDatabases.SelectedValue].Tables );
  
  // Attach the onchange event to the cmbDatabases control.
  cmbDatabases.AttachEvent("onchange", "cmbDatabases_onchange");
  cmbTables.AttachEvent("onchange", "cmbTables_onchange");
  
  ui.ShowGui = true;
 }
 
 public void cmbDatabases_onchange(GuiComboBox control)
 {
  GuiComboBox cmbDatabases = ui["databaseName"] as GuiComboBox;
  GuiComboBox cmbTables = ui["tableName"] as GuiComboBox;
  cmbTables.BindData( MyMeta.Databases[cmbDatabases.SelectedValue].Tables );
  GuiListBox lstColumns = ui["lstColumns"] as GuiListBox;
  lstColumns.Clear();
 }
 
 public void cmbTables_onchange(GuiComboBox control)
 {
  try 
  {
   GuiComboBox cmbDatabases = ui["databaseName"] as GuiComboBox;
   GuiComboBox cmbTables = ui["tableName"] as GuiComboBox;
   GuiListBox lstColumns = ui["lstColumns"] as GuiListBox;
   lstColumns.BindData( MyMeta.Databases[cmbDatabases.SelectedValue].Tables[cmbTables.SelectedValue].Columns );
  }
  catch (Exception ex)
  {
  }
 }
}

To loop through a collection (e.g. ArrayList).

Template Code

<%
public class GeneratedTemplate : DotNetScriptTemplate
{
 public GeneratedTemplate(ZeusContext context) : base(context) {}

 //---------------------------------------------------
 // Render() is where you want to write your logic    
 //---------------------------------------------------
 public override void Render()
 {
  int i;
  ArrayList items = new ArrayList();
  items.Add("Array Item 1");
  items.Add("Array Item 2");
  items.Add("Array Item 3");
  items.Add("Array Item 4");
  items.Add("Array Item 5");
  
  for(i = 0; i < items.Count; i++)
  {
  %>
    <p><%= items[i].ToString() %></p>
  <%
  }
 }

}
%>

Interface Code

public class GeneratedGui : DotNetScriptGui
{
 public GeneratedGui(ZeusContext context) : base(context) {}

 //-----------------------------------------
 // The User Interface Entry Point
 //-----------------------------------------
 public override void Setup()
 {
  // ** UNCOMMENT CODE BELOW TO SEE UI **

  //ui.Width  = 100;
  //ui.Height = 100;
  //GuiLabel lblDemo = ui.AddLabel("lblDemo", "Demo", "Demo Tooltip");
  //ui.ShowGui = true;
 }

}

MyGeneration comes with a template library built in, so chances are, someone may have already done a template that does what you want. You can post your own templates online as well (MyGeneration can download templates from this site, so you don't need to actually go to the site to get them).

It is also on SourceForge: http://sourceforge.net/projects/mygeneration/, so you can download the source code for it and make changes or add features.