How to set the value of hiddenfield in listview using javascript or jquery

Question

I use the following javascript to get the value of my textbox with autocompleteextender .

<script type="text/javascript">
  function txt_lect_in_AutoCompleteExtender_itemSelected(sender, e)
    {
        var hdEmpId = $get('<%= hf_emp_num.ClientID %>');
        hdEmpId.value = e.get_value();
    }
</script>

---

But when i put my textbox in my listview ,i can't access the control any more .

<telerik:radlistview id="RadListView1" runat="server" itemplaceholderid="EmployeesContainer"
                            cssclass="formTable cr_center" groupitemcount="2">
                <LayoutTemplate>
                    <fieldset >
                        <legend> <asp:Label ID="lblTitle" runat="server" Font-Bold="True" Font-Size="16pt" Height="29px"
                    Font-Names="Times New Roman (Arabic)" ForeColor="#CC6634" Text=" المحاضرون الذين يقومون بتدريس دورة:"></asp:Label><asp:Label
                        ID="lbl_course_name" runat="server" Font-Size="16pt" Height="29px" Font-Names="Times New Roman (Arabic)"
                        ForeColor="#000" Text='<%#Session["course_name"]%>'></asp:Label><br /></legend>
                       <asp:Panel ID="DataGroupPlaceHolder2" runat="server">
                    </asp:Panel>
                    </fieldset>
                </LayoutTemplate>


                <ItemTemplate>
                    <fieldset style="float: right; width: 430px;">

                        <table cellpadding="0" cellspacing="0" class="cr_subtable">  
                        <tr>
                                <td>المحاضرة:
                                      <%#Eval("session")%>
                                </td>
                                <td>
                            <asp:TextBox ID="txt_lect_in" runat="server" AutoPostBack="True" Width="300px" 
                                        Text = '<%#Eval("name_id")%>' ontextchanged="txt_lect_in_TextChanged"></asp:TextBox>
    <asp:AutoCompleteExtender ID="txt_lect_in_AutoCompleteExtender" runat="server" DelimiterCharacters=""
        Enabled="True" MinimumPrefixLength="4" ServiceMethod="Get_Emp_AutoComplete" ServicePath="~/LectAbout.asmx"
        TargetControlID="txt_lect_in" BehaviorID="ACE_txt_lect_in" CompletionListCssClass="autocomplete_completionListElement"
        CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem" CompletionListItemCssClass="autocomplete_listItem"
        EnableCaching="False" 
        FirstRowSelected="true">
    </asp:AutoCompleteExtender>
                                 <asp:HiddenField ID="hf_emp_num" runat="server" Value ='<%#Eval("id")%>'></asp:HiddenField>
                                </td>
                            </tr>

                        </table>
                    </fieldset>
                </ItemTemplate>
                 <datagroups>
                    <telerik:ListViewDataGroup GroupField="lect_date_dis" DataGroupPlaceholderID="DataGroupPlaceHolder2"
                         SortOrder="Ascending">
                         <DataGroupTemplate>
                        <asp:Panel runat="server" ID="Panel3" CssClass="dataGroup" GroupingText= '<%# (DateTime.Parse((Container as RadListViewDataGroupItem).DataGroupKey.ToString())).Date.ToString("MM-dd-yyyy")%>'>
                        <asp:PlaceHolder ID="EmployeesContainer" runat="server"></asp:PlaceHolder>
                   </asp:Panel>
                      </DataGroupTemplate>
                            </telerik:ListViewDataGroup>
              </datagroups>

                <GroupSeparatorTemplate>
                    <div style="clear: both">
                    </div>
                    <hr/>
                </GroupSeparatorTemplate>
            </telerik:radlistview>

---

From Firebug :

<div id="ctl00_ContentPlaceHolder1_RadListView1_ctrl0_Panel3" class="dataGroup">
<div style="clear: both"> </div>
<hr>
<div id="ctl00_ContentPlaceHolder1_RadListView1_ctrl4_Panel3" class="dataGroup">
<fieldset>
<legend> 01-28-2011 </legend>
<fieldset style="float: right; width: 430px;">
<fieldset style="float: right; width: 430px;">
<table class="cr_subtable" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td>المحاضرة: 4 </td>
<td>
<input id="ctl00_ContentPlaceHolder1_RadListView1_ctrl8_ctrl10_txt_lect_in" type="text" style="width:300px;" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" onchange="javascript:setTimeout('__doPostBack(\'ctl00$ContentPlaceHolder1$RadListView1$ctrl8$ctrl10$txt_lect_in\',\'\')', 0)" name="ctl00$ContentPlaceHolder1$RadListView1$ctrl8$ctrl10$txt_lect_in" autocomplete="off">
<input id="ctl00_ContentPlaceHolder1_RadListView1_ctrl8_ctrl10_hf_emp_num" type="hidden" name="ctl00$ContentPlaceHolder1$RadListView1$ctrl8$ctrl10$hf_emp_num">
</td>
</tr>
</tbody>

---

I want to set the hidden field with the value of my textbox selected value .

Answer 1

Since you have many instances (one for each data row), put some CSS classes on your elements and get them via jQuery. The domElement.control property will give you the IScriptControl reference

Answer 2

1) ADD To your TextBox

<asp:TextBox id = "txt_lect_in" onkeyup = "SetContextKey()"  ></asp:Textbox>

2) Add inside AutoCompleteExtender :

  UseContextKey = "true"

3) jquery

  function SetContextKey() {

        $find('<%=txt_lect_in_AutoCompleteExtender.ClientID%>').set_contextKey($get("<%=hf_emp_num.ClientID %>").value);


4) In Webservice Method :

 public static List<string> Get_Emp_AutoComplete(string prefixText,int count, string contextKey)

 Hope it helps,if something else please ask.

Answer 3

Now the control is in the listview you cannot access it directly.

what i would do is create a public variable say theID, then in the listview.itemcreated event, use findcontrol to find the control, then set the value of the public variable to its clientId, then use that public variable in your page.