Fill dropdownlist with value in groups (Master/content page)

Hello,

I'm trying to fill a dropdownlist with values in groups. Here's the code working in a single page. If I try the same code in master/content pages I can't get data in groups.

Database: Northwind

"ddlNames" runat="server">
"text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
"text/javascript">
$(function () {
GroupDropdownlist('ddlNames')
});
function GroupDropdownlist(id) {
var selectControl = $('#' + id);
var groups = [];
$(selectControl).find('option').each(function () {
groups.push($(this).attr('data-group'));
});
var uniqueGroup = groups.filter(function (itm, i, a) {
return i == a.indexOf(itm);
});
$(uniqueGroup).each(function () {
var Group = jQuery('', { label: $(this)[0] }).appendTo(selectControl);
var grpItems = $(selectControl).find('option[data-group="' + $(this)[0] + '"]');
$(grpItems).each(function () {
var item = $(this);
item.appendTo(Group);
});
});
}

protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
string str = ConfigurationManager.ConnectionStrings["ConString"].ConnectionString;
SqlConnection conn = new SqlConnection(str);
conn.Open();
SqlCommand cmd = new SqlCommand("SELECT EmployeeID,FirstName,TitleOfCourtesy FROM Employees", conn);
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataTable dt = new DataTable();
da.Fill(dt);
foreach (DataRow row in dt.Rows)
{
ListItem item = new ListItem();
item.Text = row["FirstName"].ToString();
item.Value = row["EmployeeID"].ToString();
item.Attributes["data-group"] = row["TitleOfCourtesy"].ToString();
ddlNames.Items.Add(item);
}
conn.Close();
}
}

I already tried the following:

1. Had the js code imported to master page as seperate .js file.

2 Changed GroupDropdownlist('ddlNames') to GroupDropdownlist('<%=ddlNames.ClientID %>')

Any kind of help would be appreciated.

Thank you in advance.

1 Reply

Know the answer? Post it — somebody with the same question will find it here.

Chanakya Jayabalan8y ago
Did you see what error you are getting in the browser console? There might be an issue with the jquery loading or a mismatch.

Do share the error that you are getting while debugging or console error to give you a better suggestion.
0