Solved

Autocomplete jQuery not working in Classic ASP page

Posted on 2013-12-18
6
994 Views
Last Modified: 2013-12-19
Hello,

I am trying to get jQuery auto-complete to work in a classic ASP web page.
But is not working
Thanks for the help.
<%dim output, outstr%>

 <%if not rs3.eof then
		'output = ""
		do while not rs3.eof%>     
	
    <%'response.write rs3("first_name") & " " & rs3("middle_name") & " " & " " & rs3("last_name") & " " & rs3("user_id") & "<BR>"
	
	output = rs3("first_name")
	outstr = """" & output & """," 
	response.write outstr %> 

	<%rs3.movenext
		loop
end if		%>



       <script type="text/javascript">
	   $(function() {	   
		   var availableTags = [<%= outstr%>]; 
		   $( "#username" ).autocomplete({
			   source: availableTags
		   });
	   });
</script>

Open in new window

0
Comment
Question by:capturetheflag
  • 3
  • 2
6 Comments
 
LVL 44

Expert Comment

by:Rainer Jeschor
ID: 39727655
Hi,
can you please post the generated HTML of your page?

Thanks.
Rainer
0
 
LVL 52

Expert Comment

by:Scott Fell, EE MVE
ID: 39727658
The problem is your trying to mix server side code and client side code.  Your asp/vb is serverside code and runs on the server BEFORE the html is written to the browser.  Javascript and jquery are client side languages and run AFTER the html and css loads.  

What you need to do is look at the sample code http://jqueryui.com/autocomplete/ and generate the html from your asp.

The link I gave you has this sample
$(function() {
    var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++",
      "Clojure",
      "COBOL",
      "ColdFusion",
      "Erlang",
      "Fortran",
      "Groovy",
      "Haskell",
      "Java",
      "JavaScript",
      "Lisp",
      "Perl",
      "PHP",
      "Python",
      "Ruby",
      "Scala",
      "Scheme"
    ];
    $( "#tags" ).autocomplete({
      source: availableTags
    });
  });

Open in new window


What you would do in your asp code is this

    <% 
dim theChoices
theChoices=""
do until rs3.eof
theChoices=theChoices&"""&rs3("first_name")&"""
rs3.movenext
if not rs3.eof then
   theChoices=theChoices&"," ' only add a comma if more data
end if
loop
' You should now have a file looking like:  "Bog","Dan","Pete", "Roger"

$(function() {
    var availableTags = [
     <%=theChoices%>
    ];
    $( "#tags" ).autocomplete({
      source: availableTags
    });
  });

Open in new window

0
 
LVL 1

Author Comment

by:capturetheflag
ID: 39729025
Hello Padas,
Thanks for your help. Yes, I have looked at the jQuery site for auto complete.
I have it working now.  Here is my code.  Please let me know if the code could be cleaned up in any way. Thanks again.
<%
dim output, outstr, mystring%>
<%
if not rs3.eof then
	do while not rs3.eof
			theChoices=theChoices&""&rs3("first_name")&""","""
		rs3.movenext
	loop
end if		

'''''cleanup and reformat string
theChoices = Replace(theChoices,""","""",""","")
theChoices = """"&theChoices &""""
'response.write theChoices
%>
<script type="text/javascript">
   $(function() {	   
	   var availableTags = [<%=theChoices%>]; 
	   $( "#username" ).autocomplete({
		   source: availableTags
	   });
   });
</script>

Open in new window

0
How Do You Stack Up Against Your Peers?

With today’s modern enterprise so dependent on digital infrastructures, the impact of major incidents has increased dramatically. Grab the report now to gain insight into how your organization ranks against your peers and learn best-in-class strategies to resolve incidents.

 
LVL 52

Accepted Solution

by:
Scott Fell,  EE MVE earned 500 total points
ID: 39729113
If it is working, it looks fine to me.  

The only thing I would do differently is place is use getrows and throw all the data to an array.

'create recordset
MyArray=rs.getrows()
rs.close
'notice you can close the rs here then use the array throughout your code without accessing the db
for r = LBound(MyArray, 2) To UBound(MyArray, 2)
    	ID= MyArray(0, r)
	First = MyArray(1, r)
	Last = MyArray(2, r)



      response.write "ID= "&ID&"<br>"
next

Open in new window

I have more detail on this here http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/ASP/Q_28201280.html#a39376842

If you want to get this going, maybe ask in a new thread.
0
 
LVL 1

Author Closing Comment

by:capturetheflag
ID: 39729566
Thanks for the help Padas.  I am opening a new thread about auto complete and hitting a 100 thousand user name db.
0
 
LVL 52

Expert Comment

by:Scott Fell, EE MVE
ID: 39729737
Ok, please post the link to the question here.  

In short, on the asp page that generates the 100K names, you want to make the query only trigger after x amount of characters have been typed.  Typically I would wait until at least 3.  Then in your query you probably want to limit the total to 50 or so.

Your sql might look like:
theName=request("name")
"Select top 50 firstName+' '+lastName as FullName from mytable where firstName like '"&theName&"%'

Open in new window

0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Generate Numbers in JQuery file 11 66
multiple selects 23 49
JavaScript to set default value on SharePoint form field 7 20
Responsive Font Size 6 29
Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer …
Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

828 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question