Question

I have a question about placement of javascript.

The function nqi_search works fine when it lives outside of a.js file.
It fails, without errors, if it is moved into my1.js, before the jquery files, or into my2.js after the jquery files. I’ve had similar problems before. Are there rules about what can and cannot go into .js files, and the order of .js files?

nqi_search is called within the jQuery ready function.

<script type="text/javascript" src="javascript/my1.js"> </script>
<script type="text/javascript" src="javascript/jquery.js"> </script>
<script type="text/javascript" src="javascript/jquery-ui.js"> </script>
<script type="text/javascript" src="javascript/my2.js"> </script>


<script type="text/javascript">
function nqi_search (type, id_name, text_name)
{
    $(function() {
        function store_id( id ) {
            $( "#"+id_name ).val(id);
        }

        $( "#"+text_name ).autocomplete({
            source: "remote.php?f=nqi_search&t="+type,
            minLength: 1,
            select: function( event, ui ) {
                store_id( ui.item.id );
            }
        });
    }); 
}
</script>

<script type="text/javascript">
jQuery(document).ready(function() {

    nqi_search ("product_search", "product_id", "product_name");    


});
</script>

Answer 1

nqi_search uses $(function()... wrapper which is the same as jQuery(document).ready.... Since it’s already being called from a ready() handler, it doesn’t make much sense. Try removing the wrapper:

function nqi_search (type, id_name, text_name)
{
        function store_id( id ) {
            $( "#"+id_name ).val(id);
        }

        $( "#"+text_name ).autocomplete({
            source: "remote.php?f=nqi_search&t="+type,
            minLength: 1,
            select: function( event, ui ) {
                store_id( ui.item.id );
            }
        });
}