Click here to Skip to main content
15,895,084 members
Articles / Web Development / HTML

Handling Related Data in Multiple DataGrids with Code Behind and JavaScript

Rate me:
Please Sign up or sign in to vote.
3.50/5 (3 votes)
3 Nov 2006 25.1K   194   19  
An article on handling data persistency on multiple DataGrids with JavaScript an code-behind.
<%@ Register TagPrefix=avg Assembly=ScrollingGrid Namespace=AvgControls %>
<%@ Page Language="vb" AutoEventWireup="false" Codebehind="AuditPage.aspx.vb" Inherits="MultipleDG.AuditPage" enableViewState="False" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
	<HEAD>
		<title>Multiple DG..</title>
		<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
		<meta content="Visual Basic .NET 7.1" name="CODE_LANGUAGE">
		<meta content="JavaScript" name="vs_defaultClientScript">
		<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
		<script language="JavaScript" src="../ScrollingGrid.js"></script>
		<script language="javascript">
		function CheckWeight(val,index)
		{
		
		var temp;
		var wt;
		var indx;
		var currVal;
		var catindx="";	
		var a;	
		var com_index;
		com_index=index.substring(2);
		status=com_index;
		catindx=document.getElementById("sel_CategoryIndex").value;
		document.getElementById("checked_B").value=document.getElementById("checked_B").value + '*' + index;
		var t=document.getElementById("checked_B").value;
		indx=document.getElementById("sel_areaIndex").value
		currVal=eval(document.getElementById(indx).value);
		wt=document.getElementById("sel_areaWeight").value
		temp=parseFloat((val * wt)*-1);
		A = document.getElementById(indx).value
		AA=document.getElementById('C' +catindx).value
		AA=Number(AA)
		//status=AA;
		B = temp
		D=Number(A-B)
		//D=(AA+D)
		if(document.getElementById(index).checked==true)
			{
			document.getElementById(indx).value=(A-B)
			document.getElementById('B'+com_index).disabled=false
				document.getElementById('B'+com_index).focus();
			
			switch(catindx)
					{
						case "1": document.getElementById("C1").value=(D);
									break;
						case "2": document.getElementById("C2").value=(D);
									break;
						case "3": document.getElementById("C3").value=(D);
									break;
						case "4": document.getElementById("C4").value=(D);
									break;
						case "5": document.getElementById("C5").value=(D);
									break;
						case "6": document.getElementById("C6").value=(D);
									break;
						case "7": document.getElementById("C7").value=(D);
									break;
						case "8": document.getElementById("C8").value=(D);
									break;
						case "9": document.getElementById("C9").value=(D);
									break;
						
					}
			}
			else
			{		
				A = Number(A)
				AA = Number(AA)
				B = Number(B)
				C = (A + B)
				document.getElementById(indx).value=C;
				document.getElementById('B'+com_index).value="";
				document.getElementById('B'+com_index).disabled=true;
				
				E=AA-B
				switch(catindx)
					{
					case "1": document.getElementById("C1").value=E;
									
									break;
					case "2": document.getElementById("C2").value=E;
									a="inside c2";
									break;
					case "3": document.getElementById("C3").value=E;
									break;
					case "4": document.getElementById("C4").value=E;
								break;
					case "5": document.getElementById("C5").value=E;
								break;
					case "6": document.getElementById("C6").value=E;
								break;
					case "7": document.getElementById("C7").value=E;
								break;
					case "8": document.getElementById("C8").value=E;
								break;
					case "9": document.getElementById("C9").value=E;
								break;
						
					}
			}
			document.getElementById("currAreaVal").value=document.getElementById(indx).value;
			document.getElementById("txt_totalScore").value=document.getElementById(indx).value;
	}
		
		</script>
	</HEAD>
	<body bottomMargin="0" leftMargin="0" topMargin="0" onload="DisableComments();LoadRiskValuesC();LoadRiskValuesA();LoadRiskValuesB();"
		rightMargin="0" MS_POSITIONING="GridLayout">
		<form id="auditForm" method="post" runat="server">
			<input id="sel_areaIndex" type="hidden" runat="server"> <input id="sel_CategoryIndex" type="hidden" runat="server">
			<input id="sel_areaWeight" type="hidden" runat="server"> <input id="isBreakdownChecked" type="hidden" runat="server">
			<input id="currAreaVal" type="hidden" runat="server"> <input id="checked_B" type="hidden" runat="server">
			<input id="checked_B_Com" type="hidden" runat="server"> <input id="checked_A" type="hidden" runat="server">
			<input id="checked_C" type="hidden" runat="server">
			<TABLE id="Table1" height="100%" cellSpacing="0" cellPadding="0" width="100%" border="2">
				<TR>
					<TD style="WIDTH: 269px" vAlign="top" width="269">
						<table style="WIDTH: 268px; HEIGHT: 550px" cellSpacing="0" border="0">
							<tr>
								<td vAlign="top" bgColor="#99ccff" colSpan="2"><asp:datagrid id="DataGrid3" runat="server" AutoGenerateColumns="False" Width="264px" ShowFooter="True"
										CellPadding="0">
										<ItemStyle Font-Size="8pt" Font-Names="Tahoma" Font-Bold="True" ForeColor="Black" BackColor="LightSteelBlue"></ItemStyle>
										<HeaderStyle Font-Size="X-Small" Font-Bold="True" Wrap="False" HorizontalAlign="Center" VerticalAlign="Middle"
											BackColor="#99CCFF"></HeaderStyle>
										<Columns>
											<asp:BoundColumn DataField="Description" HeaderText="Category"></asp:BoundColumn>
											<asp:BoundColumn Visible="False" DataField="id"></asp:BoundColumn>
											<asp:TemplateColumn HeaderText="Risk Score">
												<HeaderStyle Width="50px"></HeaderStyle>
												<ItemStyle HorizontalAlign="Right"></ItemStyle>
												<ItemTemplate>
													<INPUT class=TextShort id='C<%# DataBinder.Eval(Container.DataItem,"ID") %>' style="WIDTH: 60px; HEIGHT: 22px" disabled type=text size=4 name=textC>
												</ItemTemplate>
											</asp:TemplateColumn>
											<asp:ButtonColumn Visible="False" Text="Select" CommandName="Select"></asp:ButtonColumn>
										</Columns>
									</asp:datagrid></td>
							</tr>
							<tr>
								<td class="chklstbar" vAlign="top" align="left" height="25">Total Risk Score</td>
								<td class="chklstbar" vAlign="top" align="right" height="25"><asp:textbox id="txt_totalScore" runat="server" Width="60px" BackColor="#FFFFC0"></asp:textbox></td>
							</tr>
						</table>
					</TD>
					<TD vAlign="top" align="center" bgColor="lightgrey">
						<table style="WIDTH: 700px; HEIGHT: 238px" cellSpacing="0" cellPadding="0" width="700"
							border="0">
							<TR>
								<td class="heading" vAlign="top" colSpan="2" height="20">Audit Check List-Case Ref 
									No.&nbsp;
									<asp:label id="Label1" runat="server" Width="132px">Label</asp:label></td>
							</TR>
							<tr>
								<td colSpan="2" height="400">
									<table height="100%" cellSpacing="0" cellPadding="0" width="100%" border="0">
										<tr>
											<td class="normaltext" style="HEIGHT: 151px" vAlign="top" align="left" height="151"><avg:scrollinggrid id="sg1" runat="server" Width="99.07%" Wrap="False" BorderColor="Blue" BorderStyle="Dotted"
													BorderWidth="1px" visible="true" CssClass="freezefont" Height="157px">
													<asp:datagrid id="DataGrid1" runat="server" CellPadding="0" Width="688px" AutoGenerateColumns="False"
														BackColor="White" BorderWidth="1px" BorderStyle="Ridge" BorderColor="Gainsboro" CellSpacing="1">
														<SelectedItemStyle Font-Bold="True" ForeColor="White" BackColor="#9471DE"></SelectedItemStyle>
														<ItemStyle Font-Size="X-Small" Height="10px" ForeColor="Black" Width="20px" BackColor="LightSteelBlue"></ItemStyle>
														<HeaderStyle Font-Size="Smaller" Font-Bold="True" Height="15px" ForeColor="#E7E7FF" Width="20px"
															BackColor="#4A3C8C"></HeaderStyle>
														<FooterStyle ForeColor="Black" BackColor="#C6C3C6"></FooterStyle>
														<Columns>
															<asp:TemplateColumn>
																<HeaderStyle HorizontalAlign="Center" BackColor="Gainsboro"></HeaderStyle>
																<ItemStyle HorizontalAlign="Center" Height="20px" Width="20px" VerticalAlign="Middle" BackColor="Gainsboro"></ItemStyle>
																<ItemTemplate>
																	<asp:Image id="img_stat" runat="server" Width="16px" Height="16px" ImageUrl="Images/icons/bullet_ball_glass_blue.png"></asp:Image>
																</ItemTemplate>
															</asp:TemplateColumn>
															<asp:BoundColumn DataField="Description" HeaderText="Area">
																<HeaderStyle Width="250px"></HeaderStyle>
																<ItemStyle Height="20px"></ItemStyle>
															</asp:BoundColumn>
															<asp:BoundColumn Visible="False" DataField="Weight"></asp:BoundColumn>
															<asp:BoundColumn Visible="False" DataField="areaID"></asp:BoundColumn>
															<asp:TemplateColumn HeaderText="Value">
																<HeaderStyle HorizontalAlign="Right"></HeaderStyle>
																<ItemStyle HorizontalAlign="Right" Height="20px" Width="50px" VerticalAlign="Middle"></ItemStyle>
																<ItemTemplate>
																	<INPUT class=textshort id='<%# DataBinder.Eval(Container.DataItem,"AreaID") %>' type=text>
																</ItemTemplate>
															</asp:TemplateColumn>
															<asp:ButtonColumn Visible="False" Text="Select" CommandName="Select"></asp:ButtonColumn>
														</Columns>
														<PagerStyle HorizontalAlign="Right" ForeColor="Black" BackColor="#C6C3C6"></PagerStyle>
													</asp:datagrid>
												</avg:scrollinggrid></td>
										</tr>
										<tr height="200">
											<td class="normaltext" style="HEIGHT: 104px" vAlign="top" align="left" height="104"><avg:scrollinggrid id="Scrollinggrid1" runat="server" Width="99.49%" BorderWidth="1px" visible="true"
													CssClass="freezefont" Height="224px">
													<asp:datagrid id="Breakdown" runat="server" CellPadding="0" Width="688px" AutoGenerateColumns="False"
														BackColor="#C0C0FF" BorderWidth="1px" BorderStyle="None" BorderColor="White" CellSpacing="1"
														Font-Size="X-Small" AllowSorting="True">
														<SelectedItemStyle Font-Bold="True" ForeColor="#663399" BackColor="#FFCC66"></SelectedItemStyle>
														<ItemStyle Font-Size="XX-Small" Height="10px" ForeColor="#330099" BorderStyle="Solid" Width="20px"
															BackColor="White"></ItemStyle>
														<HeaderStyle Font-Size="Smaller" Height="15px" ForeColor="#FFFFCC" BackColor="#333399"></HeaderStyle>
														<FooterStyle ForeColor="#330099" BackColor="#FFFFCC"></FooterStyle>
														<Columns>
															<asp:TemplateColumn>
																<HeaderStyle HorizontalAlign="Center" BackColor="Gainsboro"></HeaderStyle>
																<ItemStyle HorizontalAlign="Center" Height="20px" Width="20px" VerticalAlign="Middle" BackColor="Gainsboro"></ItemStyle>
																<ItemTemplate>
																	<asp:Image id="img_statB" runat="server" Width="16px" Height="16px" ImageUrl="Images/icons/bullet_ball_glass_blue.png"></asp:Image>
																</ItemTemplate>
															</asp:TemplateColumn>
															<asp:BoundColumn DataField="Description" HeaderText="Break Down">
																<ItemStyle Width="450px"></ItemStyle>
															</asp:BoundColumn>
															<asp:BoundColumn Visible="False" DataField="weight" HeaderText="Weight"></asp:BoundColumn>
															<asp:TemplateColumn HeaderText="Weight">
																<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle"></ItemStyle>
																<ItemTemplate>
																	<INPUT id='wt<%# DataBinder.Eval(Container.DataItem,"ID") %>' onclick=CheckWeight(this.value,this.id); type=checkbox value='<%# DataBinder.Eval(Container.DataItem,"weight") %>' >
																	<%# DataBinder.Eval(Container.DataItem,"weight") %>
																</ItemTemplate>
															</asp:TemplateColumn>
															<asp:TemplateColumn HeaderText="Comments">
																<HeaderStyle HorizontalAlign="Center"></HeaderStyle>
																<ItemStyle HorizontalAlign="Center"></ItemStyle>
																<ItemTemplate>
																	<input type=text name="comments"  id='B<%# DataBinder.Eval(Container.DataItem,"ID") %>' Class="textlong150" onblur="AppendComments(this.value);" >
																</ItemTemplate>
															</asp:TemplateColumn>
															<asp:ButtonColumn Visible="False" Text="Select" CommandName="Select"></asp:ButtonColumn>
														</Columns>
														<PagerStyle HorizontalAlign="Center" ForeColor="#330099" BackColor="#FFFFCC"></PagerStyle>
													</asp:datagrid>
												</avg:scrollinggrid></td>
										</tr>
									</table>
								</td>
							</tr>
						</table>
						<TABLE class="freezefont" id="Table2" cellSpacing="0" cellPadding="0" width="100%" bgColor="#ccccff"
							border="0">
							<TR>
								<TD style="WIDTH: 383px; HEIGHT: 13px" bgColor="#ccccff"></TD>
								<TD style="HEIGHT: 13px" bgColor="#ccccff"></TD>
							</TR>
							<TR>
								<TD style="WIDTH: 383px"></TD>
								<td vAlign="top" bgColor="#ccccff"></td>
							</TR>
							<TR>
								<TD style="WIDTH: 383px" bgColor="#ccccff"></TD>
								<TD bgColor="#ccccff"></TD>
							</TR>
							<tr>
								<td style="WIDTH: 383px; HEIGHT: 23px" bgColor="#ccccff"></td>
								<td style="HEIGHT: 23px" align="center" bgColor="#ccccff"><asp:button id="btn_finish" runat="server" Text="Clear DB"></asp:button></td>
							</tr>
						</TABLE>
					</TD>
				</TR>
			</TABLE>
		</form>
	</body>
</HTML>

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


Written By
India India
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions