jQuery Mobile Event problem (code not being executed)

jQuery Mobile Event problem (code not being executed)

Hi everybody...

I am testing Andy Matthews' autocomplete and it works only if I reload the page.

I've taken the code from his examples:

http://andymatthews.net/code/autocomplete/callback.html

Here's the code:

  1. <script>



  1. $("#mainPage").bind("pageshow", function(e) {



  1. var data = ['C', 'Clojure', 'Java', 'Scala', 'Objective-C', 'C++', 'PHP', 'C#', '(Visual) Basic', 'Python', 'Perl', 'JavaScript', 'Ruby', 'Visual Basic .NET', 'Transact-SQL', 'Lisp', 'Pascal', 'Bash', 'PL/SQL', 'Delphi/Object Pascal', 'Ada', 'MATLAB'];



  1. $("#searchField").autocomplete({

  1. target: $('#suggestions'),

  1. source: data,

  1. callback: function(e) {

  1. var $a = $(e.currentTarget);

  1. $('#searchField').val($a.text());

  1. $("#searchField").autocomplete('clear');

  1. },

  1. link: 'target.html?term=',

  1. minLength: 1

  1. });

  1. });

  1. </script>





It works flawlessly except the fact that if I come from another page it won't work if I don't reload the page containing the script.

I've tried pagecreate, pageinit, pageaftercreate, all without success...

I have added a console.log("test"); to check if the code was executed but it was never executed (unless I reload the page containing it).

What am I doing wrong?

Thanks