|
|
Rank: Advanced Member
Groups: Member
Joined: 9/2/2010
Posts: 120
|
Hi, Consider the ASP.NET application below.
Code: HTML/ASPX
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm2.aspx.vb" Inherits="TreeView.WebForm2" %>
<%@ Register Assembly="EO.Web" Namespace="EO.Web" TagPrefix="eo" %>
<!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>Grid in Dialog Test</title>
<script language="JavaScript1.2">
<!--
top.window.moveTo(0,0);
if (document.all) {
top.window.resizeTo(screen.availWidth,screen.availHeight);
}
else if (document.layers||document.getElementById) {
if (top.window.outerHeight<screen.availHeight||top.window.outerWidth<screen.availWidth){
top.window.outerHeight = screen.availHeight;
top.window.outerWidth = screen.availWidth;
}
}
//-->
</script>
<script language="JavaScript">
function ShowEmail()
{
var grid = eo_GetObject('grdData');
var item = grid.getSelectedItem();
var cell = item.getCell(2);
var text = cell.getValue();
var person = text.split(';');
cell = item.getCell(3);
text = cell.getValue();
var email = text.split(';');
grid = eo_GetObject('grdEmail');
var ctr = 0;
for (ctr = 0; ctr < grid.getItemCount(); ctr++)
{
grid.deleteItem(ctr);
}
ctr = 0;
for (ctr = 0; ctr < person.length; ctr++)
{
item = grid.addItem();
item.getCell(1).setValue(person[ctr]);
item.getCell(2).setValue(email[ctr]);
item.ensureVisible();
}
eo_GetObject('dlgEmail').show(true);
document.getElementById("<%=grdEmail.ClientID%>").focus();
}
function HideEmail()
{
var grid = eo_GetObject('grdEmail');
var item = null;
var person = '';
var email = '';
var ctr = 0;
for (ctr = 0; ctr < grid.getItemCount(); ctr++)
{
item = grid.getItem(ctr);
if (item != null)
{
if (item.isDeleted() == false)
{
if (item.getCell(1).getValue() != null)
{
if (person != '') { person += ';'; }
person += item.getCell(1).getValue()
}
if (item.getCell(2).getValue() != null)
{
if (email != '') { email += ';'; }
email += item.getCell(2).getValue()
}
grid.deleteItem(ctr);
}
}
}
grid = eo_GetObject('grdData');
item = grid.getSelectedItem();
item.getCell(2).setValue(person);
item.getCell(3).setValue(email);
eo_GetObject('dlgEmail').close();
return false;
}
function NewEmail()
{
var grid = eo_GetObject('grdEmail');
if (grid.getItemCount() > 0)
{
var i = 0;
var item = null;
for (i = 0; i < grid.getItemCount(); i++)
{
item = grid.getItem(i);
if (item != null)
{
if (item.isDeleted() != true)
{
if (item.getCell(1).getValue() == null || item.getCell(1).getValue() == '' ||
item.getCell(2).getValue() == null || item.getCell(2).getValue() == '')
{
grid.SelectedItemIndex = i;
return false;
}
}
}
}
}
var item = grid.addItem();
item.ensureVisible();
grid.SelectedItemIndex = grid.getItemCount() - 1;
return false;
}
function CheckDelete()
{
if (window.confirm("Are you sure you want to delete this person?"))
{
var grid = eo_GetObject('grdEmail');
var cell = grid.getSelectedCell();
grid.deleteItem(cell.getItemIndex());
}
return false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Label ID="Label1" runat="server" Text="Grid in Dialog Test" Font-Bold="True" Font-Names="Verdana" Font-Size="Larger" ForeColor="#003399"></asp:Label><br />
<br />
<eo:Grid ID="grdData" runat="server" BackColor="#F0F0F0" BorderColor="#C7D1DF" BorderWidth="1px"
ColumnHeaderAscImage="00050303" ColumnHeaderDescImage="00050304" ColumnHeaderDividerImage="00050302"
FixedColumnCount="1" Font-Bold="False" Font-Italic="False" Font-Names="Verdana"
Font-Overline="False" Font-Size="9pt" Font-Strikeout="False" Font-Underline="False" GridLineColor="199, 209, 223" GridLines="Both" Height="128px"
ItemHeight="19" EnableKeyboardNavigation="True" ClientSideBeforeEditItem="HideEmail" ClientSideOnItemSelected="ShowEmail" Width="768px">
<FooterStyle CssText="padding-bottom:4px;padding-left:4px;padding-right:4px;padding-top:4px;" />
<ItemStyles>
<eo:GridItemStyleSet>
<ItemStyle CssText="background-color: white" />
<ItemHoverStyle CssText="background-image: url(00050206); background-repeat: repeat-x" />
<SelectedStyle CssText="background-image: url(00050207); background-repeat: repeat-x" />
<CellStyle CssText="padding-left:8px;padding-top:2px; color:#336699;white-space:nowrap;" />
</eo:GridItemStyleSet>
</ItemStyles>
<ColumnTemplates>
<eo:TextBoxColumn>
<TextBoxStyle CssText="BORDER-RIGHT: #7f9db9 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7f9db9 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 8.75pt; PADDING-BOTTOM: 1px; MARGIN: 0px; BORDER-LEFT: #7f9db9 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #7f9db9 1px solid; FONT-FAMILY: Tahoma" />
<CellStyle CssText="color:#003399;" />
</eo:TextBoxColumn>
<eo:DateTimeColumn>
<DatePicker ControlSkinID="None" DayCellHeight="16" DayCellWidth="19" DayHeaderFormat="FirstLetter"
DisabledDates="" OtherMonthDayVisible="True" SelectedDates="" TitleLeftArrowImageUrl="DefaultSubMenuIconRTL"
TitleRightArrowImageUrl="DefaultSubMenuIcon">
<TodayStyle CssText="font-family: tahoma; font-size: 12px; border-right: #bb5503 1px solid; border-top: #bb5503 1px solid; border-left: #bb5503 1px solid; border-bottom: #bb5503 1px solid" />
<SelectedDayStyle CssText="font-family: tahoma; font-size: 12px; background-color: #fbe694; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<DisabledDayStyle CssText="font-family: tahoma; font-size: 12px; color: gray; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<PickerStyle CssText="border-bottom-color:#7f9db9;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#7f9db9;border-left-style:solid;border-left-width:1px;border-right-color:#7f9db9;border-right-style:solid;border-right-width:1px;border-top-color:#7f9db9;border-top-style:solid;border-top-width:1px;font-family:Courier New;font-size:8pt;margin-bottom:0px;margin-left:0px;margin-right:0px;margin-top:0px;padding-bottom:1px;padding-left:2px;padding-right:2px;padding-top:2px;" />
<CalendarStyle CssText="background-color: white; border-right: #7f9db9 1px solid; padding-right: 4px; border-top: #7f9db9 1px solid; padding-left: 4px; font-size: 9px; padding-bottom: 4px; border-left: #7f9db9 1px solid; padding-top: 4px; border-bottom: #7f9db9 1px solid; font-family: tahoma" />
<TitleArrowStyle CssText="cursor:hand" />
<DayHoverStyle CssText="font-family: tahoma; font-size: 12px; border-right: #fbe694 1px solid; border-top: #fbe694 1px solid; border-left: #fbe694 1px solid; border-bottom: #fbe694 1px solid" />
<MonthStyle CssText="font-family: tahoma; font-size: 12px; margin-left: 14px; cursor: hand; margin-right: 14px" />
<TitleStyle CssText="background-color:#9ebef5;font-family:Tahoma;font-size:12px;padding-bottom:2px;padding-left:6px;padding-right:6px;padding-top:2px;" />
<OtherMonthDayStyle CssText="font-family: tahoma; font-size: 12px; color: gray; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<DayHeaderStyle CssText="font-family: tahoma; font-size: 12px; border-bottom: #aca899 1px solid" />
<DayStyle CssText="font-family: tahoma; font-size: 12px; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
</DatePicker>
</eo:DateTimeColumn>
<eo:MaskedEditColumn>
<MaskedEdit ControlSkinID="None" TextBoxStyle-CssText="BORDER-RIGHT: #7f9db9 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7f9db9 1px solid; PADDING-LEFT: 2px; PADDING-BOTTOM: 1px; MARGIN: 0px; BORDER-LEFT: #7f9db9 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #7f9db9 1px solid; font-family:Courier New;font-size:8pt;">
</MaskedEdit>
</eo:MaskedEditColumn>
</ColumnTemplates>
<Columns>
<eo:RowNumberColumn Width="35">
</eo:RowNumberColumn>
<eo:StaticColumn DataType="String" HeaderText="Unit" Name="UNI_NM_UNIT" ReadOnly="True"
Width="210">
</eo:StaticColumn>
<eo:TextBoxColumn DataType="String" HeaderText="Name" Name="UNGL_NM_RESPONSIBLE_PERSONS"
TextBoxMaxLength="50" Width="220">
</eo:TextBoxColumn>
<eo:TextBoxColumn DataType="String" HeaderText="Email" Name="UNGL_DS_RESPONSABLE_PERSONS_EMAIL"
TextBoxMaxLength="100" Width="280">
</eo:TextBoxColumn>
</Columns>
<ColumnHeaderStyle CssText="background-image:url('00050301');padding-left:8px;padding-top:2px;font-weight: bold;color:white;" />
</eo:Grid>
<eo:Dialog ID="dlgEmail" runat="server" BackColor="#FFFFD4" ClientSideOnCancel=""
ControlSkinID="None" ForeColor="#003399" HeaderHtml="Persons" Height="96px"
Width="552px">
<HeaderStyleActive CssText="background-image:url('00020311');color:#003399;font-family:'trebuchet ms';font-size:10pt;font-weight:bold;padding-bottom:5px;padding-left:8px;padding-right:3px;padding-top:0px;" />
<BorderImages BottomBorder="00020305" BottomLeftCorner="00020304" BottomRightCorner="00020306"
LeftBorder="00020303" RightBorder="00020307" TopBorder="00020310" TopLeftCorner="00020301"
TopLeftCornerBottom="00020302" TopRightCorner="00020309" TopRightCornerBottom="00020308" />
<FooterStyleActive CssText="padding-right: 4px; padding-left: 4px; font-size: 8pt; padding-bottom: 4px; padding-top: 4px; font-family: tahoma" />
<ContentTemplate>
<table border="0" cellpadding="0" cellspacing="0" style="width: 100%">
<tr>
<td style="width: 10px; height: 15px">
</td>
<td>
</td>
<td style="width: 20px">
</td>
</tr>
<tr>
<td style="height: 24px; width: 10px;">
</td>
<td style="height: 26px; vertical-align: middle;">
<asp:Button ID="cmdEmailNew" runat="server" TabIndex="-1" Text="New" Width="80px" OnClientClick="javascript: return NewEmail();" />
<asp:Button ID="cmdEmailDelete" runat="server" OnClientClick="javascript: return CheckDelete();"
TabIndex="-1" Text="Delete" Width="80px" />
<asp:Button ID="cmdsave" runat="server" OnClientClick="javascript: return HideEmail();"
TabIndex="-1" Text="Accept" Width="80px" />
<asp:Button ID="cmdEmailQuit" runat="server" OnClientClick="javascript: eo_GetObject('dlgEmail').close(); return false;"
TabIndex="-1" Text="Quit" Width="80px" /></td>
<td style="height: 22px">
</td>
</tr>
<tr>
<td style="height: 15px; width: 10px;">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td style="width: 10px; height: 15px">
</td>
<td>
<eo:Grid ID="grdEmail" runat="server" BackColor="#F0F0F0" BorderColor="#C7D1DF"
BorderWidth="1px" ColumnHeaderAscImage="00050303" ColumnHeaderDescImage="00050304"
ColumnHeaderDividerImage="00050302" EnableKeyboardNavigation="True" FixedColumnCount="1"
Font-Bold="False" Font-Italic="False" Font-Names="Verdana" Font-Overline="False"
Font-Size="9pt" Font-Strikeout="False" Font-Underline="False" FullRowMode="False"
GridLineColor="199, 209, 223" GridLines="Both" Height="128px" ItemHeight="19"
Width="552px" TabIndex="1">
<FooterStyle CssText="padding-bottom:4px;padding-left:4px;padding-right:4px;padding-top:4px;" />
<ItemStyles>
<eo:GridItemStyleSet>
<ItemStyle CssText="background-color: white" />
<ItemHoverStyle CssText="background-image: url(00050206); background-repeat: repeat-x" />
<SelectedStyle CssText="background-image: url(00050207); background-repeat: repeat-x" />
<CellStyle CssText="padding-left:8px;padding-top:2px; color:#336699;white-space:nowrap;" />
</eo:GridItemStyleSet>
</ItemStyles>
<ColumnTemplates>
<eo:TextBoxColumn>
<TextBoxStyle CssText="border-bottom-color:#7f9db9;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#7f9db9;border-left-style:solid;border-left-width:1px;border-right-color:#7f9db9;border-right-style:solid;border-right-width:1px;border-top-color:#7f9db9;border-top-style:solid;border-top-width:1px;color:#003399;font-family:Verdana;font-size:8pt;margin-bottom:0px;margin-left:0px;margin-right:0px;margin-top:0px;padding-bottom:1px;padding-left:2px;padding-right:2px;padding-top:2px;" />
<CellStyle CssText="color:#003399;" />
</eo:TextBoxColumn>
<eo:DateTimeColumn>
<DatePicker ControlSkinID="None" DayCellHeight="16" DayCellWidth="19" DayHeaderFormat="FirstLetter"
DisabledDates="" OtherMonthDayVisible="True" SelectedDates="" TitleLeftArrowImageUrl="DefaultSubMenuIconRTL"
TitleRightArrowImageUrl="DefaultSubMenuIcon">
<TodayStyle CssText="font-family: tahoma; font-size: 12px; border-right: #bb5503 1px solid; border-top: #bb5503 1px solid; border-left: #bb5503 1px solid; border-bottom: #bb5503 1px solid" />
<SelectedDayStyle CssText="font-family: tahoma; font-size: 12px; background-color: #fbe694; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<DisabledDayStyle CssText="font-family: tahoma; font-size: 12px; color: gray; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<PickerStyle CssText="border-bottom-color:#7f9db9;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#7f9db9;border-left-style:solid;border-left-width:1px;border-right-color:#7f9db9;border-right-style:solid;border-right-width:1px;border-top-color:#7f9db9;border-top-style:solid;border-top-width:1px;font-family:Courier New;font-size:8pt;margin-bottom:0px;margin-left:0px;margin-right:0px;margin-top:0px;padding-bottom:1px;padding-left:2px;padding-right:2px;padding-top:2px;" />
<CalendarStyle CssText="background-color: white; border-right: #7f9db9 1px solid; padding-right: 4px; border-top: #7f9db9 1px solid; padding-left: 4px; font-size: 9px; padding-bottom: 4px; border-left: #7f9db9 1px solid; padding-top: 4px; border-bottom: #7f9db9 1px solid; font-family: tahoma" />
<TitleArrowStyle CssText="cursor:hand" />
<DayHoverStyle CssText="font-family: tahoma; font-size: 12px; border-right: #fbe694 1px solid; border-top: #fbe694 1px solid; border-left: #fbe694 1px solid; border-bottom: #fbe694 1px solid" />
<MonthStyle CssText="font-family: tahoma; font-size: 12px; margin-left: 14px; cursor: hand; margin-right: 14px" />
<TitleStyle CssText="background-color:#9ebef5;font-family:Tahoma;font-size:12px;padding-bottom:2px;padding-left:6px;padding-right:6px;padding-top:2px;" />
<OtherMonthDayStyle CssText="font-family: tahoma; font-size: 12px; color: gray; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<DayHeaderStyle CssText="font-family: tahoma; font-size: 12px; border-bottom: #aca899 1px solid" />
<DayStyle CssText="font-family: tahoma; font-size: 12px; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
</DatePicker>
</eo:DateTimeColumn>
<eo:MaskedEditColumn>
<MaskedEdit ControlSkinID="None" TextBoxStyle-CssText="BORDER-RIGHT: #7f9db9 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7f9db9 1px solid; PADDING-LEFT: 2px; PADDING-BOTTOM: 1px; MARGIN: 0px; BORDER-LEFT: #7f9db9 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #7f9db9 1px solid; font-family:Courier New;font-size:8pt;">
</MaskedEdit>
</eo:MaskedEditColumn>
</ColumnTemplates>
<Columns>
<eo:RowNumberColumn Width="35">
</eo:RowNumberColumn>
<eo:TextBoxColumn DataType="String" HeaderText="Name" Name="NM_RESPONSABLE_PERSONS"
TextBoxMaxLength="50" Width="220">
</eo:TextBoxColumn>
<eo:TextBoxColumn DataType="String" HeaderText="Email" Name="DS_RESPONSABLE_PERSONS_EMAIL"
TextBoxMaxLength="150" Width="280">
</eo:TextBoxColumn>
</Columns>
<ColumnHeaderStyle CssText="background-image:url('00050301');padding-left:8px;padding-top:2px;font-weight: bold;color:white;" />
</eo:Grid>
</td>
<td>
</td>
</tr>
<tr>
<td style="width: 10px; height: 15px">
</td>
<td>
</td>
<td>
</td>
</tr>
</table>
</ContentTemplate>
<ContentStyleActive CssText="padding-right: 4px; padding-left: 4px; font-size: 8pt; padding-bottom: 4px; padding-top: 4px; font-family: tahoma" />
</eo:Dialog>
</div>
</form>
</body>
</html>
Code: Visual Basic.NET
Imports EO.Web
Partial Public Class WebForm2
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not Me.Page.IsPostBack Then
Dim GridRow As EO.Web.GridItem, Ctr As Integer
For Ctr = 1 To 3
GridRow = Me.grdData.CreateItem()
GridRow.Cells(0).Value = Ctr
GridRow.Cells(1).Value = "Unit #" & Ctr.ToString
GridRow.Cells(2).Value = "Person " & Format(Ctr, "00")
GridRow.Cells(3).Value = "person" & Format(Ctr, "00") & "@gmail.com"
Me.grdData.Items.Add(GridRow)
Next
End If
End Sub
End Class
It used to register persons engaged in a renewal process of license documents, and shows the window below:  When you click the mouse on any row of the grid control, a control dialog is shown that allows to register those involved in the document renewal process, as the window below.  And I'm having two problems. The first is when I'm editing the colum Name and press Tab button, the Gird control goes to the Email column but not in edition mode, forcing me to click on the column. Is there any way to force Grid control to enter into edition mode automatically when I press Tab button? The second is when I'm editing any column and pressing the "Accept" button, as the example below:  It was inserted "Other Person" in the Name column correctly, but did not consider the insertion of "otherperson@gmail.com" in Email column, as shown below in red box.  How can I fix this? Thanks, Marcelo Camarate
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,071
|
Hi, For the first question please see this post for the answer: http://www.essentialobjects.com/forum/postst3841_How-to-automatically-edit-an-cell-when-the-cell-receives-focus.aspxThe second question appears to be a user code error. We do not troubleshoot/debug code for our users. If you believe the problem is on the control side, please try to identify the exact case of failure and create a test page that demonstrates the problem. We will take a look as soon as we have that. Thanks!
|
|
Rank: Advanced Member
Groups: Member
Joined: 9/2/2010
Posts: 120
|
Hi, Thanks for you quickly reply. For the first problem, your tip worked very well. The second problem I fixed putting the command "Grid.editCell (-1.0, true)" in the begin of the function called by the Accept button. But, I have two more problems. The first is that I used the same idea shown in http://www.essentialobjects.com/forum/postst3841_How-to-automatically-edit-an-cell-when-the-cell-receives-focus.aspx, to force the edition of the first cell when the control Dialog is shown. But, when I press the Tab key, the cursor don't move to the second cell of the same item. This happens only when I click the mouse on the first cell. The second is that when have more than one row in the Grid control, the Tab key moves the cursor sequentially through all the cells in order Top-Down and Left-Right. But, when the cursor reachs the last cell, the cursor moves only by cells in the last row. You can see a demonstration of the two problems by clicking on the "Unit #2" row (the second one). Can this be fixed? I'm put below the demo application code already changed with your previous suggestions, if you need test it. Regards, marcelo Camarate
Code: HTML/ASPX
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm2.aspx.vb" Inherits="TreeView.WebForm2" %>
<%@ Register Assembly="EO.Web" Namespace="EO.Web" TagPrefix="eo" %>
<!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>Grid in Dialog Test</title>
<script language="JavaScript1.2">
<!--
top.window.moveTo(0,0);
if (document.all) {
top.window.resizeTo(screen.availWidth,screen.availHeight);
}
else if (document.layers||document.getElementById) {
if (top.window.outerHeight<screen.availHeight||top.window.outerWidth<screen.availWidth){
top.window.outerHeight = screen.availHeight;
top.window.outerWidth = screen.availWidth;
}
}
//-->
</script>
<script language="JavaScript">
function ShowEmail()
{
var grid = eo_GetObject('grdData');
var item = grid.getSelectedItem();
var cell = item.getCell(2);
var text = cell.getValue();
var person = text.split(';');
cell = item.getCell(3);
text = cell.getValue();
var email = text.split(';');
grid = eo_GetObject('grdEmail');
var ctr = 0;
for (ctr = 0; ctr < grid.getItemCount(); ctr++)
{
grid.deleteItem(ctr);
}
if (person.length > 0 || email.length > 0)
{
ctr = 0;
for (ctr = 0; ctr < person.length && ctr < email.length; ctr++)
{
item = grid.addItem();
if (ctr < person.length) { item.getCell(1).setValue(person[ctr]); }
if (ctr < email.length) { item.getCell(2).setValue(email[ctr]); }
item.ensureVisible();
}
}
eo_GetObject('dlgEmail').show(true);
if (grid.getItemCount() > 0)
{
grid.selectCell(0, 1);
}
}
function HideEmail()
{
var grid = eo_GetObject('grdEmail');
grid.editCell(-1,0,true)
var item = null;
var person = '';
var email = '';
var ctr = 0;
for (ctr = 0; ctr < grid.getItemCount(); ctr++)
{
item = grid.getItem(ctr);
if (item != null)
{
if (item.isDeleted() == false)
{
if (item.getCell(1).getValue() != null)
{
if (person != '') { person += ';'; }
person += item.getCell(1).getValue()
}
if (item.getCell(2).getValue() != null)
{
if (email != '') { email += ';'; }
email += item.getCell(2).getValue()
}
grid.deleteItem(ctr);
}
}
}
grid = eo_GetObject('grdData');
item = grid.getSelectedItem();
item.getCell(2).setValue(person);
item.getCell(3).setValue(email);
eo_GetObject('dlgEmail').close();
return false;
}
function NewEmail()
{
var grid = eo_GetObject('grdEmail');
grid.editCell(-1,0,true)
if (grid.getItemCount() > 0)
{
var i = 0;
var item = null;
for (i = 0; i < grid.getItemCount(); i++)
{
item = grid.getItem(i);
if (item != null)
{
if (item.isDeleted() != true)
{
if (item.getCell(1).getValue() == null || item.getCell(1).getValue() == '' ||
item.getCell(2).getValue() == null || item.getCell(2).getValue() == '')
{
grid.SelectedItemIndex = i;
return false;
}
}
}
}
}
var item = grid.addItem();
item.ensureVisible();
grid.SelectedItemIndex = grid.getItemCount() - 1;
return false;
}
function CellEmailSelected()
{
//Get the selected cell
var grid = eo_GetObject("grdEmail");
var cell = grid.getSelectedCell();
//Put the selected cell into edit mode
if (cell)
grid.editCell(cell.getItemIndex(), cell.getColIndex());
}
function CheckDelete()
{
var grid = eo_GetObject('grdEmail');
grid.editCell(-1,0,true)
if (window.confirm("Are you sure you want to delete this person?"))
{
var cell = grid.getSelectedCell();
if (cell != null)
{
grid.deleteItem(cell.getItemIndex());
} else {
var item = grid.getSelectedItem();
if (item != null)
{
grid.deleteItem(item.getIndex());
}
}
}
return false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Label ID="Label1" runat="server" Text="Grid in Dialog Test" Font-Bold="True" Font-Names="Verdana" Font-Size="Larger" ForeColor="#003399"></asp:Label><br />
<br />
<eo:Grid ID="grdData" runat="server" BackColor="#F0F0F0" BorderColor="#C7D1DF" BorderWidth="1px"
ColumnHeaderAscImage="00050303" ColumnHeaderDescImage="00050304" ColumnHeaderDividerImage="00050302"
FixedColumnCount="1" Font-Bold="False" Font-Italic="False" Font-Names="Verdana"
Font-Overline="False" Font-Size="9pt" Font-Strikeout="False" Font-Underline="False" GridLineColor="199, 209, 223" GridLines="Both" Height="128px"
ItemHeight="19" EnableKeyboardNavigation="True" ClientSideBeforeEditItem="HideEmail" ClientSideOnItemSelected="ShowEmail" Width="768px">
<FooterStyle CssText="padding-bottom:4px;padding-left:4px;padding-right:4px;padding-top:4px;" />
<ItemStyles>
<eo:GridItemStyleSet>
<ItemStyle CssText="background-color: white" />
<ItemHoverStyle CssText="background-image: url(00050206); background-repeat: repeat-x" />
<SelectedStyle CssText="background-image: url(00050207); background-repeat: repeat-x" />
<CellStyle CssText="padding-left:8px;padding-top:2px; color:#336699;white-space:nowrap;" />
</eo:GridItemStyleSet>
</ItemStyles>
<ColumnTemplates>
<eo:TextBoxColumn>
<TextBoxStyle CssText="BORDER-RIGHT: #7f9db9 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7f9db9 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 8.75pt; PADDING-BOTTOM: 1px; MARGIN: 0px; BORDER-LEFT: #7f9db9 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #7f9db9 1px solid; FONT-FAMILY: Tahoma" />
<CellStyle CssText="color:#003399;" />
</eo:TextBoxColumn>
<eo:DateTimeColumn>
<DatePicker ControlSkinID="None" DayCellHeight="16" DayCellWidth="19" DayHeaderFormat="FirstLetter"
DisabledDates="" OtherMonthDayVisible="True" SelectedDates="" TitleLeftArrowImageUrl="DefaultSubMenuIconRTL"
TitleRightArrowImageUrl="DefaultSubMenuIcon">
<TodayStyle CssText="font-family: tahoma; font-size: 12px; border-right: #bb5503 1px solid; border-top: #bb5503 1px solid; border-left: #bb5503 1px solid; border-bottom: #bb5503 1px solid" />
<SelectedDayStyle CssText="font-family: tahoma; font-size: 12px; background-color: #fbe694; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<DisabledDayStyle CssText="font-family: tahoma; font-size: 12px; color: gray; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<PickerStyle CssText="border-bottom-color:#7f9db9;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#7f9db9;border-left-style:solid;border-left-width:1px;border-right-color:#7f9db9;border-right-style:solid;border-right-width:1px;border-top-color:#7f9db9;border-top-style:solid;border-top-width:1px;font-family:Courier New;font-size:8pt;margin-bottom:0px;margin-left:0px;margin-right:0px;margin-top:0px;padding-bottom:1px;padding-left:2px;padding-right:2px;padding-top:2px;" />
<CalendarStyle CssText="background-color: white; border-right: #7f9db9 1px solid; padding-right: 4px; border-top: #7f9db9 1px solid; padding-left: 4px; font-size: 9px; padding-bottom: 4px; border-left: #7f9db9 1px solid; padding-top: 4px; border-bottom: #7f9db9 1px solid; font-family: tahoma" />
<TitleArrowStyle CssText="cursor:hand" />
<DayHoverStyle CssText="font-family: tahoma; font-size: 12px; border-right: #fbe694 1px solid; border-top: #fbe694 1px solid; border-left: #fbe694 1px solid; border-bottom: #fbe694 1px solid" />
<MonthStyle CssText="font-family: tahoma; font-size: 12px; margin-left: 14px; cursor: hand; margin-right: 14px" />
<TitleStyle CssText="background-color:#9ebef5;font-family:Tahoma;font-size:12px;padding-bottom:2px;padding-left:6px;padding-right:6px;padding-top:2px;" />
<OtherMonthDayStyle CssText="font-family: tahoma; font-size: 12px; color: gray; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<DayHeaderStyle CssText="font-family: tahoma; font-size: 12px; border-bottom: #aca899 1px solid" />
<DayStyle CssText="font-family: tahoma; font-size: 12px; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
</DatePicker>
</eo:DateTimeColumn>
<eo:MaskedEditColumn>
<MaskedEdit ControlSkinID="None" TextBoxStyle-CssText="BORDER-RIGHT: #7f9db9 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7f9db9 1px solid; PADDING-LEFT: 2px; PADDING-BOTTOM: 1px; MARGIN: 0px; BORDER-LEFT: #7f9db9 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #7f9db9 1px solid; font-family:Courier New;font-size:8pt;">
</MaskedEdit>
</eo:MaskedEditColumn>
</ColumnTemplates>
<Columns>
<eo:RowNumberColumn Width="35">
</eo:RowNumberColumn>
<eo:StaticColumn DataType="String" HeaderText="Unit" Name="UNI_NM_UNIT" ReadOnly="True"
Width="210">
</eo:StaticColumn>
<eo:TextBoxColumn DataType="String" HeaderText="Name" Name="UNGL_NM_RESPONSIBLE_PERSONS"
TextBoxMaxLength="50" Width="220">
</eo:TextBoxColumn>
<eo:TextBoxColumn DataType="String" HeaderText="Email" Name="UNGL_DS_RESPONSABLE_PERSONS_EMAIL"
TextBoxMaxLength="100" Width="280">
</eo:TextBoxColumn>
</Columns>
<ColumnHeaderStyle CssText="background-image:url('00050301');padding-left:8px;padding-top:2px;font-weight: bold;color:white;" />
</eo:Grid>
<eo:Dialog ID="dlgEmail" runat="server" BackColor="#FFFFD4"
ControlSkinID="None" ForeColor="#003399" HeaderHtml="Persons" Height="96px"
Width="552px" >
<HeaderStyleActive CssText="background-image:url('00020311');color:#003399;font-family:'trebuchet ms';font-size:10pt;font-weight:bold;padding-bottom:5px;padding-left:8px;padding-right:3px;padding-top:0px;" />
<BorderImages BottomBorder="00020305" BottomLeftCorner="00020304" BottomRightCorner="00020306"
LeftBorder="00020303" RightBorder="00020307" TopBorder="00020310" TopLeftCorner="00020301"
TopLeftCornerBottom="00020302" TopRightCorner="00020309" TopRightCornerBottom="00020308" />
<FooterStyleActive CssText="padding-right: 4px; padding-left: 4px; font-size: 8pt; padding-bottom: 4px; padding-top: 4px; font-family: tahoma" />
<ContentTemplate>
<table border="0" cellpadding="0" cellspacing="0" style="width: 100%">
<tr>
<td style="width: 10px; height: 15px">
</td>
<td>
</td>
<td style="width: 20px">
</td>
</tr>
<tr>
<td style="height: 24px; width: 10px;">
</td>
<td style="height: 26px; vertical-align: middle;">
<asp:Button ID="cmdEmailNew" runat="server" TabIndex="-1" Text="New" Width="80px" OnClientClick="javascript: return NewEmail();" />
<asp:Button ID="cmdEmailDelete" runat="server" OnClientClick="javascript: return CheckDelete();"
TabIndex="-1" Text="Delete" Width="80px" />
<asp:Button ID="cmdsave" runat="server" OnClientClick="javascript: return HideEmail();"
TabIndex="-1" Text="Accept" Width="80px" />
<asp:Button ID="cmdEmailQuit" runat="server" OnClientClick="javascript: eo_GetObject('dlgEmail').close(); return false;"
TabIndex="-1" Text="Quit" Width="80px" /></td>
<td style="height: 22px">
</td>
</tr>
<tr>
<td style="height: 15px; width: 10px;">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td style="width: 10px; height: 15px">
</td>
<td>
<eo:Grid ID="grdEmail" runat="server" BackColor="#F0F0F0" BorderColor="#C7D1DF"
BorderWidth="1px" ColumnHeaderAscImage="00050303" ColumnHeaderDescImage="00050304"
ColumnHeaderDividerImage="00050302" EnableKeyboardNavigation="True" FixedColumnCount="1"
Font-Bold="False" Font-Italic="False" Font-Names="Verdana" Font-Overline="False"
Font-Size="9pt" Font-Strikeout="False" Font-Underline="False" FullRowMode="False"
GridLineColor="199, 209, 223" GridLines="Both" Height="128px" ItemHeight="19"
Width="552px" ClientSideOnCellSelected="CellEmailSelected">
<FooterStyle CssText="padding-bottom:4px;padding-left:4px;padding-right:4px;padding-top:4px;" />
<ItemStyles>
<eo:GridItemStyleSet>
<ItemStyle CssText="background-color: white" />
<ItemHoverStyle CssText="background-image: url(00050206); background-repeat: repeat-x" />
<SelectedStyle CssText="background-image: url(00050207); background-repeat: repeat-x" />
<CellStyle CssText="padding-left:8px;padding-top:2px; color:#336699;white-space:nowrap;" />
</eo:GridItemStyleSet>
</ItemStyles>
<ColumnTemplates>
<eo:TextBoxColumn>
<TextBoxStyle CssText="border-bottom-color:#7f9db9;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#7f9db9;border-left-style:solid;border-left-width:1px;border-right-color:#7f9db9;border-right-style:solid;border-right-width:1px;border-top-color:#7f9db9;border-top-style:solid;border-top-width:1px;color:#003399;font-family:Verdana;font-size:8pt;margin-bottom:0px;margin-left:0px;margin-right:0px;margin-top:0px;padding-bottom:1px;padding-left:2px;padding-right:2px;padding-top:2px;" />
<CellStyle CssText="color:#003399;" />
</eo:TextBoxColumn>
<eo:DateTimeColumn>
<DatePicker ControlSkinID="None" DayCellHeight="16" DayCellWidth="19" DayHeaderFormat="FirstLetter"
DisabledDates="" OtherMonthDayVisible="True" SelectedDates="" TitleLeftArrowImageUrl="DefaultSubMenuIconRTL"
TitleRightArrowImageUrl="DefaultSubMenuIcon">
<TodayStyle CssText="font-family: tahoma; font-size: 12px; border-right: #bb5503 1px solid; border-top: #bb5503 1px solid; border-left: #bb5503 1px solid; border-bottom: #bb5503 1px solid" />
<SelectedDayStyle CssText="font-family: tahoma; font-size: 12px; background-color: #fbe694; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<DisabledDayStyle CssText="font-family: tahoma; font-size: 12px; color: gray; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<PickerStyle CssText="border-bottom-color:#7f9db9;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#7f9db9;border-left-style:solid;border-left-width:1px;border-right-color:#7f9db9;border-right-style:solid;border-right-width:1px;border-top-color:#7f9db9;border-top-style:solid;border-top-width:1px;font-family:Courier New;font-size:8pt;margin-bottom:0px;margin-left:0px;margin-right:0px;margin-top:0px;padding-bottom:1px;padding-left:2px;padding-right:2px;padding-top:2px;" />
<CalendarStyle CssText="background-color: white; border-right: #7f9db9 1px solid; padding-right: 4px; border-top: #7f9db9 1px solid; padding-left: 4px; font-size: 9px; padding-bottom: 4px; border-left: #7f9db9 1px solid; padding-top: 4px; border-bottom: #7f9db9 1px solid; font-family: tahoma" />
<TitleArrowStyle CssText="cursor:hand" />
<DayHoverStyle CssText="font-family: tahoma; font-size: 12px; border-right: #fbe694 1px solid; border-top: #fbe694 1px solid; border-left: #fbe694 1px solid; border-bottom: #fbe694 1px solid" />
<MonthStyle CssText="font-family: tahoma; font-size: 12px; margin-left: 14px; cursor: hand; margin-right: 14px" />
<TitleStyle CssText="background-color:#9ebef5;font-family:Tahoma;font-size:12px;padding-bottom:2px;padding-left:6px;padding-right:6px;padding-top:2px;" />
<OtherMonthDayStyle CssText="font-family: tahoma; font-size: 12px; color: gray; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
<DayHeaderStyle CssText="font-family: tahoma; font-size: 12px; border-bottom: #aca899 1px solid" />
<DayStyle CssText="font-family: tahoma; font-size: 12px; border-right: white 1px solid; border-top: white 1px solid; border-left: white 1px solid; border-bottom: white 1px solid" />
</DatePicker>
</eo:DateTimeColumn>
<eo:MaskedEditColumn>
<MaskedEdit ControlSkinID="None" TextBoxStyle-CssText="BORDER-RIGHT: #7f9db9 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7f9db9 1px solid; PADDING-LEFT: 2px; PADDING-BOTTOM: 1px; MARGIN: 0px; BORDER-LEFT: #7f9db9 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #7f9db9 1px solid; font-family:Courier New;font-size:8pt;">
</MaskedEdit>
</eo:MaskedEditColumn>
</ColumnTemplates>
<Columns>
<eo:RowNumberColumn Width="35">
</eo:RowNumberColumn>
<eo:TextBoxColumn DataType="String" HeaderText="Name" Name="NM_RESPONSABLE_PERSONS"
TextBoxMaxLength="50" Width="220">
</eo:TextBoxColumn>
<eo:TextBoxColumn DataType="String" HeaderText="Email" Name="DS_RESPONSABLE_PERSONS_EMAIL"
TextBoxMaxLength="150" Width="280">
</eo:TextBoxColumn>
</Columns>
<ColumnHeaderStyle CssText="background-image:url('00050301');padding-left:8px;padding-top:2px;font-weight: bold;color:white;" />
</eo:Grid>
</td>
<td>
</td>
</tr>
<tr>
<td style="width: 10px; height: 15px">
</td>
<td>
</td>
<td>
</td>
</tr>
</table>
</ContentTemplate>
<ContentStyleActive CssText="padding-right: 4px; padding-left: 4px; font-size: 8pt; padding-bottom: 4px; padding-top: 4px; font-family: tahoma" />
</eo:Dialog>
</div>
</form>
</body>
</html>
Code: Visual Basic.NET
Imports EO.Web
Partial Public Class WebForm2
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not Me.Page.IsPostBack Then
Dim GridRow As EO.Web.GridItem, Ctr As Integer
For Ctr = 1 To 3
GridRow = Me.grdData.CreateItem()
GridRow.Cells(0).Value = Ctr
GridRow.Cells(1).Value = "Unit #" & Ctr.ToString
If Ctr Mod 2 = 0 Then
GridRow.Cells(2).Value = "Person " & Format(Ctr, "00") & "-1;Person " & Format(Ctr, "00") & "-2"
GridRow.Cells(3).Value = "person" & Format(Ctr, "00") & "-1@gmail.com" & _
";person" & Format(Ctr, "00") & "-2@gmail.com"
Else
GridRow.Cells(2).Value = "Person " & Format(Ctr, "00")
GridRow.Cells(3).Value = "person" & Format(Ctr, "00") & "@gmail.com"
End If
Me.grdData.Items.Add(GridRow)
Next
End If
End Sub
End Class
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,071
|
This is normal. The Grid does not know it has focus even if the textbox has focus. Try to call this function to explicitly give focus to the Grid: http://doc.essentialobjects.com/library/1/jsdoc.public.control.focus.aspxCamarate wrote:The second is that when have more than one row in the Grid control, the Tab key moves the cursor sequentially through all the cells in order Top-Down and Left-Right. But, when the cursor reachs the last cell, the cursor moves only by cells in the last row. This is a bug. The cursor should go back to the first row. We will fix it and provide an update build to you.
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,071
|
Hi,
We have posted a new build that should address the tab key issue. Now if you press tab key when the focus is on the last cell of the last row, the focus would move to the first cell of the first row. Please see your private message for the download location.
Thanks!
|
|
Rank: Advanced Member
Groups: Member
Joined: 9/2/2010
Posts: 120
|
Hi,
Thank you so much.
Regards, Marcelo Camarate
|
|