[英]Get value of hidden label in table using jquery?
I have an html table within a list view, and have a hidden label in it called "vehicle_num". 我在列表视图中有一个html表,并在其中有一个称为“ vehicle_num”的隐藏标签。 I am able to get the selected row of the table, as well as any of the td, however I cannot seem to get the value of the label.
我可以获取表的选定行以及任何td,但是我似乎无法获取标签的值。 I have tried:
我努力了:
var vehicle_number = $(this).closest('tr').children('#vehicle_num').text();
Below is the code for the listview. 下面是列表视图的代码。 How can I get the value of the label?
如何获得标签的价值?
<asp:ListView ID="lvEquipmentList" runat="server" DataKeyNames="vehicle_number">
<LayoutTemplate>
<table id="table-equipment-list" class="table table-list">
<thead>
<tr>
<th scope="col" class="product-line">Product line</th>
<th scope="col" class="model-number">Model #</th>
<th scope="col" class="serial-number">Serial #</th>
<th scope="col" class="dar-status">DAR Status</th>
<th scope="col" class="ship-date">Ship Date</th>
</tr>
</thead>
<tbody>
<asp:PlaceHolder ID="ItemPlaceholder" runat="server" />
</tbody>
</table>
</LayoutTemplate>
<ItemTemplate>
<tr>
<th scope="row" class="product-line"><div class="icon"><img src='<%#Eval("image_path")%>' onerror="this.src='assets/images/placeholder.png';" alt=""/></div> <span class="line-title"><%#Eval("product_line")%></span></th>
<td class="model-number"><%#Eval("model")%><label class="vehicle_num" hidden="hidden"><%#Eval("vehicle_number")%></label></td>
<td class="serial-number"><%#Eval("serial_number")%></td>
<td class="dar-status"><img src='<%#Eval("display_status") %>'/></td>
<td class="ship-date"><%#Eval("date")%></td>
</tr>
</ItemTemplate>
<EmptyDataTemplate>
<table id="table-equipment-list" class="table table-list">
<thead>
<tr>
<th scope="col" class="product-line">Product line</th>
<th scope="col" class="model-number">Model #</th>
<th scope="col" class="serial-number">Serial #</th>
<th scope="col" class="dar-status">DAR Status</th>
<th scope="col" class="ship-date">Ship Date</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row" class="product-line"><div class="icon"></div> <span class="line-title"></span></th>
<td class="model-number"></td>
<td class="serial-number"></td>
<td class="dar-status"></td>
<td class="ship-date"></td>
</tr>
</tbody>
</table>
</EmptyDataTemplate>
</asp:ListView>
EDIT 编辑
I have edited the code above to put the label in a table column. 我已经编辑了上面的代码以将标签放在表格列中。 I was able to get the value using:
我能够使用以下方法获得价值:
var vehicle_number = $(this).closest('tr').find('.vehicle_num').text();
This is invalid markup: 这是无效的标记:
<tr>
<th scope="row" class="product-line"><div class="icon"><img src='<%#Eval("image_path")%>' onerror="this.src='assets/images/placeholder.png';" alt=""/></div> <span class="line-title"><%#Eval("product_line")%></span></th>
<td class="model-number"><%#Eval("model")%></td>
<td class="serial-number"><%#Eval("serial_number")%></td>
<td class="dar-status"><img src='<%#Eval("display_status") %>'/></td>
<td class="ship-date"><%#Eval("date")%></td>
<label id="vehicle_num" hidden="hidden" runat="server"><%#Eval("vehicle_number")%></label>
</tr>
There's an errant label
as a child of a tr
, which isn't valid. 有一个错误的
label
作为tr
的子tr
,这是无效的。 When the browser tries to make sense of this, it could be doing anything with that label
to construct a valid DOM, which is going to effect your jQuery selectors. 当浏览器试图理解这一点时,它可能会使用该
label
进行任何操作来构造有效的DOM,这将影响您的jQuery选择器。
The label
needs to be in a table cell: label
必须在表格单元格中:
<tr>
<th scope="row" class="product-line"><div class="icon"><img src='<%#Eval("image_path")%>' onerror="this.src='assets/images/placeholder.png';" alt=""/></div> <span class="line-title"><%#Eval("product_line")%></span></th>
<td class="model-number"><%#Eval("model")%></td>
<td class="serial-number"><%#Eval("serial_number")%></td>
<td class="dar-status"><img src='<%#Eval("display_status") %>'/></td>
<td class="ship-date"><%#Eval("date")%></td>
<td><label id="vehicle_num" hidden="hidden" runat="server"><%#Eval("vehicle_number")%></label></td>
</tr>
(Or, if it's always hidden anyway, you can probably put it in an existing table cell. Either way should work.) (或者,如果无论如何总是将其隐藏,则可以将其放在现有的表格单元格中。这两种方法都应该起作用。)
Additionally, if the client-side id
is being explicitly set here, then any repetition of these records will result in duplicate id
s in the DOM, which is also invalid. 另外,如果在此处显式设置了客户端
id
,则这些记录的任何重复都将导致DOM中的id
重复,这也是无效的。 Different browsers respond to id
-based selectors in different ways when there are duplicate id
s, because the behavior is undefined. 当存在重复的
id
,由于行为未定义,所以不同的浏览器以不同的方式响应基于id
的选择器。 You probably want to use a class instead: 您可能想改用一个类:
<label class="vehicle_num" ...
Since the label
is no longer a child of the tr
but rather a descendant of it, use find()
instead of children()
: 由于
label
不再是一个孩子 tr
而是它的后代 ,使用find()
,而不是children()
$(this).closest('tr').find('.vehicle_num')
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.