0

通常の GridView 行の合計計算では、このスクリプトはうまく機能しますが、GridView フッター行から新しい行を追加すると、合計金額が機能しません。これは、ポストバック後にこのスクリプトが機能しないことを意味します。どうすればこれを解決できますか?

ASP.NET GridView コード

 <asp:UpdatePanel ID="UpdatePanel4" runat="server">
        <ContentTemplate>
            <asp:GridView ID="grdItems" runat="server" AutoGenerateColumns="False" CssClass="GridViewStyle"
                GridLines="None" ShowFooter="True" EmptyDataText="There is no data to show."
                Width="100%" OnRowCommand="grdItems_RowCommand" OnRowDataBound="grdItems_RowDataBound">
                <RowStyle CssClass="RowStyle" />
                <PagerStyle CssClass="PagerStyle" />
                <HeaderStyle CssClass="HeaderStyle" />
                <EditRowStyle CssClass="EditRowStyle" />
                <AlternatingRowStyle CssClass="AltRowStyle" />
                <FooterStyle CssClass="FooterStyle" />
                <Columns>
                    <asp:TemplateField HeaderText="ID" HeaderStyle-Width="10px">
                        <ItemTemplate>
                            <asp:Label ID="lblShowID" runat="server" Text='<%#Container.DataItemIndex+1 %>' />
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Item">
                        <ItemTemplate>
                            <asp:TextBox ID="txtItem" runat="server" TextMode="MultiLine" Text='<%# Bind("Item") %>'
                                Width="180px" CssClass="text-long" Rows="2" />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:TextBox ID="txtFItem" runat="server" TextMode="MultiLine" Width="180px" Rows="2" />
                            <asp:RequiredFieldValidator ID="txtFItem_rfv" runat="server" ControlToValidate="txtFItem"
                                ErrorMessage="Please enter Item Name!" ValidationGroup="Add" Display="None" />
                            <asp:ValidatorCalloutExtender ID="txtFItem_vce" runat="server" TargetControlID="txtFItem_rfv"
                                CssClass="customCalloutStyle" WarningIconImageUrl="~/App_Themes/Img/001_111.png"
                                CloseImageUrl="~/App_Themes/Img/001_051.png" />
                        </FooterTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Qty">
                        <ItemTemplate>
                            <asp:TextBox ID="txtCalcQuantity" runat="server" Text='<%# Bind("Quantity") %>' Width="30px" />
                            <asp:RegularExpressionValidator ID="txtCalcQuantity_rev" runat="server" ControlToValidate="txtCalcQuantity"
                                ValidationGroup="Remove" Display="None" ErrorMessage="Please enter valid format 99.999!"
                                ValidationExpression="[0-9]*" />
                            <asp:ValidatorCalloutExtender ID="txtCalcQuantity_vce" runat="server" TargetControlID="txtCalcQuantity_rev" />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:TextBox ID="txtCalcQuantity" runat="server" Width="30px" />
                            <asp:RequiredFieldValidator ID="txtCalcQuantity_rfv" runat="server" ControlToValidate="txtCalcQuantity"
                                ErrorMessage="Please enter Quantity!" ValidationGroup="Add" Display="None" />
                            <asp:ValidatorCalloutExtender ID="txtCalcQuantity_vce1" runat="server" TargetControlID="txtCalcQuantity_rfv"
                                CssClass="customCalloutStyle" WarningIconImageUrl="~/App_Themes/Img/001_111.png"
                                CloseImageUrl="~/App_Themes/Img/001_051.png" />
                            <asp:RegularExpressionValidator ID="txtCalcQuantity_rev" runat="server" ControlToValidate="txtCalcQuantity"
                                ValidationGroup="Add" Display="None" ErrorMessage="Please enter valid format 99.999!"
                                ValidationExpression="[0-9]*" />
                            <asp:ValidatorCalloutExtender ID="txtCalcQuantity_vce2" runat="server" TargetControlID="txtCalcQuantity_rev"
                                CssClass="customCalloutStyle" WarningIconImageUrl="~/App_Themes/Img/001_111.png"
                                CloseImageUrl="~/App_Themes/Img/001_051.png" />
                        </FooterTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="UOM">
                        <ItemTemplate>
                            <asp:TextBox ID="txtUnit" runat="server" Text='<%# Bind("Unit") %>' Width="50px" />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:TextBox ID="txtUnit" runat="server" Width="50px" />
                        </FooterTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Cur">
                        <ItemTemplate>
                            <asp:Label ID="lblCurrency" runat="server" Width="25px" />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:Label ID="lblCurrency" runat="server" Width="25px" />
                        </FooterTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Unit Price (Budget)">
                        <ItemTemplate>
                            <asp:TextBox ID="txtCalcUnitPrice" runat="server" Text='<%# Bind("UnitPrice", "{0:N}") %>'
                                Width="90px" />
                            <asp:RegularExpressionValidator ID="txtCalcUnitPrice_rev" runat="server" ControlToValidate="txtCalcUnitPrice"
                                ValidationGroup="Remove" Display="None" ErrorMessage="Please enter valid format 99.999!"
                                ValidationExpression="^\-?\(?\$?\s*\-?\s*\(?(((\d{1,3}((\,\d{3})*|\d*))?(\.\d{1,4})?)|((\d{1,3}((\,\d{3})*|\d*))(\.\d{0,4})?))\)?$" />
                            <asp:ValidatorCalloutExtender ID="txtCalcUnitPrice_vce" runat="server" TargetControlID="txtCalcUnitPrice_rev" />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:TextBox ID="txtCalcUnitPrice" runat="server" Width="90px" />
                            <asp:RequiredFieldValidator ID="txtCalcUnitPrice_rfv" runat="server" ControlToValidate="txtCalcUnitPrice"
                                ErrorMessage="Please enter Quantity!" ValidationGroup="Add" Display="None" />
                            <asp:ValidatorCalloutExtender ID="txtCalcUnitPrice_vce1" runat="server" TargetControlID="txtCalcUnitPrice_rfv"
                                CssClass="customCalloutStyle" WarningIconImageUrl="~/App_Themes/Img/001_111.png"
                                CloseImageUrl="~/App_Themes/Img/001_051.png" />
                            <asp:RegularExpressionValidator ID="txtCalcUnitPrice_rev" runat="server" ControlToValidate="txtCalcUnitPrice"
                                ValidationGroup="Add" Display="None" ErrorMessage="Please enter valid format 99.999!"
                                ValidationExpression="^\-?\(?\$?\s*\-?\s*\(?(((\d{1,3}((\,\d{3})*|\d*))?(\.\d{1,4})?)|((\d{1,3}((\,\d{3})*|\d*))(\.\d{0,4})?))\)?$" />
                            <asp:ValidatorCalloutExtender ID="txtCalcUnitPrice_vce2" runat="server" TargetControlID="txtCalcUnitPrice_rev"
                                CssClass="customCalloutStyle" WarningIconImageUrl="~/App_Themes/Img/001_111.png"
                                CloseImageUrl="~/App_Themes/Img/001_051.png" />
                        </FooterTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Amount (Budget)">
                        <ItemTemplate>
                            <asp:Label ID="lblAmount" runat="server" Text='<%# Bind("Amount", "{0:N}") %>' Width="95px" />
                            <asp:HiddenField ID="hfAmount" runat="server" Value='<%# Eval("Amount").ToString()%>' />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:Label ID="lblAmount" runat="server" Width="95px" />
                            <asp:HiddenField ID="hfAmount" runat="server" />
                        </FooterTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <HeaderTemplate>
                            <span class="red">#</span>Unit Price (Actual)</HeaderTemplate>
                        <ItemTemplate>
                            <asp:TextBox ID="txtCalcActUnitPrice" runat="server" Text='<%# Bind("ActUnitPrice", "{0:N}") %>'
                                Width="90px" />
                            <asp:RegularExpressionValidator ID="txtCalcActUnitPrice_rev" runat="server" ControlToValidate="txtCalcActUnitPrice"
                                ValidationGroup="Purchaser" Display="None" ErrorMessage="Please enter valid format 99.999!"
                                ValidationExpression="^\-?\(?\$?\s*\-?\s*\(?(((\d{1,3}((\,\d{3})*|\d*))?(\.\d{1,4})?)|((\d{1,3}((\,\d{3})*|\d*))(\.\d{0,4})?))\)?$" />
                            <asp:ValidatorCalloutExtender ID="txtCalcActUnitPrice_vce" runat="server" TargetControlID="txtCalcActUnitPrice_rev"
                                CssClass="customCalloutStyle" WarningIconImageUrl="~/App_Themes/Img/001_111.png"
                                CloseImageUrl="~/App_Themes/Img/001_051.png" />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:TextBox ID="txtCalcActUnitPrice" runat="server" Width="90px" />
                            <asp:RegularExpressionValidator ID="txtCalcActUnitPrice_rev" runat="server" ControlToValidate="txtCalcActUnitPrice"
                                ValidationGroup="Remove" Display="None" ErrorMessage="Please enter valid format 99.999!"
                                ValidationExpression="^\-?\(?\$?\s*\-?\s*\(?(((\d{1,3}((\,\d{3})*|\d*))?(\.\d{1,4})?)|((\d{1,3}((\,\d{3})*|\d*))(\.\d{0,4})?))\)?$" />
                            <asp:ValidatorCalloutExtender ID="txtCalcActUnitPrice_vce" runat="server" TargetControlID="txtCalcActUnitPrice_rev"
                                CssClass="customCalloutStyle" WarningIconImageUrl="~/App_Themes/Img/001_111.png"
                                CloseImageUrl="~/App_Themes/Img/001_051.png" />
                        </FooterTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <HeaderTemplate>
                            <span class="red">#</span>Amount (Actual)</HeaderTemplate>
                        <ItemTemplate>
                            <asp:Label ID="lblActAmount" runat="server" Text='<%# Eval("ActAmount").ToString()%>'
                                Width="95px" />
                            <asp:HiddenField ID="hfActAmount" runat="server" Value='<%# Eval("ActAmount").ToString()%>' />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:Label ID="lblActAmount" runat="server" Width="95px" />
                            <asp:HiddenField ID="hfActAmount" runat="server" />
                        </FooterTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <HeaderTemplate>
                            <span class="red">#</span>Type</HeaderTemplate>
                        <ItemTemplate>
                            <asp:DropDownList ID="ddlType" runat="server" CssClass="text-small" />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:DropDownList ID="ddlType" runat="server" CssClass="text-small" />
                        </FooterTemplate>
                    </asp:TemplateField>                        
                    <asp:TemplateField>
                        <HeaderTemplate>
                            <span class="red">#</span>DO No.</HeaderTemplate>
                        <ItemTemplate>
                            <asp:TextBox ID="txtDO" runat="server" Width="90px" Text='<%# Bind("DONo") %>' />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:TextBox ID="txtFDO" runat="server" Width="90px" />
                        </FooterTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <HeaderTemplate>
                            <span class="red">#</span>Date of DO</HeaderTemplate>
                        <ItemTemplate>
                            <asp:TextBox ID="txtDODate" runat="server" Width="90px" Text='<%# Bind("DODate", "{0:dd-MMM-yyyy}") %>' />
                            <asp:CalendarExtender ID="txtDODate_ce" runat="server" TargetControlID="txtDODate"
                                PopupPosition="Right" Animated="true" Format="dd-MMM-yyyy" />
                            <asp:MaskedEditExtender ID="txtDODate_me" runat="server" ClearMaskOnLostFocus="False"
                                CultureName="en-GB" Mask="99-LLL-9999" TargetControlID="txtDODate" UserDateFormat="DayMonthYear" />
                            <asp:RegularExpressionValidator ID="txtDODate_rev" runat="server" ControlToValidate="txtDODate"
                                Display="None" ErrorMessage="Please enter valid date format dd-MMM-yyyy" ValidationGroup="None"
                                ValidationExpression="^(0?[1-9]|[12][0-9]|3[01])-(Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec)-(19|20)\d\d$" />
                            <asp:ValidatorCalloutExtender ID="txtDODate_vce" runat="server" TargetControlID="txtDODate_rev"
                                CssClass="customCalloutStyle" WarningIconImageUrl="~/App_Themes/Img/001_111.png"
                                CloseImageUrl="~/App_Themes/Img/001_051.png" />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:TextBox ID="txtDODate" runat="server" Width="90px" />
                            <asp:CalendarExtender ID="txtDODate_ce" runat="server" TargetControlID="txtDODate"
                                PopupPosition="Right" Animated="true" Format="dd-MMM-yyyy" />
                            <asp:MaskedEditExtender ID="txtDODate_me" runat="server" ClearMaskOnLostFocus="False"
                                CultureName="en-GB" Mask="99-LLL-9999" TargetControlID="txtDODate" UserDateFormat="DayMonthYear" />
                            <asp:RegularExpressionValidator ID="txtDODate_rev" runat="server" ControlToValidate="txtDODate"
                                Display="None" ErrorMessage="Please enter valid date format dd-MMM-yyyy" ValidationGroup="None"
                                ValidationExpression="^(0?[1-9]|[12][0-9]|3[01])-(Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec)-(19|20)\d\d$" />
                            <asp:ValidatorCalloutExtender ID="txtDODate_vce" runat="server" TargetControlID="txtDODate_rev"
                                CssClass="customCalloutStyle" WarningIconImageUrl="~/App_Themes/Img/001_111.png"
                                CloseImageUrl="~/App_Themes/Img/001_051.png" />
                        </FooterTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField ItemStyle-HorizontalAlign="Center" FooterStyle-HorizontalAlign="Center"
                        FooterStyle-CssClass="action" ItemStyle-CssClass="action">
                        <ItemTemplate>
                            <asp:LinkButton ID="btnRemove" runat="server" CommandName="Select" CssClass="delete"
                                Text="Del" OnClientClick="return confirm('Are you sure you want to delete this?');" />
                        </ItemTemplate>
                        <FooterTemplate>
                            <asp:LinkButton ID="btnAdd" runat="server" ValidationGroup="Add" CommandName="Insert"
                                CssClass="add" Text="Add" />
                            <%--OnClientClick="return confirm('Are you sure you want to submit this?');"--%></FooterTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
            <asp:SqlDataSource ID="Supplier_DS" runat="server" SelectCommand="Select '' as ID, '' as Name 
                Union Select ID, Name From tbl_Supplier Group By ID, Name Order By Name" ConnectionString="<%$ ConnectionStrings:RFP_CS %>" />
            <table style="float: right; width: 100%; text-align: right;">
                <tbody>
                    <tr>
                        <td style="color: Red; text-align: right; width: 200px">
                            <span class="red">#</span>Discount (Actual)
                        </td>
                        <td style="width: 110px">
                            <%--<asp:TextBox ID="txtDiscount" runat="server" CssClass="text-medium" Style="text-align: right;
                                color: Red" AutoPostBack="true" OnTextChanged="txtDiscount_TextChanged" Width="105px" />
                            <asp:RegularExpressionValidator ID="txtDiscount_rev" runat="server" ControlToValidate="txtDiscount"
                                ValidationGroup="submit" Display="None" ErrorMessage="Please enter valid format 99.999!"
                                ValidationExpression="^\$?(\d{1,3},?(\d{3},?)*\d{3}(.\d{0,3})?|\d{1,3}(.\d{2})?)$" />
                            <asp:ValidatorCalloutExtender ID="txtDiscount_vce" runat="server" TargetControlID="txtDiscount_rev" />--%>
                        </td>
                        <td style="width: 310px; text-align: left;">
                            <asp:TextBox ID="txtActDiscount" runat="server" CssClass="text-medium" Style="text-align: right;
                                color: Red" AutoPostBack="true" OnTextChanged="txtActDiscount_TextChanged" Width="105px" />
                            <asp:RegularExpressionValidator ID="txtActDiscount_rev" runat="server" ControlToValidate="txtActDiscount"
                                ValidationGroup="submit" Display="None" ErrorMessage="Please enter valid format 99.999!"
                                ValidationExpression="^\$?(\d{1,3},?(\d{3},?)*\d{3}(.\d{0,3})?|\d{1,3}(.\d{2})?)$" />
                            <asp:ValidatorCalloutExtender ID="txtActDiscount_vce" runat="server" TargetControlID="txtActDiscount_rev" />
                        </td>
                    </tr>
                    <tr>
                        <td style="width: 290px">
                            Total
                        </td>
                        <td style="font-weight: bold; width: 110px;">
                            <asp:Label ID="lblTotal" runat="server" CssClass="text-medium" Width="110px" />
                        </td>
                        <td style="font-weight: bold; width: 310px; text-align: left;">
                            <asp:Label ID="lblActTotal" runat="server" CssClass="text-medium" Width="110px" Style="text-align: right" />
                            <asp:HiddenField ID="hfActTotal" runat="server" />
                        </td>
                    </tr>
                </tbody>
            </table>
        </ContentTemplate>
    </asp:UpdatePanel>

JQuery GridView 計算

// For GridView Calculation
$("[id*=grdItems]input[type=text][id*=txtCalc]").live("keyup", function(e) {
    var quantity = $(e.target).closest('tr').find("input[type=text][id*=txtCalcQuantity]").val();
    var price = $(this).closest('tr').find("input[type=text][id*=txtCalcUnitPrice]").val().replace(/,/g, '');
    var actprice = $(this).closest('tr').find("input[type=text][id*=txtCalcActUnitPrice]").val().replace(/,/g, '');

    var total = parseFloat(price) * parseInt(quantity);
    var acttotal = parseFloat(actprice) * parseInt(quantity);


    if (isNaN(total)) total = 0;
    $(e.target).closest('tr').find("[id*=lblAmount]").text(total.toFixed(2));
    $(e.target).closest('tr').find("[id*=hfAmount]").val(total);

    if (isNaN(acttotal)) acttotal = 0;
    $(e.target).closest('tr').find("[id*=lblActAmount]").text(acttotal.toFixed(2));
    $(e.target).closest('tr').find("[id*=hfActAmount]").val(acttotal);

    GrossTotal();
    GrossActTotal();
});    

var gross;
function GrossTotal() {
    gross = 0;
    $("[id*=grdItems][id*=hfAmount]").each(function(index, val) {

        var value = parseFloat($(val).val().replace(/,/g, ''));
        if (isNaN(value)) value = 0;
        gross = gross + value;
    });
    $("[id*=lblTotal]").text(gross.toFixed(2));

}

var actgross;
function GrossActTotal() {
    actgross = 0;
    $("[id*=grdItems][id*=lblActAmount]").each(function(index, actitem) {

        var value = parseFloat($(actitem).text().replace(/,/g, ''));
        if (isNaN(value)) value = 0;
        actgross = actgross + value;
    });

    var discount = parseFloat($("[id*=txtActDiscount]").text());
    if (isNaN(discount)) discount = 0;
    actgross = actgross - discount;

    $("[id*=lblActTotal]").text(actgross.toFixed(2));
    $("[id*=hfActTotal]").val(actgross);

}
4

2 に答える 2

1

UpdatePanel を使用する場合、ポストバック後に DOM (html と要素の構造体) が変更され、設定した JavaScript が再度初期化される必要があります。このため、UpdatePanel はこの JavaScript 機能を提供します。

var prm = Sys.WebForms.PageRequestManager.getInstance();    
prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);

function InitializeRequest(sender, args) {      

}

function EndRequest(sender, args) {
}

EndRequest で、JavaScript を再初期化する必要があります。あなたの最終的なJavaScriptは

    function InitCalculus()
    {
    // For GridView Calculation
    $("[id*=grdItems]input[type=text][id*=txtCalc]").live("keyup", function(e) {
        var quantity = $(e.target).closest('tr').find("input[type=text][id*=txtCalcQuantity]").val();
        var price = $(this).closest('tr').find("input[type=text][id*=txtCalcUnitPrice]").val().replace(/,/g, '');
        var actprice = $(this).closest('tr').find("input[type=text][id*=txtCalcActUnitPrice]").val().replace(/,/g, '');

        var total = parseFloat(price) * parseInt(quantity);
        var acttotal = parseFloat(actprice) * parseInt(quantity);


        if (isNaN(total)) total = 0;
        $(e.target).closest('tr').find("[id*=lblAmount]").text(total.toFixed(2));
        $(e.target).closest('tr').find("[id*=hfAmount]").val(total);

        if (isNaN(acttotal)) acttotal = 0;
        $(e.target).closest('tr').find("[id*=lblActAmount]").text(acttotal.toFixed(2));
        $(e.target).closest('tr').find("[id*=hfActAmount]").val(acttotal);

        GrossTotal();
        GrossActTotal();
    }); 
    }

   // you can run this onload page, I just place it here to simulate your code
   InitCalculus();

    var prm = Sys.WebForms.PageRequestManager.getInstance();    
    prm.add_initializeRequest(InitializeRequest);
    prm.add_endRequest(EndRequest);

    function InitializeRequest(sender, args) {      

    }

    function EndRequest(sender, args) {
       InitCalculus();
    }
于 2012-05-15T08:17:54.597 に答える
0 
$('[id*=grdItems]').find('input[type=text][id*=txtCalc]').live('keyup', function (e) { 

});

//Or 

$("[id*=grdItems] input[type=text][id*=txtCalc]").live("keyup", function(e) { 

});

//Or 

$("[id*=grdItems] > input[type=text][id*=txtCalc]").live("keyup", function(e) { 

});

// ================================================ ==== //

$('[id*=grdItems]').find('input[type=text][id*=txtCalc]').on('keyup', function (e) { 

});

//Or 

$("[id*=grdItems] input[type=text][id*=txtCalc]").on("keyup", function(e) { 

});

//Or 

$("[id*=grdItems] > input[type=text][id*=txtCalc]").on("keyup", function(e) { 

});
于 2012-05-15T09:20:58.547 に答える