Question

The problem I have is I have two seperate AJAX requests using jQuery, One which is performed when the page loads, and another when a button is clicked, but they are almost identical (in code) as they both update the same html and both return JSON, and I was just wondering whether there would be a way to ‘merge’ the two so its more like :

[pseudo]
if(button is clicked){
     performAjaxOne;
}else{
     performAjaxTwo
}
[/pseudo]

Here is my actual code:

    $(document).ready(function(){

            $('.loading-text').hide();

            $.ajax({
                url: '/ajax/job/getActiveJobs.php',
                dataType: 'json',
                type: 'post',
                success: function( data ){

                    $('#loading, .loading-text').show();

                    if( !data.error ){
                        $('.alertText').html( data.msg ).show();
                    }else{
                        $('.alertText').html( data.error ).show();
                    }

                    $('#loading, .loading-text').hide();
                }
            });


            $('#submit').click(function( event ){

                var formData = $('#contact_search').serialize();

                $('#loading, .loading-text').show();

                $.ajax({
                    url: '/ajax/job/searchJobs.php',
                    dataType: 'json',
                    type: 'post',
                    data: formData,
                    success: function ( e ){

                        alert( e );

                        if( !e.error ){
                            $('.alertText').html( e.content ).show();
                        } else {
                            $('.alertText').html( e.error ).show();
                        }

                        $('#loading, .loading-text').hide();
                    }
                });
            });
        });

Please let me know.

Thanks in advance!

Answer 1

$(document).ready(function(){
    $('.loading-text').hide();
    var url = '/ajax/job/getActiveJobs.php';
    makeAjaxRequest(url);
    $('#submit').click(function( event ){
        var formData = $('#contact_search').serialize();
        $('#loading, .loading-text').show();
        url = '/ajax/job/searchJobs.php';
        makeAjaxRequest(url);
    })
})

    function makeAjaxRequest(url){
        $.ajax({
                    url: url,
                    dataType: 'json',
                    type: 'post',
                    success: function( data ){

                        $('#loading, .loading-text').show();

                        if( !data.error ){
                            $('.alertText').html( data.msg ).show();
                        }else{
                            $('.alertText').html( data.error ).show();
                        }

                        $('#loading, .loading-text').hide();
                    }
                });

    }