How can i populate dropdown fom database in dnn - dotnetnuke

Question

I want to add new page in the DNN site which populates two dropdown for Country and State from the database.
Please suggest how we can do this?

Answer 1

Here I show you how to create dynamic pages using DNN module. For more information refer this link.
First of all open your DNN website in Visual Studio. You can see the DesktopModules folder in your root directory, right click on the directory and add new directory give it to name as your module name, for example "CountryState". Now right click on the CountryState folder and Add->Add New Item->Select Web User Control and give it to name as your module name like "CountryState.ascx", it will show you CountryState.ascx and CountryState.ascx.cs files in DesktopModules/CountryState folder.
Next step to update inherit class "System.Web.UI.UserControl" to "PortalModuleBase". This is because of the PortalModuleBase class defines a custom base class inherited by all desktop portal modules within the Portal. The PortalModuleBase class defines portal specific properties that are used by the portal framework to correctly display portal module.
Now logged-In in your website using your Host credential.
In DNN panel, go-to Host->Extensions.
Click on Create New Module button on right top corner of the Extensions Page.
Create New Module button open a popup window with Create Module Form DropDownList. Select Control from that Drop-Down.
It will show you form, select your .ascx web user control in that from as respected folder path and click on Create Module button.
Finally Drag-N-Drop module on your page.
Enjoy! ;)

Answer 2

I have a blog article with code sample on how to accomplish this in DNN.
CASCADING COUNTRY / STATE DROPDOWNS: A STUDY IN DOTNETNUKE 7 WEBAPI SERVICES AND AJAX

Answer 3

Keval's solution is OK for a quick and dirty solution, but for something a bit more sustainable, I prefer to keep my modules in their own solution apart from DNN. I then use the project post build events to copy the required code over to the bin and desktop module folders. This makes source control easier and opening up the solution much quicker.
The build scripts for the different file extensions
xcopy "$(ProjectDir)*.ascx" C:\Webs\Properteez\DesktopModules\$(ProjectName)\*.ascx /S /C /Y /D
xcopy "$(ProjectDir)*.css" C:\Webs\Properteez\DesktopModules\$(ProjectName)\*.css /S /C /Y /D
xcopy "$(ProjectDir)*.txt" C:\Webs\Properteez\DesktopModules\$(ProjectName)\*.txt /S /C /Y /D
xcopy "$(ProjectDir)App_LocalResources\*.resx" C:\Webs\Properteez\DesktopModules\$(ProjectName)\App_LocalResources\*.resx /S /C /Y /D
xcopy "$(ProjectDir)Styles\*.css" C:\Webs\Properteez\DesktopModules\$(ProjectName)\Styles\*.css /S /C /Y /D
xcopy "$(ProjectDir)Scripts\*.js" C:\Webs\Properteez\DesktopModules\$(ProjectName)\Scripts\*.js /S /C /Y /D
xcopy "$(ProjectDir)Images\*.*" C:\Webs\Properteez\DesktopModules\$(ProjectName)\Images\*.* /S /C /Y /D
xcopy "$(TargetDir)$(TargetFileName)" C:\Webs\Properteez\bin /C /Y /Q /D
Also,
populates two dropdown for Country and State from the database
Communicating with the DB can be done the "DNN way" with PetaPoco.
Model example (This will need to map directly yo your DB table):
#region Usings
using System;
using DotNetNuke.ComponentModel.DataAnnotations;
using DotNetNuke.Common.Utilities;
#endregion
namespace Properteez.Data.Entities
{
[TableName("Sync_Property")]
[PrimaryKey("PropertyId", "PropertyId")]
public class Property
{
#region Properties
public int PropertyId { get; set; }
public string Name { get; set; }
public string ShortDesc { get; set; }
public int UserId { get; set; }
public bool IsDeleted { get; set; }
// You can use the [IgnoreColumn] attribute if a property does not map to a DB field
}
}
Repository method examples:
public static Property Get(int id)
{
Property item;
using (IDataContext ctx = DataContext.Instance())
{
var rep = ctx.GetRepository<Property>();
item = rep.GetById(id);
}
return item;
}
public static List<Property> GetAllSinceLastSync(DateTime lastSyncDate)
{
List<Property> items;
using (IDataContext ctx = DataContext.Instance())
{
var rep = ctx.GetRepository<Property>();
items = rep.Get()
// Filter list to valid properteez that have been added or changed since last sync
.Where(p => (!p.IsDeleted && !p.IsSold) && p.LastModifiedOnDate >= lastSyncDate)
.ToList();
}
return items;
}
public static List<Property> GetAll()
{
List<Property> items;
using (IDataContext ctx = DataContext.Instance())
{
var rep = ctx.GetRepository<Property>();
items = rep.Get().ToList();
}
return items;
}
public static int Create(Property item)
{
item.CreatedOnDate = DateTime.Now;
item.LastModifiedOnDate = DateTime.Now;
using (IDataContext ctx = DataContext.Instance())
{
var rep = ctx.GetRepository<Property>();
rep.Insert(item);
}
return item.PropertyId;
}
public static void Update(Property item)
{
item.LastModifiedOnDate = DateTime.Now;
using (IDataContext ctx = DataContext.Instance())
{
var rep = ctx.GetRepository<Property>();
rep.Update(item);
}
}
public static void Delete(Property item)
{
using (IDataContext ctx = DataContext.Instance())
{
var rep = ctx.GetRepository<Property>();
rep.Delete(item);
}
}
Debug
You can debug the application by building (copy over .dlls to bin folder of DNN instance), going to Debug>Attach to process and selecting the "W3wp" process
Note, you will need to be running Visual Studio as admin.