|
Rank: Advanced Member Groups: Member
Joined: 2/27/2010 Posts: 69
|
I'm doing some client-side validation and formatting on cells to show currency and percentage. When posting back, I have no problem with adding these, but they will not update. The cel.modified returns TRUE, but the value is always nothing if I've formatted the cell in javascript on the client side.
I've tried this using both a textboxcolumn and custom column with an html textbox. No luck. The cel.value always returns nothing when formatted on the client side. It works fine if I just leave it alone and don't use any client-side formatting -- and this is when updating only! Again, my formatting returns valid data in the cel.value when inserting it.
The client wants me to format these fields in real time, so please help.
Thanks.
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,194
|
Hi,
The cell should give you whatever value you pass to it. If you pass nothing, then it will have nothing. For example, in a CustomColumn, if your end_end handler returns nothing, then the cell will have no value. The net effect would be like you "clear" the cell value.
So I would recommend you to check where in your code you actually give the cell a value. If that does not turn up anything, please try to post a small sample code and we will take a look.
Thanks!
|
|
Rank: Advanced Member Groups: Member
Joined: 2/27/2010 Posts: 69
|
Thanks for the suggestion, but yes... I am returning a value from the javascript. I've pasted sample code below. I'm trying to change the value for the FromAmount cell. Please remember that the insert section of this code behind works just fine. It returns the proper value for cel.value. The Update section sees the cel.modified as true, but returns 'nothing' for the cel.value. Now, if I don't format the cell with the ClientSideEndEdit function, it too works just fine. It appears that formatting the cell messes with the update, but not the insert. Puzzled.
Code: HTML/ASPX
<%@ Register assembly="EO.Web, Version=9.0.15.2, Culture=neutral, PublicKeyToken=e92353a6bf73fffc" 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></title>
<script type="text/javascript">
function grid_itemcommand_handler(grid, itemIndex, colIndex, commandName) {
// alert("commandName: " + commandName);
if (commandName == "DeleteScale") {
var c = window.confirm("Are you sure you want to delete this row?");
if (c) grid.deleteItem(itemIndex);
return (c);
}
}
function formatCurrency(num) {
num = num.toString().replace(/\$|\,/g, '');
if (isNaN(num))
num = "0";
sign = (num == (num = Math.abs(num)));
num = Math.floor(num * 100 + 0.50000000001);
cents = num % 100;
num = Math.floor(num / 100).toString();
if (cents < 10)
cents = "0" + cents;
for (var i = 0; i < Math.floor((num.length - (1 + i)) / 3); i++)
num = num.substring(0, num.length - (4 * i + 3)) + ',' +
num.substring(num.length - (4 * i + 3));
return (((sign) ? '' : '-') + '$' + num + '.' + cents);
}
function onEnd_txtFromAmount(cell) {
var txt = document.getElementById("txtFromAmount");
var v = txt.value;
if (v == null) v = 0;
var retval = formatCurrency(v);
return (retval);
}
function onBegin_txtFromAmount(cell) {
var v = cell.getValue();
if (v == null)
v = 0;
var txt = document.getElementById("txtFromAmount");
txt.value = formatCurrency(v);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div style="height:252px; width:870px; border-bottom-style:solid; border-width:thin">
<table style="width:100%;">
<tr>
<td>
<eo:Grid ID="GridSlidingScale" runat="server" BorderColor="#828790" BorderWidth="1px"
ColumnHeaderAscImage="00050204" ColumnHeaderDescImage="00050205"
ColumnHeaderDividerImage="00050203" ColumnHeaderHeight="24"
DataSourceID="SqlData_SlidingScales" FixedColumnCount="1" Font-Bold="False"
Font-Italic="False" Font-Names="Tahoma" Font-Overline="False"
Font-Size="8.75pt" Font-Strikeout="False" Font-Underline="False"
GridLineColor="240, 240, 240" GridLines="Both"
Height="179px" ItemHeight="19" KeyField="SlidingScaleID" Width="792px"
AllowNewItem="True" EnableKeyboardNavigation="True"
ClientSideOnItemCommand="grid_itemcommand_handler"
>
<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;white-space:nowrap;" />
</eo:GridItemStyleSet>
<eo:GridItemStyleSet StyleSetID="CurrencyStyle">
<ItemStyle CssText="background-color: white; text-align: right" />
</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" />
</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>
<ColumnHeaderHoverStyle CssText="background-image:url('00050202');padding-left:8px;padding-top:4px;" />
<Columns>
<eo:EditCommandColumn>
</eo:EditCommandColumn>
<eo:StaticColumn DataField="GroupID" Visible="False" Width="10">
</eo:StaticColumn>
<eo:TextBoxColumn DataField="Tier" HeaderText="Tier" Width="40">
</eo:TextBoxColumn>
<eo:CustomColumn DataField="FromAmount" DataFormat="{0:c}"
HeaderText="From Amount"
ClientSideBeginEdit="onBegin_txtFromAmount"
ClientSideEndEdit="onEnd_txtFromAmount">
<EditorTemplate>
<input id="txtFromAmount" type="text" />
</EditorTemplate>
</eo:CustomColumn>
<eo:ButtonColumn ButtonText="Delete" CommandName="DeleteScale" HeaderText=""
Width="80">
</eo:ButtonColumn>
</Columns>
<ColumnHeaderStyle CssText="background-image:url('00050201');padding-left:8px;padding-top:4px;" />
</eo:Grid>
</td>
<td style="vertical-align: top">
<asp:Label ID="Label51" runat="server" Font-Names="Verdana"
style="COLOR:#000000; FONT-SIZE:8pt;" Height="53px">Edit/Add/Delete<br />items on the grid<br />then click SAVE below.</asp:Label>
<br />
<br />
<asp:Button ID="btnSaveSlidingScale" runat="server" Text="SAVE TO SERVER" Height="27px"
Width="134px" />
<br />
<br />
<asp:Label ID="Label52" runat="server" Font-Names="Verdana"
style="COLOR:#000000; FONT-SIZE:8pt;" Width="127px" Height="44px"
Font-Italic="True">NOTHING changes on server until you click SAVE. TO SERVER</asp:Label>
<br />
</td>
<td>
</td>
</tr>
</table>
<asp:Label id="xOutput"
style="Z-INDEX: 110; color:Red; FONT-SIZE:8pt; width: 880px; height: 74px;"
runat="server"></asp:Label>
<br />
<br />
</div>
<asp:SqlDataSource ID="SqlData_SlidingScales" runat="server"
ConnectionString="<%$ ConnectionStrings:ADPconnection %>"
ProviderName="<%$ ConnectionStrings:ADPconnection.ProviderName %>"
SelectCommand="SELECT * FROM [WebAppView_tblSlidingScales] WHERE ([GroupID] = ?)">
<SelectParameters>
<asp:Parameter DefaultValue="398" Name="GroupID" Type="Int32" />
</SelectParameters>
</asp:SqlDataSource>
<br />
<br />
</form>
</body>
</html>
-- CODE BEHIND HERE ----------------------------------
Code: Visual Basic.NET
Private Shared databasespec As String = ""
Protected Sub btnSaveSlidingScale_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnSaveSlidingScale.Click
databasespec = ConfigurationManager.ConnectionStrings("ADPconnection").ToString 'asp .net 2.0
Dim itm As EO.Web.GridItem, cel As EO.Web.GridCell
Dim subsql As String = String.Empty, sql As String = String.Empty
Try
'modified
For Each itm In GridSlidingScale.ChangedItems
subsql = "Update tblSlidingScales Set "
sql = subsql
For Each cel In itm.Cells
If cel.Modified Then
If Not cel.Value Is Nothing Then
If sql <> subsql Then sql = sql & ", "
Dim tstval As String = "NULL"
Dim dataCell As String = cel.Column.DataField
If Nz(cel.Value.ToString, "") <> "" Then tstval = cel.Value
If cel.Column.DataType = 5 And (Not IsDate(tstval) Or tstval = "12:00:00 AM") Then tstval = "NULL"
If cel.Column.DataField = "PercentDisplay" Then
dataCell = "Percentage"
Dim pVal As Double = CDbl(Trim(strValue(tstval, True)))
tstval = pVal.ToString
End If
sql = sql & dataCell & "=" & strValue(tstval)
End If
End If
Next
If sql <> subsql Then
' execute the update query here
'System.Diagnostics.Debug.WriteLine(sql)
sql = sql & " WHERE ([SlidingScaleID]=" & itm.Key & ");"
Call ExecuteSQL(sql)
End If
Next
'added
Dim tlTest As Double = 0
For Each itm In GridSlidingScale.AddedItems
subsql = "INSERT Into tblSlidingScales (GroupID"
sql = "Values (" & Session("CurrentGroupID")
For Each cel In itm.Cells
If Not cel.Value Is Nothing Then
Dim tstval As String = "NULL"
Dim dataCell As String = cel.Column.DataField
If Nz(cel.Value.ToString, "") <> "" Then tstval = cel.Value
If cel.Column.DataType = 5 And (Not IsDate(tstval) Or tstval = "12:00:00 AM") Then tstval = "NULL"
If dataCell = "FromAmount" Or dataCell = "ThroughAmount" Then
tlTest = tlTest + CSng(Nz(strValue(cel.Value), 0))
End If
If cel.Column.DataField = "PercentDisplay" Then
dataCell = "Percentage"
Dim pVal As Double = CDbl(Trim(strValue(tstval, True)))
tstval = pVal.ToString
End If
subsql = subsql & ", " & dataCell
sql = sql & ", " & strValue(tstval)
End If
Next
subsql = subsql & ") "
sql = subsql & sql & ");"
If tlTest <> 0 Then Call ExecuteSQL(sql)
Next
For Each itm In GridSlidingScale.DeletedItems
sql = "DELETE From tblSlidingScales WHERE ([SlidingScaleID]=" & itm.Key.ToString & ");"
Call ExecuteSQL(sql)
Next
SqlData_SlidingScales.SelectCommand = "SELECT * FROM [WebAppView_tblSlidingScales] WHERE ([GroupID]=" & Session("CurrentGroupID") & ");"
SqlData_SlidingScales.DataBind()
GridSlidingScale.DataBind()
Catch ex As Exception
Call DisplayErrorMessage(xOutput, 23, ex.Message, sql)
End Try
End Sub
Sub ExecuteSQL(ByVal strSQL As String)
Try
Dim cn As OleDbConnection, cmd As OleDbCommand
cn = New OleDbConnection(databasespec)
cn.Open()
cmd = New OleDbCommand(strSQL, cn)
cmd.ExecuteNonQuery()
cn.Close()
Catch ex As Exception
Call DisplayErrorMessage(xOutput, 1, ex.Message, strSQL)
End Try
End Sub
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,194
|
Hi,
We are not able to run your code as is because we do not have your database. Once we remove the data source it runs and work fine. So the Grid appears to be working fine. If you still believe it has to do with the Grid, you can try to isolate the problem into a test page that runs independently so that we can use that to reproduce the problem. As soon as we can see the problem, we should be able to tell you what's wrong.
Thanks
|
|
Rank: Advanced Member Groups: Member
Joined: 2/27/2010 Posts: 69
|
Thanks so much for taking a look at this. I appreciate your feedback.
I too am able to see the updates when I disconnect the datasource. I can insert data, then come back, edit and re-post formatted changes, and your control works just fine.
But I simply cannot get the cel.value from a cell that's connected to a datasource and had its formatting revised via javascript on the client. The cel.value returns 'nothing'.
I've worked with this for several hours; tried it with the grid bound to both a sqlDataSource and a datareader. It just doesn't work.
|
|
Rank: Advanced Member Groups: Member
Joined: 2/27/2010 Posts: 69
|
Solution Found!
I have discovered that when reformatting currency or percentage data on the client side, you must cast the data types to varchar in the datasource view. I could not get the grid control to see the changed/formatted value when these were sent as money or float in the datasource, but when I cast these as varchars, it now sees the updated values correctly. Then I simply strip out the formatting in the SQL statement that updates the actual field on server.
Maybe this will help someone else that comes across this.
Thanks for your time.
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,194
|
Thanks for the update. This makes sense.
|
|