Sign In| Join
Get Help:Ask a Question in our Forums|Report a Bug|More Help Resources
Last post Sep 15, 2011 06:23 PM by md_refay
Member
416 Points
280 Posts
Sep 12, 2011 04:16 PM|LINK
Hi all,
Please help me to create JAuery Driven data from database
my code is :-
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Untitled Page</title> <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.js" type="text/javascript"></script> <style type="text/css"> .Menu { width: 200px; text-align: center; border: solid 2px gray; padding: 0px; background-color: Silver; cursor: hand; font-weight: bold; } .MenuItem { width: 192px; text-align: center; border: solid 1px silver; padding: 2px; background-color: whitesmoke; } </style> <script type="text/javascript"> $(document).ready(function() { $.ajax( { type: "POST", url: "Default3.aspx/GetCategories", contentType: "application/json; charset=utf-8", dataType: "json", success: CreateMenus, error: function(err) { alert(err.status + " - " + err.statusText); //alert('error'); } }); }); function CreateMenus(results) { results = results.d; for (var i = 0; i < results.length; i++) { $("<div class='Menu'>" + results[i].CategoryName + "</div>") .click({ CategoryID: results[i].CategoryID }, OnMenuClick) .appendTo("#accordionContainer"); } } function OnMenuClick(event) { $("div[id ^= 'menuItemGroup']").slideUp(500); $.ajax( { type: "POST", url: "Default3.aspx/GetCategoryProducts", data: '{"CategoryID":"' + event.data.CategoryID + '"}', contentType: "application/json; charset=utf-8", dataType: "json", success: function(items) { items = items.d; $(event.target).children().remove(); var html = "<div id='menuItemGroup" + event.data.ProductID + "' style='display:none'>"; for (var j = 0; j < items.length; j++) { html += "<div class='MenuItem'><a href=Details.aspx?ProductID='" + items[j].ProductID + "'>" + items[j].ProductName + "</a></div>"; } html += "</div>"; $(event.target).append(html); $("#menuItemGroup" + event.data.CategoryID).slideDown(500); }, error: function(err, r, c) { alert(err.status + " - " + err.statusText); } } ) } </script> </head> <body> <form id="form1" runat="server"> <div id="accordionContainer"> </div> </form> </body> </html>
and in code behind :-
//--GetCategories [System.Web.Services.WebMethod] public static System.Collections.Generic.List<Category> GetCategories() { System.Collections.Generic.List<Category> list = new System.Collections.Generic.List<Category>(); NorthwindDataContext dbml = new NorthwindDataContext(); list = dbml.Categories.ToList(); return list; } //-- GetCategoryProducts [System.Web.Services.WebMethod] public static System.Collections.Generic.List<Product> GetCategoryProducts(int CategoryID) { Random r = new Random(); System.Collections.Generic.List<Product> list = new System.Collections.Generic.List<Product>(); NorthwindDataContext dbml = new NorthwindDataContext(); list = dbml.Products.Where(p => p.CategoryID == CategoryID).ToList(); //foreach (Product p in list) //{ // Product pro = new Product(); // pro.CategoryID=lis //} //for (int i = 0; i < r.Next(10); i++) //{ // MenuItem mi = new MenuItem(); // mi.MenuId = menuId; // mi.MenuItemId = i; // mi.Text = "Menu " + menuId.ToString() + " --- Menu item " + i.ToString(); // mi.NavigateUrl = "http://www.testmenu.com?menuID=" + menuId.ToString() + "&MenuItemID=" + i.ToString(); // list.Add(mi); //} return list; }
Thank you
232 Points
54 Posts
Sep 13, 2011 05:10 PM|LINK
I think the JSON is supported by versions of .Net above 2.0. Which version you are using?
All-Star
30184 Points
4906 Posts
Sep 14, 2011 04:12 AM|LINK
Hi,
Check these-
http://forums.asp.net/p/1685814/4441032.aspx/1?Re+ASP+NET+jQuery+and+Database+Driven+Accordion http://forums.asp.net/p/1681191/4419920.aspx/1?Re+Bind+JQuery+Accordian+to+JSON+Object+via+NET+DataSet
Sep 14, 2011 06:25 AM|LINK
I think that i follow the code in the first example but it didn't work with me
Sep 15, 2011 04:20 AM|LINK
Both are working in my side. Try one thing. Try in a fresh aspx file and check. May be something else is creating problem.
Sep 15, 2011 06:23 PM|LINK
Please check my code and tell me what is wrong with my code
md_refay
Member
416 Points
280 Posts
jQuery and Database Driven Accordion
Sep 12, 2011 04:16 PM|LINK
Hi all,
Please help me to create JAuery Driven data from database
my code is :-
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Untitled Page</title> <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.js" type="text/javascript"></script> <style type="text/css"> .Menu { width: 200px; text-align: center; border: solid 2px gray; padding: 0px; background-color: Silver; cursor: hand; font-weight: bold; } .MenuItem { width: 192px; text-align: center; border: solid 1px silver; padding: 2px; background-color: whitesmoke; } </style> <script type="text/javascript"> $(document).ready(function() { $.ajax( { type: "POST", url: "Default3.aspx/GetCategories", contentType: "application/json; charset=utf-8", dataType: "json", success: CreateMenus, error: function(err) { alert(err.status + " - " + err.statusText); //alert('error'); } }); }); function CreateMenus(results) { results = results.d; for (var i = 0; i < results.length; i++) { $("<div class='Menu'>" + results[i].CategoryName + "</div>") .click({ CategoryID: results[i].CategoryID }, OnMenuClick) .appendTo("#accordionContainer"); } } function OnMenuClick(event) { $("div[id ^= 'menuItemGroup']").slideUp(500); $.ajax( { type: "POST", url: "Default3.aspx/GetCategoryProducts", data: '{"CategoryID":"' + event.data.CategoryID + '"}', contentType: "application/json; charset=utf-8", dataType: "json", success: function(items) { items = items.d; $(event.target).children().remove(); var html = "<div id='menuItemGroup" + event.data.ProductID + "' style='display:none'>"; for (var j = 0; j < items.length; j++) { html += "<div class='MenuItem'><a href=Details.aspx?ProductID='" + items[j].ProductID + "'>" + items[j].ProductName + "</a></div>"; } html += "</div>"; $(event.target).append(html); $("#menuItemGroup" + event.data.CategoryID).slideDown(500); }, error: function(err, r, c) { alert(err.status + " - " + err.statusText); } } ) } </script> </head> <body> <form id="form1" runat="server"> <div id="accordionContainer"> </div> </form> </body> </html>//--GetCategories [System.Web.Services.WebMethod] public static System.Collections.Generic.List<Category> GetCategories() { System.Collections.Generic.List<Category> list = new System.Collections.Generic.List<Category>(); NorthwindDataContext dbml = new NorthwindDataContext(); list = dbml.Categories.ToList(); return list; } //-- GetCategoryProducts [System.Web.Services.WebMethod] public static System.Collections.Generic.List<Product> GetCategoryProducts(int CategoryID) { Random r = new Random(); System.Collections.Generic.List<Product> list = new System.Collections.Generic.List<Product>(); NorthwindDataContext dbml = new NorthwindDataContext(); list = dbml.Products.Where(p => p.CategoryID == CategoryID).ToList(); //foreach (Product p in list) //{ // Product pro = new Product(); // pro.CategoryID=lis //} //for (int i = 0; i < r.Next(10); i++) //{ // MenuItem mi = new MenuItem(); // mi.MenuId = menuId; // mi.MenuItemId = i; // mi.Text = "Menu " + menuId.ToString() + " --- Menu item " + i.ToString(); // mi.NavigateUrl = "http://www.testmenu.com?menuID=" + menuId.ToString() + "&MenuItemID=" + i.ToString(); // list.Add(mi); //} return list; }prasanth.net
Member
232 Points
54 Posts
Re: jQuery and Database Driven Accordion
Sep 13, 2011 05:10 PM|LINK
I think the JSON is supported by versions of .Net above 2.0. Which version you are using?
Please do not forget to mark as answer if this post helped you.
asteranup
All-Star
30184 Points
4906 Posts
Re: jQuery and Database Driven Accordion
Sep 14, 2011 04:12 AM|LINK
Hi,
Check these-
http://forums.asp.net/p/1685814/4441032.aspx/1?Re+ASP+NET+jQuery+and+Database+Driven+Accordion
http://forums.asp.net/p/1681191/4419920.aspx/1?Re+Bind+JQuery+Accordian+to+JSON+Object+via+NET+DataSet
Anup Das Gupta
Mark as Answer if you feel so. Visit My Blog
md_refay
Member
416 Points
280 Posts
Re: jQuery and Database Driven Accordion
Sep 14, 2011 06:25 AM|LINK
I think that i follow the code in the first example but it didn't work with me
asteranup
All-Star
30184 Points
4906 Posts
Re: jQuery and Database Driven Accordion
Sep 15, 2011 04:20 AM|LINK
Hi,
Both are working in my side. Try one thing. Try in a fresh aspx file and check. May be something else is creating problem.
Anup Das Gupta
Mark as Answer if you feel so. Visit My Blog
md_refay
Member
416 Points
280 Posts
Re: jQuery and Database Driven Accordion
Sep 15, 2011 06:23 PM|LINK
Please check my code and tell me what is wrong with my code