First, I am new to this so please bear with me. I created a webpage that has a a form people can fill out and display the entries in a gridview linked to the sqltable. The page works fine for one user, but if multiple user are using the website I want all users to see any changes to the sqltable automatically. After reading multiple sites it sounds like I want to use a timer on the gridview but cannot find anything on how to do this.
If someone can point me in the right direction?
ASPX
%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Workstation_Role.aspx.cs" Inherits="OnCallWeb.Dispatch_Policies.Workstation_Role" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.auto-style1 {
width: 100%;
}
.auto-style2 {
font-size: 14pt;
}
.auto-style3 {
font-size: 14pt;
width: 56px;
text-align: right;
}
.auto-style5 {
font-size: 14pt;
width: 311px;
}
.auto-style6 {
font-size: 12pt;
}
.auto-style7 {
font-size: 14pt;
text-align: right;
}
.auto-style8 {
text-align: center;
}
.auto-style9 {
font-size: 14pt;
margin-top: 9px;
}
.auto-style10 {
font-size: 14pt;
width: 214px;
text-align: left;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<table class="auto-style1">
<tr>
<td class="auto-style3">Name:</td>
<td class="auto-style5">
<asp:DropDownList ID="DropDownList1" runat="server" CssClass="auto-style2" DataSourceID="SqlDataSource1" DataTextField="Name" DataValueField="Name" Width="300px">
</asp:DropDownList>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:OnCallWebConnectionString %>" SelectCommand="SELECT [Name] FROM [Personnel] ORDER BY [Name]"></asp:SqlDataSource>
</td>
<td class="auto-style10">Postion #: <asp:DropDownList ID="DropDownList3" runat="server" CssClass="auto-style2" Width="130px">
<asp:ListItem></asp:ListItem>
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>Training 7</asp:ListItem>
<asp:ListItem>Training 8</asp:ListItem>
<asp:ListItem>Training 9</asp:ListItem>
<asp:ListItem>Office</asp:ListItem>
</asp:DropDownList>
</td>
<td class="auto-style2">
Roles:
Roles:
<asp:TextBox ID="TextBox1" runat="server" CssClass="auto-style2" Width="772px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="auto-style3">Status:</td>
<td class="auto-style2" colspan="3">
<asp:DropDownList ID="DropDownList4" runat="server" CssClass="auto-style2" Width="223px">
<asp:ListItem>At Desk</asp:ListItem>
<asp:ListItem>Away From Desk</asp:ListItem>
</asp:DropDownList>
Dispatcher Covering:
<asp:DropDownList ID="DropDownList2" runat="server" CssClass="auto-style2" DataSourceID="SqlDataSource3" DataTextField="Name" DataValueField="Name" Width="300px">
</asp:DropDownList>
<asp:SqlDataSource ID="SqlDataSource3" runat="server" ConnectionString="<%$ ConnectionStrings:OnCallWebConnectionString %>" SelectCommand="SELECT [Name] FROM [PersonnelCovering] ORDER BY [Name]"></asp:SqlDataSource>
<asp:Button ID="btnSave" runat="server" CssClass="auto-style6" OnClick="btnSave_Click" Text="Add To List" BackColor="#006600" ForeColor="White" />
<asp:Button ID="btnUpdate" runat="server" CssClass="auto-style6" OnClick="btnUpdate_Click" Text="Update" BackColor="Yellow" />
<asp:Button ID="btnDelete" runat="server" CssClass="auto-style6" OnClick="btnDelete_Click" Text="Delete" BackColor="Red" ForeColor="White" />
<asp:Button ID="btnCancel" runat="server" CssClass="auto-style6" OnClick="btnCancel_Click" Text="Clear" BorderColor="Black" />
<asp:Label ID="lblMessage" runat="server" Font-Bold="True" ForeColor="Red"></asp:Label>
</td>
</tr>
<tr>
<td class="auto-style7" colspan="4">
<div class="auto-style8">
</div>
<asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:OnCallWebConnectionString %>" SelectCommand="SELECT [Name], [Position], [Roles], [Status], [DispatcherCovering], [ID] FROM [Dispatcher_Roles]"></asp:SqlDataSource>
</td>
</tr>
</table>
<div>
<asp:GridView ID="GridView1" runat="server" AllowSorting="True" AutoGenerateColumns="False" DataSourceID="SqlDataSource2" OnSelectedIndexChanged="GridView1_SelectedIndexChanged" CssClass="auto-style9" Width="1757px" EmptyDataText="No Records Found!">
<Columns>
<asp:CommandField ShowSelectButton="True" />
<asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
<asp:BoundField DataField="Position" HeaderText="Position" SortExpression="Position" />
<asp:BoundField DataField="Roles" HeaderText="Roles" SortExpression="Roles" />
<asp:BoundField DataField="Status" HeaderText="Status" SortExpression="Status" />
<asp:BoundField DataField="DispatcherCovering" HeaderText="DispatcherCovering" SortExpression="DispatcherCovering" />
<asp:BoundField DataField="ID" HeaderText="ID" InsertVisible="False" ReadOnly="True" SortExpression="ID" Visible="False" />
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>
Code Behind
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Timers;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
namespace OnCallWeb.Dispatch_Policies
{
public partial class Workstation_Role : System.Web.UI.Page
{
string cs = ConfigurationManager.ConnectionStrings["OnCallWebConnectionString"].ConnectionString;
SqlConnection con;
SqlCommand cmd;
SqlDataAdapter adapter;
DataTable dt;
public void DataLoad()
{
if (Page.IsPostBack)
{
GridView1.DataBind();
}
}
public void ClearAllData()
{
DropDownList1.SelectedValue = DropDownList1.Items[0].ToString();
DropDownList2.SelectedValue = DropDownList2.Items[0].ToString();
DropDownList3.SelectedValue = DropDownList3.Items[0].ToString();
DropDownList4.SelectedValue = DropDownList4.Items[0].ToString();
TextBox1.Text = "";
lblMessage.Text = "";
}
protected void Page_Load(object sender, EventArgs e)
{
}
protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
{
DropDownList1.SelectedValue = GridView1.SelectedRow.Cells[1].Text;
DropDownList3.Text = GridView1.SelectedRow.Cells[2].Text;
TextBox1.Text = GridView1.SelectedRow.Cells[3].Text;
DropDownList4.Text = GridView1.SelectedRow.Cells[4].Text;
DropDownList2.Text = GridView1.SelectedRow.Cells[5].Text;
}
protected void btnSave_Click(object sender, EventArgs e)
{
if (TextBox1.Text != "" && DropDownList1.SelectedValue != "" && DropDownList3.SelectedValue != "")
{
using (con = new SqlConnection(cs))
{
con.Open();
cmd = new SqlCommand("Insert into Dispatcher_Roles (Name, Position, Roles, Status, DispatcherCovering) Values(@Name, @Position, @Roles, @Status, @DispatcherCovering)", con);
cmd.Parameters.AddWithValue("@Name", DropDownList1.SelectedValue);
cmd.Parameters.AddWithValue("@Position", DropDownList3.SelectedValue);
cmd.Parameters.AddWithValue("@Roles", TextBox1.Text);
cmd.Parameters.AddWithValue("@Status", DropDownList4.SelectedValue);
cmd.Parameters.AddWithValue("@DispatcherCovering", DropDownList2.SelectedValue);
cmd.ExecuteNonQuery();
con.Close();
DataLoad();
ClearAllData();
}
}
else
{
lblMessage.Text = "***Fill In All Information***";
}
}
protected void btnUpdate_Click(object sender, EventArgs e)
{
if (TextBox1.Text != "" || DropDownList1.Text !="" || DropDownList2.Text !="")
{
using (con = new SqlConnection(cs))
{
con.Open();
cmd = new SqlCommand("Update Dispatcher_Roles Set Name=@Name, Position=@Position, Roles=@Roles, Status=@Status, DispatcherCovering=@DispatcherCovering where Name=@Name", con);
cmd.Parameters.AddWithValue("@Name", DropDownList1.SelectedValue);
cmd.Parameters.AddWithValue("@Position", DropDownList3.SelectedValue);
cmd.Parameters.AddWithValue("@Roles", TextBox1.Text);
cmd.Parameters.AddWithValue("@Status", DropDownList4.SelectedValue);
cmd.Parameters.AddWithValue("@DispatcherCovering", DropDownList2.SelectedValue);
cmd.ExecuteNonQuery();
con.Close();
DataLoad();
ClearAllData();
}
}
else
{
lblMessage.Text = "Fill In All All Fields";
}
}
protected void btnDelete_Click(object sender, EventArgs e)
{
using(con=new SqlConnection(cs))
{
con.Open();
cmd = new SqlCommand("Delete From Dispatcher_Roles where Name=@Name", con);
cmd.Parameters.AddWithValue("@Name", GridView1.SelectedRow.Cells[1].Text);
cmd.ExecuteNonQuery();
con.Close();
DataLoad();
ClearAllData();
}
}
protected void btnCancel_Click(object sender, EventArgs e)
{
ClearAllData();
}
}
}
To achieve real-time updates for multiple users viewing the gridview, you can consider using the SignalR library in ASP.NET. SignalR allows you to build real-time web applications by enabling server-side code to push content to connected clients instantly.
Here's how you can implement real-time updates for the gridview using SignalR:
Step 1: Install SignalR
Step 2: Create a SignalR Hub
Add a new class to your project and name it something like "GridUpdateHub.cs".
Inherit the class from Hub
provided by SignalR.
Implement a method in the hub that will be called to send updates to the clients. For example, you can create a method named "UpdateGrid" to send the updated grid data to connected clients.
using Microsoft.AspNet.SignalR;
public class GridUpdateHub : Hub { public void UpdateGrid(string data) { // Send the updated data to all connected clients Clients.All.updateGrid(data); } }
Step 3: Register the SignalR Hub
Open the "Global.asax.cs" file in your project.
Add the following code in the Application_Start
method to register the SignalR hub:
using Microsoft.AspNet.SignalR;
using System.Web.Routing;
protected void Application_Start(object sender, EventArgs e)
{
// Register the SignalR hub
RouteTable.Routes.MapHubs();
}
Step 4: Update the ASPX page
Add a reference to the SignalR JavaScript library in your ASPX page.
Add a JavaScript code to connect to the SignalR hub and handle the received updates. Place this code in the <head>
section or at the end of the <body>
section.
Step 5: Trigger updates from the server-side code
In your server-side code (e.g., in the btnSave_Click or btnUpdate_Click methods), after saving or updating the data in the SQL table, you can send the updated data to connected clients using the SignalR hub.
using Microsoft.AspNet.SignalR;
protected void btnSave_Click(object sender, EventArgs e) { // Save the data to the SQL table
// Get the updated data from the SQL table
string updatedData = GetUpdatedGridData(); // Implement this method to retrieve the updated data
// Send the updated data to connected clients
var hubContext = GlobalHost.ConnectionManager.GetHubContext<GridUpdateHub>();
hubContext.Clients.All.updateGrid(updatedData);
}
That's it! With this implementation, whenever a user saves or updates data, the SignalR hub will send the updated data to all connected clients, and the JavaScript code in the ASPX page will handle the received updates and update the gridview accordingly for all users in real-time
Happy coding!!