At last! DNN7.1 has extensionless URLs and a "url name" setting for every page

This is a big step forward. Starting with DNN v.7.1, you can say goodbye to ugly URLs and .aspx extensions. Following a suggestion made by yours truly (here: http://www.dnnsoftware.com/voice/cid/138237), DNN 7.1 has adopted a "Page URL" field in Page Settings, letting you specify the exact URL the page should use.

 

 

This is essentially an URL rewrite for the page, that makes the page's URL independent of the page's name, meaning that you can change the name as many times as you like, without affecting any links that are present in text/html modules or elsewhere.

 

The only bad thing (or good, depending on your point of view) is that the URL is not automatically synthesized based on page hierarhcy, meaning that you have to specify the exact URL for each page, starting from the virtual root.

 

For example, in the default DNN installation you have the About Us page which has a URL of "/About-Us" while the sub-page Style Guide has a URL of "/About-Us/StyleGuide". The whole URL for the Style Guide page has to be typed again, i.e. the "/About-Us" part is not inherited from the URL field of the parent page.

 

This makes things a bit more difficult since you have to remember the URLs of parent pages if you want to represent the hierarchy using friendly URLs, but on the other hand gives you a bit of freedom since you do not need to specify exact paths to get to a page - you can easily give the Style Guide page, for example, a URL of "/YourStyleGuide", forgetting the "About-Us" part at all.

 

It would be nice to see an "inherit" option in future versions though.

Read more...

What modules I used to develop www.alunet.com (Part 3 – Indoo Grid)

When it comes to displaying data on a grid, you can either choose to implement your own custom module, utilize a module like Open Web Studio (read about it in Part 2) or, if you really want speed and efficiency, install a copy of Indoo Grid.

 

This module delivers what it promises: Grids. Fully customizable, sortable and editable, either in-line or via a form. Of course, if you really need advanced form functionality, have a look at Dynamic Forms from Datasprings (read about this module in Part 1).

 

Every multi-purpose module is powerful in a specific area. Indoo Grid is very powerful in presenting data, and provides acceptable functionality for editing data. It’s ideal, though, for administrative tasks, especially if custom tables are involved. That was the case with alunet.com, so I used it heavily at the site administration pages.

 

Here you can see how the products administration screen looks like. The links to view and edit pages are constructed fields which lead to a Dynamic Forms page and a public detail page respectively. You can sort columns by clicking on them and you can filter data using the text box and the comboboxes above the grid. The “Category”, “Company” and “Views” columns come from respective joined tables. This is not an SQL view you’re seeing – joins are defined in Indoo Grid’s configuration.

 

You can instruct Indoo Grid to display records from a table or view, defining things such as searchboxes (you can define separate searchboxes for each column or combine them in a single searchbox, excluding the columns you don’t need to search), records per page selector, initial sorting and sortable columns, editable columns (if you need to edit things) and so on.

 

You also don’t have to worry about those cryptic referential integrity errors when trying, let’s say, to delete something that is related to another table – you can configure it to display messages that are understandable to the user.

 

This is the grid for managing categories. Remember, the Categories table is a self-joined table that is presented in the form of a tree inside the web site.

 

You can also create columns that are lookups in joined tables and even automatically create drop-downs from the values of those columns so that you can filter your grid with them. Additionally, you can create “calculated” fields that may contain one or more column values together with other html markup or scripts you may need (yes, that’s an easy way to include pictures or links to other pages).

 

One thing that Indoo Grid does that you won’t easily find elsewhere is that it can also handle hierarchical data. In alunet.com’s case, the “categories” table is a self-joined table that contains the entire tree of categories, where each record “knows” the id of its parent record. This was easily managed with Indoo Grid.

 

Here you see the same grid for Categories management, after navigating to a specific category (castings). What we see now are the children of this category in the tree. You can also see that we have an easy way to add new records right below the grid, that will belong to the “Castings” parent category.

 

Of coure, you can also use Indoo Grid for your front-end. It’s fully customizable in terms of styling and you can always use it in read-only mode. It’s very fast (authors have a demo with a million records which runs pretty smoothly),and there are some predefined templates and samples on their website, too.

 

Company website: www.indoolab.com

Buy it from Snowcovered: Click

 

Click here to read Part 1 (Introduction and Dynamic Forms from Datasprings)

Click here to read Part 2 (Open Web Studio)

Read more...

What modules I used to develop www.alunet.com (Part 2 - Open Web Studio)

Open Web Studio (or OWS in short) is a FREE (yes, free!) module from R2integrated, formerly known as ListX. (There are paid subscription options too, although I'm not quite sure what is offered). At first glance, it looks like a module where you can define an sql query and then create a template to render results - something like a glorified data repeater. But it's a lot more than that. It supports AJAX, paging, variables, it can "talk" to DNN and retrieve things like the tab id, the module id, the locale etc. it can make decisions and branch execution, you can nest modules and have one call another via AJAX, you can do redirections or change page and module titles, you can cache query results and you can even write to files!

 

Activity lists, product and company lists, product and company details, as well as the users' control panel are rendered via OWS. Additionally, OWS is used in all security checks (such as checking if the user has the right to edit a specific company or product or if the user can add another product). This is achieved via modules that have no front-end but nevertheless run when the page is requested.

 

 

Development in OWS is done via a handy tree-like interface where you define things like variables, If - else sections, sql queries, header-detail-alternate detail-footer sections etc.

 

The site's first page is a good OWS example. The asynchronous effect you will see when you load the first page is because only the main activities are retrieved when the page loads. Subactivities are then queried and rendered via AJAX, and query results are cached for each subactivity (yes, OWS can do named caching on query results so that you don't have to query your database all the time - you can even use fields from your queries to construct names for the cached elements). This is on purpose, since there is a large number of activities and counting products and companies for each one can take some time.

 

What's more is that you can then have more control over your caching - when a new company or product is submitted, you can clear only the cache that corresponds to the specific main activity it belongs to - leaving all the other query results cached. (No, I haven't done that yet - that's why it's a bit slow :))

 

Another example would be the company details page, in the future - the site will soon be supporting "packages", i.e. there will be companies that will register for free and companies that will pay. The "free" companies will have fewer details shown than the paying ones. This is very easy to control via OWS.

 

 

In fact, I could use OWS to even create the submission forms - but it would be very hard since I would have to do it all by hand - Dynamic Forms is very easier for this type of task. I created the quick search form on the company and product lists with OWS, though. When submitted, it runs a stored procedure which brings the appropriate results - illegal character escaping, injection protection, even parameter type checking and default values assignment are all built-in and easily customizable.

What's the catch? Well, lack of documentation. You've got to turn a lot of knobs and push a lot of buttons to understand what OWS really can do. Fortunately, there's a great community of OWS fans (me included), and this has solved most of my problems.

 

OWS Pros:

• Free!
• Very few bugs compared to other solutions
• Integrated RAD development environment including debugger
• It can talk to any external database (you can define connection strings)
• Supports calls to webservices or even external DLLs
• Supports caching, ajax, paging, sorting, decisions, variables
• Can talk to DNN - actually it can retrieve everything the PortalSettings class offers and some more.
• Very portable configurations, provides an option to even create your own PA assemblies, meaning that you can create your own modules using OWS.

OWS Cons:

• VERY poor wiki-style documentation (but lots of examples in the community forums)
• Internal functions have a syntax that is somewhat hard to read (quotes inside quotes, brackets, curly brackets, parentheses, escaped quotes, you can usually find them all in one line)
• Developer must be very proficient in SQL and HTML / Javascript in order to achieve good results (actually IMHO, this is not a bad thing)
• Can be painful to debug in very complex scenarios

Company website: www.r2integrated.com

Module website: www.openwebstudio.com

Snowcovered: Click

 

Click here to read Part 1 (introduction and Dynamic Forms from Datasprings)

Read more...

What modules I used to develop www.alunet.com (Part 1 - introduction and Dynamic Forms from Datasprings)

Instead of writing another boring "top 10" list of modules "you must use before you die", I chose to present a site I developed (currently online but in Beta stage). This is a unique opportunity, since I usually don't get permission or don't have enough time to publish details on my work.

 

The site is www.alunet.com, a global directory related to aluminium companies and products, and has been developed using the following DNN modules:

 

 

Dynamic Forms from Datasprings

IndooGrid from IndooLab

Open Web Studio from R2integrated

News Articles from Ventrian

Live Tabs from Mandeeps

Navigation Suite from DNN360.net

SmokeRanch Ad Manager from Smoke Ranch Software

 

(Please be aware that the design is not mine - the layout and site structure was entirely designed by the client and my job was to implement all the functionality needed).

 

The site is also heavily using jQuery, Fancybox (a jQuery plugin for displaying images and/or html) as well as ImageGen, an image resizer originally developed for the Umbraco CMS that can function stand-alone in any .NET - based website.

 

Let's discuss where I used what and why:

 

Dynamic Forms from Datasprings

 

Dynamic Forms is being used for almost all end-user data submission tasks. This is a very powerful forms generator for DotNetNuke, which allows you to create data-driven forms, storing data either in the module's internal database schema or in any custom external table structure. I am using custom tables for companies, products and categories so I chose the second approach. You can easily load data to your forms as well as save data to your database via SQL queries or stored procedures. You can populate form fields using SQL, and this is especially useful with lookup data used in combo boxes or checkbox groups.  The module supports various goodies like injecting your own javascript, creating your own validations and launching events on form submission that can send email or write to the database. I used Dynamic Forms for the product and company data submission forms that are displayed to registered users.

 

 

 

Registered users can submit their company data. Each user can submit only one company, which is approved by the site's administrator. Companies must have a main activity and subactivities that fall under their main activity (it's a tree with 3 levels). After initial submission, the user must select a main activity and subactivities. (again, Dynamic Forms is used for the selection forms).

 

When this process is complete, the company must be approved by the site administrators. Users get an email when this is done. (Of course, administrators also get an email for each submitted company). This is achieved via Dynamic Forms post-submission events.

 

Afterwards, the user is able to submit up to a specific number of products for the company (currently 10, but it's as easy to change as a record in a database table) and assign each product to one of the subactivities they have defined for their company. Actually, the "main activity" acts only as a grouping category, while subactivities are the actual activities of the company.

 

 

When editing the subactivity list, the forms present only subactivities that can be selected depending on the main activity chosen and do not let the user unselect a subactivity he has already assigned products to.

 

 

 

Users have their own "control panel" where they can manage companies, products and activities. This works mainly with Open Web Studio, which we'll examine later on.

 

Dynamic Forms pros:

• Very powerful
• Datastore in own schema or custom database
• Post-submission events (email, sql, etc.)
• Field events (when you fill a field - you can hide/show sections depending on value etc.)
• Great selection of controls - including data-driven comboboxes, listbox/radio groups, rich text editor, image and file upload controls.

Dynamic Forms cons:

• Bugs arise when you try to push it too far
• Somewhat expensive - you must make sure that you need it
• Not very good / easy control on final layout
• Image and file upload controls have many features (e.g. unique filenames, automatic thumbnail resizing) but need a lot of work to operate correctly.

Company website: www.datasprings.com

DotNetNuke Store: Click

 

Click here to read Part 2 (Open Web Studio)

Read more...