Gridview вычисляет столбцы во время выполнения

Question

У меня есть сеточное представление с тремя столбцами и пятью строками с полями шаблона элемента текстового элемента для вставки данных во время выполнения в БД с использованием Gridview. И я хочу провести некоторые вычисления с этим сеточным представлением, например добавление столбцов Col1 и Col2 в 3-й столбец, а также Сумма Col1 в нижнем колонтитуле. А также я хочу сделать вычисления как изменения текста в текстовых полях без обратной передачи или обновления страницы. Скажите, пожалуйста, как я могу это сделать. У меня есть следующий код, чтобы сделать вид сетки

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" ShowFooter="True">
            <Columns>
                <asp:TemplateField HeaderText="One">
                    <FooterTemplate>
                        <asp:Label ID="lblOne_tot" runat="server"></asp:Label>
                    </FooterTemplate>
                    <ItemTemplate>
                        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Two">
                    <FooterTemplate>
                        <asp:Label ID="lblTwo_tot" runat="server"></asp:Label>
                    </FooterTemplate>
                    <ItemTemplate>
                        <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Total">
                    <ItemTemplate>
                        <asp:Label ID="lblTotal" runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>

Answer 1

Добавьте событие «onChange» в каждое из ваших текстовых полей, которое вызывает функцию JavaScript. Внутри этой функции выполняйте свои вычисления и обновляйте правильную метку / div / span / и т. Д.

<script language="javascript">
function doCalculations1(whichControl)
{
   //do calculations on whichControl.value
   var outputValue = whichControl.value * 5;
   //replace lblOne_tot with clientID after page is built
   document.getElementById("lblOne_tot").value = outputValue;
}
</script>

<asp:TextBox id="TextBox1" runat="server" onchange="javascript:doCalculations1(this);" />