Enabled Ajax Data Application With LINQ in VB.NET
Here you will learn how we can use UpdatePanel control to enable asynchronous postbacks on a page.
Introduction : Ajax Enabled Data Application help we create basic user interface for creating, managing, and deleting lists. All the insert, update, delete,sort and paging operation are inside UpdatePanel control that uses Ajax. We can use UpdatePanel control to enable asynchronous postbacks on a page.
Following task are illustrated for creation of Ajax Enabled Data Application.
- Create SQL database and add data.
- Add LinqDataSource control.
- Add LINQ to SQL Classes.
- Use ListView control to display, edit,delete, data.
Step : 1 Open Visual Studio -> File -> WebSite.
- Select ASP.NET WebSite.
- Default.aspx page open.
Step : 2 Solution Explorer -> Right -> Click-> Add New Item
Step : 3 Create New SQL Server Database.
- Solution Explorer -> Add New Item.
- SQL Database.
Step : 4 Create a Schema and Data for the Database.
- Solution Explorer -> App_Data folder and double click
- Right-Click in Table folder and then click Add New Table.
Table :
Step : 5 Right-Click the row and click Set Primary Key.
- Open the Identity Specification section and set (Is Identity) to yes.
- Server Explorer -> Table -> Right - Click -> Show Table Data.
- Add record to the table.
Creating Data Access Controls.
Step : 6 Solution Explorer ->Right-Click-> Add ASP.NET Folder.
- App_Code-> Right-Click-> Add New Item.
- Select LINQ to SQL Classes
- Server Explorer drag Table.
Creating a LinqDataSource Control.
Step : 7 Switch Default.aspx page.
- Select Design View option.
- Drag LinqDataSource Control.
- Selct Context object -> TaskDataContext.
- LinqDataSource Task menu.
- Select Enable Delete, Enable Insert, Enable Update.
Step : 8 Drag and Drop Data Source Controls.
- ListView, DropDownList control.
- Write a code.
Code :
<title></title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<span id ="filter">
current list filter:
<asp:DropDownList ID="DropDownList1" AutoPostBack = "true" runat="server">
<asp:ListItem Text = "active" Value = "False" />
<asp:ListItem Text = "complete" Value = "True" />
</asp:DropDownList>
</span>
<hr id = "separator" />
<asp:LinqDataSource ID="LinqDataSource1" runat="server"
ContextTypeName="DataClassesDataContext" EntityTypeName="" TableName="Table1s">
</asp:LinqDataSource>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:ListView ID="ListView1" runat="server" DataSourceID="LinqDataSource1">
</SelectedItemTemplate>
</asp:ListView>
</ContentTemplate>
</asp:UpdatePanel>
<div>
</div>
</form>
</body>
</html>
Step : 9 Add Ajax Functionality to the Page.
Code :
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
</ContentTemplate>
</asp:UpdatePanel>
Step : 10 Press F5 and run.
