CODEWITHSUNDEEP
javascriptperl
Blnukem
Blnukem

Reputation: 163

Pass Variable To Auto Complete JavaScript

I have this basic auto complete JavaScript that works well, but you need to hard code the web page. What I'm trying to do is send the "Autocomplete" variable data to the page using a Perl script

The working JavaScript code looks like this:

var CustomArray = new Array('an apple','alligator','elephant','pear','kingbird',
                          'kingbolt','kingcraft','kingcup','kingdom','kingfisher',
                          'kingpin','SML');

Now the new code is:

var CustomArray=new Array(Autocomplete);

And the Perl script is sending back the data to the browser looking like this:

var Autocomplete = 'an apple','alligator','elephant','pear','kingbird',
'kingbolt','kingcraft','kingcup','kingdom','kingfish er','kingpin','SML'

I also tried

var Autocomplete = ['an apple','alligator','elephant','pear','kingbird',
                    'kingbolt','kingcraft','kingcup','kingdom','kingfisher',
                    'kingpin','SML']

But I get: 'an apple','alligator','elephant','pear','kingbird','kingbolt','kingcraft','kingcup','kingdom','kingfish er','kingpin','SML' All as one string in the auto complete.

I cant seem to get it to work right. Full HTML code is below.

<html>
<head>
<script language="javascript" type="text/javascript" src="http://www.comicinvasion.com/Code/Java/Autocomplete/Autocomplete.js"></script>
<script language="javascript" type="text/javascript" src="http://www.comicinvasion.com/Code/Java/Autocomplete/Common.js"></script>
<script language="JavaScript1.2" type="text/javascript" src="http://www.ComicInvasion.com/cgi-bin/Autocomplete.pl"></script>


<script>
var CustomArray=new Array(Autocomplete);
</script>

</head>

<body>

<input type='text' style='font-family:verdana;width:300px;font-size:12px' id='ACMP' value=''/>

<script>
var obj = actb(document.getElementById('ACOMP'),CustomArray);
</script>

</body>
</html>

Upvotes: 1

Views: 603

Answers (2)

Sinan &#220;n&#252;r
Sinan &#220;n&#252;r

Reputation: 118148

First, it looks like there is a typo. The id of your input element is ACMP whereas you pass 'ACOMP' to getElementById.

Second, you do not provide the source code for your Perl script. It might look like this:

#!/usr/bin/perl

use utf8;
use strict; use warnings;
use CGI();

local $| = 1;

print CGI::header(
    -type => 'text/javascript',
    -charset => 'utf-8',
);

print <<JS;
var Autocomplete = [
    'an apple','alligator','elephant','pear','kingbird',
    'kingbolt','kingcraft','kingcup','kingdom','kingfisher',
    'kingpin','SML'
];
JS

With the following HTML, autocompletion works:

<!DOCTYPE html>
<html>
<head>

<script type="text/javascript"
src="http://www.comicinvasion.com/Code/Java/Autocomplete/Autocomplete.js"></script>

<script type="text/javascript" src="http://www.comicinvasion.com/Code/Java/Autocomplete/Common.js"></script>

<!-- Replace with the URI of your script -->
<script type="text/javascript" src="http://test:8080/cgi-bin/autocomplete.pl"></script>

</head>

<body>

<input type='text'
style='font-family:verdana;width:300px;font-size:12px'
id='ACOMP' value=''>

<script type="text/javascript">
var obj = actb(document.getElementById('ACOMP'), Autocomplete);
</script>

</body>
</html>

Finally, I find it curious that your JavaScript files live in a directory called Java.

Upvotes: 2

glortho
glortho

Reputation: 13198

Have the perl script return this:

var CustomArray = "an apple, alligator".split(',');

Or, if it has to be this it's okay too:

var CustomArray = "'an apple','alligator'".split(',');

Obviously, I omitted the rest of the items in there but you'd include all of them.

Upvotes: 0

Related Questions