無法訪問中繼器中的自動完成的文本框

Question

我正嘗試使用小型JavaScript腳本訪問中繼器中的文本框。當用戶從列表中選擇一個選項時，它由ajax自動完成調用。

它不工作，因爲javascript無法訪問文本框（ID = ContactID）。原因是因爲它在一箇中繼器。那麼，如何修改腳本以訪問中繼器中的特定文本框？

<script type="text/javascript" > 
    function OnContactSelected(source, eventArgs) { 
    $get('<%# ContactID.ClientID %>').value = eventArgs.get_value(); 
    } 
</script> 

直放站代碼：

<asp:repeater ID="itemsRepeater" 
     OnItemDataBound="itemsRepeater_ItemDataBound" 
     runat="Server"> 
    <itemtemplate> 
     <tr> 
     <td> 
      <asp:RadioButtonList runat="server" DataSource="<%#   ((Outlet)Container.DataItem).OutletInformations %>" DataValueField="DateOfDelivery" DataTextField="DateOfDelivery" />   
     </td> 
     <td> 
      <asp:TextBox ID="ContactID" runat="server"/> 
     </td> 
     </tr> 
    </itemtemplate> 
</asp:repeater> 

Answer 1

這似乎是你的問題是，你實際上並沒有針對任何「特殊」文本框。對於中繼器的每一行都會有一個這樣的文本框，並且由於數據綁定的性質，這些文本框始終只能在運行時纔可用。

要解決此問題，您需要執行以下兩項操作之一。更難但更完整的答案是使用中繼器的onItemDatabound事件並從該事件的eventArgs中提取子控件。如果您想修改代碼隱藏中的子控件，這將是您唯一的選擇。

但是，因爲你是從JavaScript和做這個（表面上）希望這個自動完成功能上的每一個文本運行，只要給錶行的一類，並針對它裏面所呈現的輸入標籤：

。 ASPX：

<itemtemplate> 
     <tr> 
     <td> 
      <asp:RadioButtonList runat="server" DataSource="<%#   ((Outlet)Container.DataItem).OutletInformations %>" DataValueField="DateOfDelivery" DataTextField="DateOfDelivery" />   
     </td> 
     <td class="autocomplete"> 
      <asp:TextBox ID="ContactID" runat="server"/> 
     </td> 
     </tr> 
    </itemtemplate> 

JS：

<script type="text/javascript" > 
    function OnContactSelected(source, eventArgs) { 
     var fields = document.querySelectorAll(".autocomplete input"); 
     for(var i = 0; i < fields.length; i++){ 
     fields[i].value = eventArgs.get_value(); 
     } 
    } 
</script>