zoukankan      html  css  js  c++  java
  • 13. vs2010 ClientID bug处理

    在VS2010中的产生ClientID有几种方式,每个控件或页面有个ClientIDMode属性,可以用来决定产生ClientID的方式,它有AutoIDStaticInheritPredictable,具体区别请在网上查找。默认为AutoID.

    但在VS2010中产生的ClientID是有bug.即产生的ClientID和客户端产生的HTML的ID是不一样的,因此在用js或jQuery的函数中要调用指定ID的元素时系统提示不存在此元素。

    处理思路:

        由于每个元素产生的ClientID是唯一的,我们可以给要用到的元素设定一个或多个属性,这此属性也是唯一的,这样可以在js中用这些属性来找到此元素并操作它。

    示例:

         1.在页面中有三个输入框,单价、数量、总金额,当离开单价框或数量框时,会自动在总金额中显示单价*数量的值。因此我们可以建立数据表:id(自增),price(单价),count(数量),Amount(金额).

         2.由于要在新增是就应该建立元素的属性,因此用listview 的ItemCreated事件,在这里面注册每个元素属性,并注册它们的事件。

         3.html源码:

       

    <%@ Page Language="C#"  AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="ClientIDBug.WebForm1" %>
    
    <!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 src="js/jquery-1.10.1.js" type="text/javascript"></script>
        <script type="text/javascript">
            function onamount(priceid, countid, amountid) {
                var price = $("input[myid=" + priceid + "]").val();
                var count = $("input[myid=" + countid + "]").val();
                var iprice = parseFloat(price);
                var icount = parseInt(count, 10);
                if (!isNaN(iprice) & !isNaN(count)) {
                    $("input[myid=" + amountid + "]").val(iprice * icount);
                }
    
           };
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
        
            <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" 
                DeleteMethod="Delete" InsertMethod="Insert" 
                OldValuesParameterFormatString="original_{0}" SelectMethod="GetData" 
                TypeName="ClientIDBug.DAL.DataSetPriceTableAdapters.T_PriceTableAdapter" 
                UpdateMethod="Update">
                <DeleteParameters>
                    <asp:Parameter Name="Original_id" Type="Int32" />
                </DeleteParameters>
                <InsertParameters>
                    <asp:Parameter Name="price" Type="Decimal" />
                    <asp:Parameter Name="count" Type="Int32" />
                    <asp:Parameter Name="amount" Type="Decimal" />
                </InsertParameters>
                <UpdateParameters>
                    <asp:Parameter Name="price" Type="Decimal" />
                    <asp:Parameter Name="count" Type="Int32" />
                    <asp:Parameter Name="amount" Type="Decimal" />
                    <asp:Parameter Name="Original_id" Type="Int32" />
                </UpdateParameters>
            </asp:ObjectDataSource>
            <asp:ListView ID="ListView1" runat="server" DataKeyNames="id" 
                DataSourceID="ObjectDataSource1" InsertItemPosition="LastItem" 
                onitemcreated="ListView1_ItemCreated" onitemdatabound="ListView1_ItemDataBound">
               
               
                <EmptyDataTemplate>
                    <table runat="server" style="">
                        <tr>
                            <td>
                                未返回数据。</td>
                        </tr>
                    </table>
                </EmptyDataTemplate>
                <InsertItemTemplate>
                    <tr style="">
                        <td>
                            <asp:Button ID="InsertButton" runat="server" CommandName="Insert" Text="插入" />
                            <asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="清除" />
                        </td>
                        <td>
                            &nbsp;</td>
                        <td>
                            <asp:TextBox ID="priceTextBox" runat="server" Text='<%# Bind("price") %>' />
                        </td>
                        <td>
                            <asp:TextBox ID="countTextBox" runat="server" Text='<%# Bind("count") %>' />
                        </td>
                        <td>
                            <asp:TextBox ID="amountTextBox" runat="server" Text='<%# Bind("amount") %>' />
                        </td>
                    </tr>
                </InsertItemTemplate>
                <ItemTemplate>
                    <tr style="">
                        <td>
                            <asp:Button ID="DeleteButton" runat="server" CommandName="Delete" Text="删除" />
                        </td>
                        <td>
                            <asp:Label ID="idLabel" runat="server" Text='<%# Eval("id") %>' />
                        </td>
                        <td>
                            <asp:Label ID="priceLabel" runat="server" Text='<%# Eval("price") %>' />
                        </td>
                        <td>
                            <asp:Label ID="countLabel" runat="server" Text='<%# Eval("count") %>' />
                        </td>
                        <td>
                            <asp:Label ID="amountLabel" runat="server" Text='<%# Eval("amount") %>' />
                        </td>
                    </tr>
                </ItemTemplate>
                <LayoutTemplate>
                    <table runat="server">
                        <tr runat="server">
                            <td runat="server">
                                <table ID="itemPlaceholderContainer" runat="server" border="0" style="">
                                    <tr runat="server" style="">
                                        <th runat="server">
                                        </th>
                                        <th runat="server">
                                            id</th>
                                        <th runat="server">
                                            price</th>
                                        <th runat="server">
                                            count</th>
                                        <th runat="server">
                                            amount</th>
                                    </tr>
                                    <tr ID="itemPlaceholder" runat="server">
                                    </tr>
                                </table>
                            </td>
                        </tr>
                        <tr runat="server">
                            <td runat="server" style="">
                            </td>
                        </tr>
                    </table>
                </LayoutTemplate>
               
            </asp:ListView>
        
        </div>
        </form>
    </body>
    </html>

      4. ListView的ItemCreate源码

       

      protected void ListView1_ItemCreated(object sender, ListViewItemEventArgs e)
            {
                if (e.Item.ItemType == ListViewItemType.InsertItem)
                {
                    TextBox priceTextBox = (TextBox)e.Item.FindControl("priceTextBox");
                    TextBox countTextBox = (TextBox)e.Item.FindControl("countTextBox");
                    TextBox amountTextBox = (TextBox)e.Item.FindControl("amountTextBox");
    
                    priceTextBox.Attributes["myid"] = priceTextBox.ClientID;
                    countTextBox.Attributes["myid"] = countTextBox.ClientID;
                    amountTextBox.Attributes["myid"] = amountTextBox.ClientID;
    
                    string amountfun=string.Format("onamount('{0}','{1}','{2}')",priceTextBox.ClientID,countTextBox.ClientID,amountTextBox.ClientID);
    
                    priceTextBox.Attributes["onblur"] = amountfun;
                    countTextBox.Attributes["onblur"] = amountfun;
                }
            }

      

  • 相关阅读:
    剑指Offer(书):链表中环的入口节点
    剑指Offer(书):链表的倒数第K个节点
    剑指Offer(书):调整数组顺序使奇数位于偶数前面
    恒天云技术分享系列7 – 分布式块存储架构
    恒天云技术分享系列6 – vLan网络原理解析
    恒天云技术分享系列5 – 虚拟化平台性能对比(KVM & VMware)
    恒天云技术分享系列4 – OpenStack网络攻击与防御
    企业如何实现云计算价值的最大化
    恒天云技术分享系列3 – KVM性能调优
    恒天云技术分享系列2
  • 原文地址:https://www.cnblogs.com/yagzh2000/p/3171069.html
Copyright © 2011-2022 走看看