Hey, I am having difficulty with formating the Image that I return with my description. I can return the image file name and all my images are stored in the same location so I need to apend the image html with the path and file name.
I am using Ajax AutoComplete and a webservice. I pass 3 parms to the web service that include the prefixText, count, and a contextKey. Then I return a ResultsArray that includes the Picture's file name and Company name separated by a comma(,).
I have provided some code as explained above. I believe it's just a script formatting issue but cannot seem to get this to work. I had refernced the following url but cannot seem to get this to work based on my design.
https://www.aspsnippets.com/Articles/Render-images-in-autocomplete-list-of-ASP.Net-AJAX-AutoCompleteExtender.aspx
Thanks in advance for considering this request.
HTML Markup
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-search"></i></span>
<asp:TextBox ID="txtSBN_Search" runat="server" CssClass="form-control" placeholder="Search by Company Name, Category, Brand, Style and more!!"
Wrap="False" AutoPostBack="True"></asp:TextBox>
</div>
</div>
<asp:AutoCompleteExtender runat="server" ID="SelectCompany" TargetControlID="txtSBN_Search"
ServiceMethod="GetCompanies" ServicePath="GetCompanies.asmx" MinimumPrefixLength="1"
CompletionSetCount="20" FirstRowSelected="True" ContextKey="S">
</asp:AutoCompleteExtender>
Web Service
<WebMethod()> _
Public Function GetCompanies(ByVal prefixText As String, _
ByVal count As Integer, ByVal contextKey As String) As String()
Dim Results As New ArrayList
Try
Using SqlCommand1 As New SqlCommand("aspnet_Select_Company_By_Name", Connection)
SqlCommand1.CommandType = CommandType.StoredProcedure
SqlCommand1.Parameters.Add(New SqlParameter("@prefixText", prefixText))
SqlCommand1.Parameters.Add(New SqlParameter("@prefixKey", contextKey))
Using Reader As SqlDataReader = SqlCommand1.ExecuteReader()
Dim Counter As Integer
While Reader.Read
If (Counter = count) Then Exit While
Results.Add(Reader("CompanyName").ToString())
Counter += 1
End While
End Using
Dim ResultsArray(Results.Count - 1) As String
ResultsArray = Results.ToArray(GetType(System.String))
Return ResultsArray
End Using
Catch ex As Exception
Throw ex
End Try
End Function
Scripting I was reviewing and attempting to simulate fro the referenced url
<script type = "text/javascript">
function Employees_Populated(sender, e) {
var employees = sender.get_completionList().childNodes;
for (var i = 0; i < employees.length; i++) {
var div = document.createElement("DIV");
div.innerHTML = "<img style = 'height:50px;width:50px' src = 'photos/"
+ employees[i]._value + ".jpg' /><br />";
employees[i].appendChild(div);
}
}
function OnEmployeeSelected(source, eventArgs) {
var idx = source._selectIndex;
var employees = source.get_completionList().childNodes;
var value = employees[idx]._value;
var text = employees[idx].firstChild.nodeValue;
source.get_element().value = text;
}
</script>