Autocomplete jQuery on User Controller within Repeater .NET
- by TheDPQ
I have a Multiview search feature on a Web User Controller that is called within a Repeater, OHMY!!
I have some training sessions being listed out on a page, each calling an employeeSearch Web User Controller so people can search for employees to add to the training session. I have the Employee Names and Employee IDs listed out in JS on the page and using the jQuery autocomplete i have them search for the employee and populate a hidden field in the User controller. Once the process is done they have the option of adding yet another employee.
So i had Autocompelte 'work' in all the employee search boxes, but one i do the initial search (postback) autocomplete won't work again.
Then i updated $().ready(function() to pageLoad() so it works correctly on multiple searches but only in the LAST item of the repeater (jQuery is loaded on the User Controller)
FYI: I have the JS string set as EMPLOYEENAME|ID and jQuery displays the Employee Name and if they select it throws the ID in a ASP:HIDDEN FIELD
<script type="text/javascript">
format_item = function(item, position, length) {
var str = item.toString().split("|", 2);
return str[0];
}
function pageLoad() {
$("#<%=tb_EmployeeName.ClientID %>").autocomplete(EmployeeList, {
minChars: 0,
width: 500,
matchContains: true,
autoFill: false,
scrollHeight: 300,
scroll: true,
formatItem: format_item,
formatMatch: format_item,
formatResult: format_item
});
$("#<%=tb_EmployeeName.ClientID %>").result(function(event, data, formatted) {
var str = data.toString().split("|", 2);
$("#<%=hf_EmployeeID.ClientID %>").val(str[1]);
});
};
</script>
I can already guess that by repeating pageLoad within the User Controll i override the previous pageLoad.
THE QUESTION: Is there a way around this, a way to have all the jQuery appear in a single pageLoad or to somehow have a single jquery call to handle all my search boxes?
I can't move the jQuery into the page calling all the controllers because i have no way of referencing the specific *tb_EmployeeName* textbox AND *hf_EmployeeID* hidden field.
Thank you so much for any help or insight you can give me into this problem.
This is the Multiview that on the User Controller
<asp:MultiView ID="mv_EmployeeArea" runat="server" ActiveViewIndex="0">
<asp:View ID="vw_Search" runat="server">
<asp:Panel ID="eSearch" runat="server">
<b>Signup Employee Search</b> (<i>Last Name, First Name</i>)<br />
<asp:TextBox ID="tb_EmployeeName" class="EmployeeSearch" runat="server"></asp:TextBox>
<asp:HiddenField ID="hf_EmployeeID" runat="server" />
<asp:Button ID="btn_Search" runat="server" Text="Search" />
</asp:Panel>
</asp:View>
<asp:View ID="vw_Confirm" runat="server">
<b>Signup Confirmation</b>
<asp:FormView ID="fv_EmployeeInfo" runat="server">
<ItemTemplate>
<%#(Eval("LastName"))%>, <%#(Eval("FirstName"))%><br />
</ItemTemplate>
</asp:FormView>
<asp:Button ID="btn_Confirm" runat="server" Text="Signup this employee" /> <asp:Button ID="btn_Reset3" runat="server" Text="Reset" />
</asp:View>
<asp:View ID="vw_ThankYou" runat="server">
<b>Thank You</b><br />
The employee has been signed up and an email confirmation has been sent out.<br /><br />
<asp:Button ID="btn_Reset" runat="server" Text="Reset" />
</asp:View>
</asp:MultiView>
UPDATE: I never did find an answer but i had to do a demo so i hacked together something that 'works', but feels sort of cheesy. I am still very much needed of a better question or better understanding.
