Question

I have a form that, when updated, needs to pull new data from AJAX. I’ve built a function that that outputs a success when AJAX is able to access the data:

$(document).ready(function() {

    var results = $('#hidden').serialize();

    var url = 'index.php?option=com_mls&view=list&format=raw&' + results;

    $('#test').html(url);

    $.ajax({
        url: url,
        success: function(){
            alert('success');
        },
        error: function(){
            alert('There was an error loading your request.  <br />Please try again later.');
        }
    });
});

This has been tested and works. The issue I have is when trying to submit the user form, getting setting up an AJAX function that incorporates the new data. I’ve tried this to no avail:

$(document).ready(function() {

    function runQuery(){  

        var results = $('#hidden').serialize();

        var url = 'index.php?option=com_mls&view=list&format=raw&' + results;

        $('#test').html(url);

        $.ajax({
            url: url,
            success: function(){
                alert('success');
            },
            error: function(){
                alert('There was an error loading your request.  <br />Please try again later.');
            }
        });
    };  

    runQuery();

});

It’s not running the runQuery(); function.

Answer 1

It should be

$(document).ready(function() {    
    runQuery();
});

function runQuery(){  

        var results = $('#hidden').serialize();

        var url = 'index.php?option=com_mls&view=list&format=raw&' + results;

        $('#test').html(url);

        $.ajax({
            url: url,
            success: function(){
                alert('success');
            },
            error: function(){
                alert('There was an error loading your request.  <br />Please try again later.');
            }
        });
    };