Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I'm using this code http://www.9lessons.info/2010/10/pagination-with-jquery-php-ajax-and.html

and it's works great , I want to add button to let the user change the view from vertical to horizontal

I edited load_data.php and added all the code it's need.

in controller I edited:

data: "page="+page,

to

data: "page="+page+"&view="+1,

and added the button(btn_view) in controller but I can't make it work ( change the value from 1 to 2)

and added

            $('#btn_view').live('click',{ view: "2" },function(){
            loadData(1);

            });  

after

            $('#go_btn').live('click',function(){
                var pagea = parseInt($('.goto').val());
                var no_of_pages = parseInt($('.total').attr('a'));
                if(pagea != 0 && pagea <= no_of_pages){
                    loadData(pagea);
                }else{
                    alert('Enter a PAGE between 1 and '+no_of_pages);
                    $('.goto').val("").focus();
                    return false;
                }

            });

how to make the button reload the controller and change view value to 2 in load_data.php

share|improve this question
 
I don't see your ajax, but to send data through jQuery .ajax() it is preferably done like this data: { foo: "bar" } api.jquery.com/jQuery.ajax –  Pedro Estrada Dec 4 '13 at 18:46
add comment

1 Answer

up vote 1 down vote accepted

Your structure is wrong for sending the ajax data. I've gone to your link and copied the function from that tutorial, and updated with the view variable being passed into the ajax data properties.

You will pass view in as the second parameter, and loadData will default that to 1 if nothing is passed in.

function loadData(page, view) {

    view = view || 1; // view defaults to 1 if not passed in
    loading_show(); 
    $.ajax({
        type: "POST",
        url: "load_data.php",
        data: {
            page: page,
            view: view
        },
        success: function(msg) {
            $("#container").ajaxComplete(function(event, request, settings){
                loading_hide();
                $("#container").html(msg);
            });
        }
    });

}

So then your view button code looks like this:

$('#btn_view').live('click', function(){
    var view = 2;
    var page = 1;
    loadData(page, view);
});  

I'm not sure what you're doing to determine what page is, but I'm guessing from it being hardcoded into that function as 1 that you'll probably need to copy this code into a function:

function establishPageAndLoadData(view) {
    view = view || null; // use view if passed in...
    var pagea = parseInt($('.goto').val());
    var no_of_pages = parseInt($('.total').attr('a'));
    if(pagea != 0 && pagea <= no_of_pages){
        loadData(pagea, view); // pass view to load function
    } else {
        alert('Enter a PAGE between 1 and '+no_of_pages);
        $('.goto').val("").focus();
        return false;
    }
}

$('#go_btn').live('click',function(){
    establishPageAndLoadData(); // does page under the hood
});

So now you've centralized your code selecting the page variable, you can use it again in your view button. I've added in an optional view variable into that function to to use here:

$('#btn_view').live('click', function(){
    var view = 2;
    establishPageAndLoadData(view); // calculates page under the hood
}); 

I might be barking up the wrong tree here, but here your controller will always get passed two post variables: page and view

share|improve this answer
 
thank you sh much –  user614963 Dec 4 '13 at 21:19
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.