使用 JQuery 从 Listview 的 SelectedItem 为隐藏字段赋值答案

【问题标题】：Assign value to hidden field from SelectedItem of Listview using JQuery使用 JQuery 从 Listview 的 SelectedItem 为隐藏字段赋值
【发布时间】：2011-09-12 21:42:40
【问题描述】：

我正在尝试在 JQuery 中添加一个隐藏字段并为其分配一个值（从列表视图中选择的项目）。谁能帮我解决这个问题？

<SelectedItemTemplate>
          <tr class='results-row selected-product' id='<%# Eval("GenericProductID") %>'>
          <td class="results-item">
                <asp:Label ID="lblMatchedName" runat="server" Text='<%#Eval("MatchedName") %>' CssClass="matched-name" />
                <input type=’hidden’ class="synonym-id" value ='<%#Eval("SynonymID") %>' />
                <input type='hidden' class="product-index" value='<%# CType(Container, ListViewDataItem).DisplayIndex %>' />
          </td>
          <td>
    <asp:LinkButton ID="btnSelect" runat='server' CommandName='Select' Text='Select' CommandArgument='<%# Eval("GenericProductID") %>' 
          CssClass='button-select'  /></td>
          </tr>
    </SelectedItemTemplate>

在上面的块中，这是我要添加的字段，并在 jquery 中读取。

<input type=’hidden’ class="synonym-id" value ='<%#Eval("SynonymID") %>' />

JQuery——

$(document).ready(function() {
                debugger;
                $('#<%= loader.ClientID %>').hide();
                $('#left-search-content').hide();
                $('#right-search-content').hide();
                $('.header-bottom').hide();

                $('.results-row').live('mouseover', function() { $(this).addClass('highlighted'); });
                $('.results-row').live('mouseout', function() { $(this).removeClass('highlighted'); });
                $('.search-cancel').live('click', function() {
                    $('#dialog-form').dialog('close');
                });
                $('#<%= lbSearch.ClientID %>').live('click', function() {
                    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndSearchHandler);
                });
                $('.results-item').live('click', function() {
                    $('.selected-product').removeClass('selected-product');
                    $(this).addClass('selected-product');
                    //$(this).parent().addClass('selected-product');

                    //var btnId = $(this).parent().find('.button-select').attr('id').replace(/_/gi, '$');
                    //__doPostBack(btnId, "");
                    $selectedProductRow = $(this).parent();
                    var productId = $(this).parent().attr('id');
                    debugger;
                    var matchedName = $selectedProductRow.find('.matched-name').html();
                    var selectedSynonymID = $selectedProductRow.find('.synonym-id').html();

                    var $hiddenField = $('#<%= hdnSelectedProductID.ClientID %>');
                    $('#<%= hdnSelectedProductName.ClientID %>').val(matchedName);
                    $('#<%= hdnSelectedSynonymID.ClientID %>').val(selectedSynonymID);
                    if ($hiddenField) {
                        $hiddenField.val(productId);
                        __doPostBack($hiddenField.attr('id'), '');
                    }
                    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndDetailsHandler);
                    return false;
                });

                //                  $('.search-box').live('keypress', function(e) { 
                //                        if(e.keyCode == 13) {
                //                              var btnId = $(this).parent().find('.search-button').attr('id').replace(/_/gi, '$');
                //                              __doPostBack(btnId, "");
                //                        }
                //                  });

                function OnFailed(error) {
                    alert(error.get_message());
                }

            });

hdnSelectedSynonymID 是隐藏变量，我想拥有所选列表视图项的同义词数据字段。

【问题讨论】：

标签： jquery

【解决方案1】：

此类需求的一般解决方案是将change() 事件附加到列表视图小部件，您可以在其中设置隐藏字段的值。

假设列表视图确实是一个下拉列表，那么类似：

$('#list-view').change( function() {
    $('input[name=hdnSelectedSynonymID]').val($(this).attr("synonymid"));
});

您发布的代码有点难以理解，但上面的示例应该可以为您提供思路。如果要作为表单 POST 的一部分将隐藏字段传递回服务器，则它需要一个名称：

<input type="hidden" name="hdnSelectedSynonymID" value ="<%#Eval('SynonymID')%>"/>

【讨论】：