asp.net获取带有jQuery的gridview值并放在文本框中

Question

我有一个隐藏了几列的gridview。 当我将鼠标悬停在网格上的每一行上时，我希望隐藏的列值显示在gridview下面的文本框中。

以下是html/aspx代码（缩写） 只有几列可见，大多数是隐藏的。

 <asp:GridView ID="GridView1" > 
      <rowstyle cssclass="GridRowStyle" /> 
      <Columns>         
       <asp:BoundField DataField="ClientsName" HeaderText="ClientsName"></asp:BoundField> 

      <asp:BoundField DataField="Clientsaddress1" HeaderText="Clientsaddress1"><ItemStyle CssClass="hiddencol" /><HeaderStyle CssClass="hiddencol" /> </asp:BoundField> 
       <asp:BoundField DataField="Clientsaddress2" HeaderText="Clientsaddress3"><ItemStyle CssClass="hiddencol" /><HeaderStyle CssClass="hiddencol" /> </asp:BoundField> 
    </columns> 
    </asp:gridview> 

<asp:TextBox ID="txtAddress1" runat="server" Width="250px" ></asp:TextBox> 
<asp:TextBox ID="txtAddress2" runat="server" Width="250px" ></asp:TextBox> 

下面是一些我使用来获取gridview的行，我选择了jQuery代码，但我不能让它给我的每个隐藏的列的值在GridView上一行。我已经尝试了几个在stackoverflow中找到的代码片段，但无法让它工作。 该代码给了我所在的行号，很棒，但无法获取隐藏列值，并将它们置于gridview下方的各自文本框中。

$("#GridView1 tr td").mouseenter(function() { 
        var iColIndex = $(this).closest("tr td").prevAll("tr td").length; 
        var iRowIndex = $(this).closest("tr").prevAll("tr").length; 
        alert(iRowIndex) 
       }); 

您的指导表示赞赏。

更新： 这里是一个什么样的HTML呈现。 该页面有大约600行文字，因此我缩短了仅显示gridview渲染的一个示例。

<tr title="Click to select this row." class="GridRowStyle" onclick="javascript:__doPostBack(&#39;GridView1&#39;,&#39;Select$0&#39;)"> 

<td class="hiddencol">23644</td> 
<td class="hiddencol">10102</td> 
<td class="hiddencol">Y</td> 
<td class="hiddencol">21 Jump Street</td> 
<td class="hiddencol">Sydney, Australia</td> 
<td class="hiddencol">&nbsp;</td> 
<td> 

<table> 
<tr> 
<td class="STD_normal" style="width:150px; font-weight:bold">Apple Inc.</td>              
</tr> 
<tr> 
<td class="STD_Normal_Grey" style="width:150px">Entered: 31-Jan-2015 </td> 
</tr> 
</table>            
</td><td> 
<tr title="Click to select this row." class="GridRowStyle" onclick="javascript:__doPostBack(&#39;GridView1&#39;,&#39;Select$0&#39;)"> 
<td class="hiddencol">23644</td> 
<td class="hiddencol">10102</td> 
<td class="hiddencol">Y</td> 
<td class="hiddencol">21 Jump Street</td> 
<td class="hiddencol">Sydney, Australia</td> 
<td class="hiddencol">&nbsp;</td> 
<td> 

<table> 
<tr> 
<td class="STD_normal" style="width:150px; font-weight:bold">Apple Inc.</td>              
</tr> 
<tr> 
<td class="STD_Normal_Grey" style="width:150px">Entered: 31-Jan-2015 </td> 
</tr> 
</table>            
</td><td> 

Answer 1

HTML代码

指定类行的其他值控制为每个隐藏的领域。 “data1和data2”，所以我们可以直接使用该类获取元素。

<asp:GridView ID="GridView1" runat="server" CssClass="tableGrid"> 
      <RowStyle CssClass="GridRowStyle" /> 
      <Columns> 
       <asp:BoundField DataField="ClientsName" HeaderText="ClientsName"></asp:BoundField> 
       <asp:BoundField DataField="Clientsaddress1" HeaderText="Clientsaddress1"> 
        <ItemStyle CssClass="hiddencol data1" /> 
        <HeaderStyle CssClass="hiddencol" /> 
       </asp:BoundField> 
       <asp:BoundField DataField="Clientsaddress2" HeaderText="Clientsaddress3"> 
        <ItemStyle CssClass="hiddencol data2" /> 
        <HeaderStyle CssClass="hiddencol" /> 
       </asp:BoundField> 
      </Columns> 
     </asp:GridView> 

     <asp:TextBox ID="TextBox1" runat="server" CssClass="text1" Width="250px"></asp:TextBox> 
     <asp:TextBox ID="TextBox2" runat="server" CssClass="text2" Width="250px"></asp:TextBox> 

脚本

<script type="text/javascript" src="~/Scripts/jquery-1.10.2.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("table.tableGrid tr").mouseover(function (event) { 
       var row = $(this); 
       $(".text1").val($(row).find("td.data1").text()); 
       $(".text2").val($(row).find("td.data2").text()); 
      }); 
     }); 
    </script> 

CSS

.hiddencol { 
      display: none; 
     } 

希望这有助于

Answer 2

鼠标悬停事件调用客户端功能，像下面和地图，它使用的U值从GridView控件想文本框

function IAmSelected(source, eventArgs) { 
       if (source) { 
        // Get the HiddenField ID. 
        var hiddenfieldID = source.get_id().replace("chkAdd", "hfValue");// here you can add any control of your gridview row which value you want 
        $get(hiddenfieldID).value = eventArgs.get_value();//check value or alert 
        document.getElementById('<%= yrtextbox.ClientID %>').value = eventArgs.get_value(); //for textbox 
       } 
     }