Hugo Pinto
Hugo Pinto

Reputation: 49

Ajax Double Code how to make it shorter

I hope u can help me, then I have a problem. I have two similar jQuery.Ajax functions , I just want to make this in one function. I don't really know how to do it and I hope you can help me

Here are my two ajax functions Both function work fine. That was my first function

//When the page loads it shows the three first ideas

var total = 3;
    var start = 0;
    var filterName = jQuery(".select-name-filter-selector-filterPersones").val();
    var filterStatus = jQuery(".select-status-filter-selector-filterStatus").val();
    var lines = jQuery("#ajouter").val();
    jQuery.ajax({
        type: "POST",
        url : "../scripts/ajaxSuggestions.php",
        data:{limit:total, name:filterName, status:filterStatus,
            start:start,lines:lines},
        success:function(data){
            jQuery("#content").append(data);
        }
    });

And here comes my second function.Allways i click on the button to show more it add three ideas

//click ajax function that add 3 ideas to page
jQuery("#ajouter").click(function (){
        total += 3;
        start += 3;
        jQuery.ajax({
            type: "POST",
            url : "../scripts/ajaxSuggestions.php",
            data:{limit:total, name:filterName, status:filterStatus,
                start:start},
            success:function(data){
                jQuery("#content").append(data);
                if(total >= lines){
                    jQuery("#ajouter").hide();
                }
            }

        });
    });

I hope you can help me and sry for my bad english . :)

Upvotes: 3

Views: 84

Answers (2)

herr
herr

Reputation: 847

//When the page loads call

var total = 3;
var start = 0;
getSuggestion(total, start);

//when button click

jQuery("#ajouter").click(function (){
        total += 3;
        start += 3;
        getSuggestion(total, start);
});

//Function defination

function getSuggestion(total, start)
{
    var filterName = jQuery(".select-name-filter-selector-filterPersones").val();
    var filterStatus = jQuery(".select-status-filter-selector-filterStatus").val();
    var lines = jQuery("#ajouter").val();

      jQuery.ajax({
            type: "POST",
            url : "../scripts/ajaxSuggestions.php",
            data:{limit:total, name:filterName, status:filterStatus,
                start:start},
            success:function(data){
                jQuery("#content").append(data);
                if(total >= lines){
                    jQuery("#ajouter").hide();
                }
            }

        });
}

if below value not different every time then you can define it on page load also, and pass as a parameter in function call

var filterName = jQuery(".select-name-filter-selector-filterPersones").val();
var filterStatus = jQuery(".select-status-filter-selector-filterStatus").val();
var lines = jQuery("#ajouter").val();

Upvotes: 1

vijaykumar
vijaykumar

Reputation: 4806

Create a simple function

function ajaxCall(limit, filterName ,filterStatus ,type)
{
   jQuery.ajax({
            type: "POST",
            url : "../scripts/ajaxSuggestions.php",
            data:{limit:total, name:filterName, status:filterStatus,
                start:start},
            success:function(data){
                jQuery("#content").append(data);
                if(type == 1)
                {   

                   if(total >= lines){
                       jQuery("#ajouter").hide();
                  }
                }else {  jQuery("#content").append(data);
                }
            }

        });
}

Now your call based

ajaxCall (limit,filterName,filterStatus,0)

for second call

 jQuery("#ajouter").click(function (){
         total += 3;
         start += 3;
        ajaxCall (limit,filterName,filterStatus,1)
     });

for first or you can write your own logic

Upvotes: 1

Related Questions