Come calcolare il valore di una cella RadGrid sul lato client?
-
06-09-2019 - |
Domanda
Ho Telerik RadGrid che è in modalità di modifica. Ogni cella contiene NumericTextBox. E 'possibile calcolare una cella sulla base di altre celle nella stessa riga (sul lato client). Per esempio, se ho una fila che contiene le cellule come il prezzo e la voce che voglio su ogni cambiamento per calcolare il prezzo totale, ma sul lato client, senza andare a lato server. Questo è possibile con RadGrid?
Soluzione
Grazie per tutte le vostre risposte, ma ho trovato la soluzione qui a Telerik forum. Mi limiterò a incollo qui la soluzione nel caso in cui qualcuno si blocca sulla stessa questione.
ASPX:
<Columns>
<rad:GridTemplateColumn UniqueName="Price" HeaderText="Price">
<EditItemTemplate>
<radI:RadNumericTextBox ID="txtPrice" runat="server">
</radI:RadNumericTextBox>
</EditItemTemplate>
</rad:GridTemplateColumn>
<rad:GridTemplateColumn UniqueName="Quantity" HeaderText=" Number of Items">
<EditItemTemplate>
<radI:RadNumericTextBox ID="txtQuantity" runat="server">
</radI:RadNumericTextBox>
</EditItemTemplate>
</rad:GridTemplateColumn>
<rad:GridTemplateColumn UniqueName="TotalAmount" HeaderText="Total">
<EditItemTemplate>
<radI:RadNumericTextBox ID="txtTotalAmount" runat="server">
</radI:RadNumericTextBox>
</EditItemTemplate>
</rad:GridTemplateColumn>
</Columns>
C #
protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
{
if (e.Item is GridDataItem && e.Item.IsInEditMode)
{
GridDataItem item = (GridDataItem)e.Item;
RadNumericTextBox txtPrice= item.FindControl("txtPrice") as RadNumericTextBox; // Get the textbox for column Price
RadNumericTextBox txtQuantity= item.FindControl("txtQuantity") as RadNumericTextBox; // Get the textbox for column Quantity
RadNumericTextBox txtTotalAmount= item.FindControl("txtTotalAmount") as RadNumericTextBox; // Get the textbox for column "TotalAmount", if it is template as shown in aspx
txtPrice.Attributes.Add("onFocusout", "return calculate('" + txtPrice.ClientID + "','" + txtQuantity.ClientID + "','" + txtTotalAmount.ClientID + "')");
txtQuantity.Attributes.Add("onFocusout", "return calculate('" + txtPrice.ClientID + "','" + txtQuantity.ClientID + "','" + txtTotalAmount.ClientID + "')");
txtTotalAmount.Attributes.Add("onfocus", "return calculate('" + txtPrice.ClientID + "','" + txtQuantity.ClientID + "','" + txtTotalAmount.ClientID + "')");
}
}
JavaScript:
<script type="text/javascript">
function calculate(price, quantity, totalAmount)
{
var text1 = $find(price); //I used Asp.net Ajax find method
var text2 = $find(quantity);
var text3 = $find(totalAmount);
var total = text1.GetValue() * text2.GetValue();
text3.SetValue(total);
}
</script>
Altri suggerimenti
E 'possibile, a condizione che hai i dati attraverso lato client di associazione nonché, molto probabilmente tramite AJAX. Se è così, si dovrebbe essere in grado di ottenere tutti i valori dalla proprietà DataSource della griglia. Se si associa il lato server dei dati diventa più difficile perché attualmente la griglia non costruisce l'origine dati lato client in questo caso.
Controlla la demo sul sito Telerik da RadGrid -> sezione scenari di applicazione che utilizza le caselle di testo numeriche e illustra ciò che siete alla ricerca di, amico
.Dick
Perché ogni articolo è in una riga della tabella si potrebbe usare javascript per trovare l'elemento principale e poi scorrere tutti gli ingressi per trovare quelli che stai cercando? Se avete intenzione di utilizzare jQuery questo dovrebbe essere possibile e se si voleva distinguere le caselle di testo facilmente si potrebbe applicare un CssClass ad ogni TextBox?