F9 Group Marketing and Technology Blog

Over the years I’ve worked on a number of projects where users could customize some aspect of the site. One such application surveyed a group of employees with and then made recommendations on how to best organize the employees into teams. Companies could buy a certain number of surveys and then direct their employees to the site to complete the survey. Before sending their employees to the site, a company could adjust the survey’s look and feel, uploading their own logo and choosing background and foreground colors, among other customizations. A common requirement for such customizable websites is the ability for the user to select one or more colors

Whenever a browser makes an HTTP request to a web server, it sends along several HTTP headers . These HTTP Headers are used to provide the web server with information to assist with handling the request. For instance, if the browser supports compression it will send along an Accept-Encoding HTTP Header, which lets the web server know what compression algorithms the browser can work with. Any cookies previously set by the web server are sent from the browser back to the server via the Cookies HTTP Header. The browser also sends the User-Agent HTTP Header, which the web server can parse to determine the browser (IE, Firefox, Safari, etc.), the version number, the operating system, and other information. Similarly, the web server includes a number of HTTP Headers when it sends back the contents of the requested resource. These headers are used by the browser to determine how to render the content and for how long to cache the content.

Many of the web applications I help build can be classified as in-production line of business applications that receive frequent and ongoing feature enhancements. Typically, these applications have dozens if not hundreds of users who rely on the site each and every day to accomplish tasks necessary to keep the company running smoothly. Every week or so the latest code is deployed to the production servers, bringing with it bug fixes and, very often, new features or changes to existing features. One challenge I’ve bumped into when working on such applications is how to best alert users of the new features and the changes to existing features?

Each series in a chart is composed of a set of data points, which are modeled via the DataPoint class. For most chart types, the two key attributes of a data point are its X and Y value. For example, in a line chart the X value indicates the position of the data point along the X axis, while the Y value represents the position of the data point along the Y axis. Ditto for a column chart, although it may help to think of the Y value as the height of the column.

Creating a Filtering User Interface With jQuery In a Web Forms Application: Part 1 looked at how to use jQuery in an ASP.NET Web Forms application to build a collapsible filtering user interface. When the page is loaded into the user’s browser the filtering interface is collapsed. Clicking the filtering interface’s title toggles the interface between its collapsed and expanded states. When expanded, a user can interact with the filtering controls – DropDownLists, TextBoxes, CheckBoxes, and so on – to narrow down the results displayed in the report beneath the filtering interface. While the filtering interface created in Part 1 certainly works, the collapsed/expanded state of the interface is not remembered. Consequently, on any postback or anytime a user leaves the page and comes back, the filtering interface returns to its collapsed state, regardless of whether the user had it expanded. The good news is that with a touch of AJAX we can have the collapsed/expanded state of the filtering user interface remembered for the duration of a user’s session. This article explores how to add such functionality. Read on to learn more! If you’ve not yet read Part 1 , please do so before tackling Part 2. Read More >

The Microsoft Chart controls make it easy to take data – such as sales numbers, website traffic statistics, and so on – and turn it into a chart, which can be saved to an image file or displayed from a web page. In Plotting Chart Data we examined a myriad of ways to turn data into a chart, including: plotting the chart data point by point; binding data to the Chart’s Points collection; programmatically binding data structured data to the chart; and declaratively binding data using one of ASP.NET’s data source controls, such as the SqlDataSource or ObjectDataSource. Oftentimes, web pages that display charts include user interface elements that let the user filter or sort the plotted data. For example, when viewing a chart of expenses, the user may want to only show expenses between two dates, or may want to sort the expenses by category. One way to provide such functionality is to sort or filter the data before binding it to the chart. Alternatively, you can bind the original data to the chart and then instruct the Chart control to sort the data, or to apply a filter. This article shows how to use these sorting and filtering capabilities. Read on to learn more! Read More >

The ASP.NET AJAX UpdatePanel provides a quick and easy way to implement a snappier, AJAX-based user interface in an ASP.NET WebForm. In a nutshell, Web controls within the UpdatePanel that would normally cause a full page postback trigger a partial page postback, instead. For example, a Button Web control, when clicked, submits the form, causing the browser to start a full page postback. However, if the Button control is within an UpdatePanel then the UpdatePanel short-circuits the full page postback and performs a partial page postback, using JavaScript to make an HTTP request to the server. The server realizes that the request is a partial page postback (and not a full page postback) and only returns the markup for the UpdatePanels on the page. When this response is returned to the browser, JavaScript code parses it and seamlessly updates the user interfaces in the UpdatePanels. (For a more in-depth look at the UpdatePanel control, refer back to the Using the UpdatePanel installment in this article series.) While we usually want controls within the UpdatePanel to perform a partial page postback, there are scenarios where we need a full page postback

When a visitor registers a new account on an ASP.NET website that uses the Membership system, they are prompted (by default) for their username, password, e-mail address, and other pertinent information. Along with functionality for registering new accounts, the ASP.NET Membership system provides page developers techniques for modifying information about users. For instance, with just a couple of lines of code you can change an existing user’s e-mail address, approve a user, or unlock them (if their account was locked out). However, there are certain bits of user information that cannot be modified through the Membership API, such as the username. For most sites this is a non-issue. Once a visitor has registered an account that username is fixed; if they want a different username, well, they’ll just have to register a new account. But consider a website that has customized the account creation process so that instead of prompting the user for both a username and e-mail address, the user is only asked to enter an e-mail address and that it is used as both their username and e-mail address on file. Anytime a user switched e-mail addresses – which can happen when changing jobs, changing ISPs, or moving to the new, hip, web-based e-mail provider of the day – they need to also change their username on your site

The ListView control is similar to the GridView control in many ways: both display a set of records, both support built-in sorting, paging, editing, and deleting functionality with minimal effort. The ListView differs from the GridView in two key ways: Rather than using fields, the ListView is rendered via templates, which offers the page developer much finer control over the emitted markup, and The ListView supports built-in inserting support The first installment in this series explored the ListView’s template-based rendering. This installment looks at how to use the ListView’s inserting functionality. In a nutshell, inserting data from the ListView requires two steps: defining the inserting interface via the InsertItemTemplate and specifying where the inserting interface should go via the InsertItemPosition property. Much like with editing data from within the ListView , the InsertItemTemplate can contain two-way databinding statements when using a data source control to get the inputs entered by the user from the ListView’s inserting interface into the parameters of the data source control. And like with the editing and deleting workflows, you can programmatically examine and modify the user’s submitted data before inserting the data, cancelling the operation altogether if needed. This article walks through the steps for creating a ListView that allows users to insert records.

Traditionally, website navigation has been focused on minimizing the number of clicks required to open a given page. However, this goal has nothing to do with the real purpose of navigation, which is to make finding information easy, consistent, and transparent to the user. Also, as websites get bigger, traditional navigation controls such as drop-down menus or tree views become impractical. Faster Internet connections and larger screen sizes now allow developers to experiment with new styles of navigation. This article shows how to implement incremental navigation , which is a style of navigation where users find information by clicking through a series of lightweight pages, with each click resulting in a small, but highly visible change to the navigation user interface. It differs from traditional drop-down menu navigation in that incremental navigation limits the amount of new choices available to just the next level in the sitemap hierarchy. I’ve created a customizable framework for implementing this sort of navigation scheme named Theseus, which you can download from the end of this article. Underneath the covers, Theseus uses ASP.NET’s SiteMap class and the configured sitemap provider to implement the incremental navigation. This article starts with an overview of incremental navigation and then goes on to examine how to use Theseus to implement such a navigation scheme in your website. Read on to learn more! Read More >