使用JS实现将GridView中的TextBox列的值博给GridView外的一个文本筐

      实现在GridView中的TextTextBox列中的Textbox每添加一值，在该TextBox失去焦点时，

GridView外面的TextBox自动添加该GridView中Textbox列中的TextBox添加的值，并过滤输入不是数字的情况

  效果如图：

   

已知【薪酬总额】的文本筐解析后<input  type="text"  name="txtAllValue"  id="txtAllValue"  />

   GridView中的TextBox模板列的id="txtones"( 非解析的id )，GridView解析后成的table    id="tbGridViews"; 

   在GridView的RowDataBind事件中：加如下代码

       private     void    GridView_RowDataBoind( object sender , EventArgs  e )

        {

               if ( e.Row.RowType==DataControlRowType.DataRow)

                 {

                      TextBox   tboxone  =  e.Row.FindControl("txtones")   as  TextBox ;

                      if ( tboxone != null )

                        {

                              tboxone.Attribute.Add( " onfocus " , " GetAllValues(); ") ;     // 模板中的TextBox添加获得焦点JS事件

                        }

                 }

        }

      前台JS代码实现如下

        < script   type="text/javascript">

              Function    GetAllValues()

                 {

                         var    tbGridView = document.getElementById( " tbGridViews" ) ;       // 得到解析GridVeiw的table

                         if( tbGridView )

                          {

                               var    oInput =tbGridView.getElementsByTagName( " input " ) ;        //  得到解析GridView的table中的所有input元素 

                               var   Lastvalue = 0;

                               for ( int  i=0 ; i < oInput.Length ; i++)                            //  遍历解析GridView的table中包含所有input元素的变量

                                 {

                                       if( oInput[i].type == "text ")                                //   判断GridView解析后的table中的input元素是否是text  文本筐

                                        {

                                             var   oValue = oInput[i].value ;                   // 得到文本筐的值

                                             if ( oValue =="" || isNaN ( oValue ))                          // 当文本筐的值为空或非数字时，默认该文本筐的值为0

                                                  oValue = 0;

                                             else

                                                 oValue=parseFloat( oValue ) ;               

                                             LastValue + = oValue ;              

                                       }

                                 }

                              var   allText = document.getElementById( " txtAllValue ") ;       // 得到薪酬总额文本筐  

                              if ( allText )

                                {

                                     allText.value = LastValue ;                            // 为薪酬总额文本筐博值

                                }

                          }

                 }

   为了合用户在GridView的TextBox模板中的TextBox输入的值为数字且大于0。首先编辑模板，在该模板中添加一个CompareValidator验证控件，

设置其Text=“*”，ToolTip="请输入有效的数字" ，Operator ="GreaterThan" , ValueToCompare="0",Type="Double" ;

 

转载于:https://www.cnblogs.com/yingger/archive/2012/11/17/2775432.html