AJAX Won't Fire

Ok we are getting there, but i can't get the datatable to work.  The page in question is here:
here

I know the datatable page is configured correctly because I get the data if I pass the series id, gender, and category directly to it.  See here
Bob SchneiderCo-OwnerAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

GaryCommented:
You are not calling the getData function anywhere.
0
leakim971PluritechnicianCommented:
To start look you are not calling the getData function on change :
<script type="text/javascript">
    $(document).ready(function () {
        var categories = 0;
        var gender = '';

        $('#categories,#gender').on('change', function () {
            categories = $("#categories").val();
            gender = $('#gender').val();
            getData(6, categories, gender)
        });


        function getData(series, categories, gender) {
            $('#standings').dataTable({
                'ajax': '/series/results_array-new.asp?series_id=' + series  + '&gender=' + gender + '&age_to=' + categories
            });
        }
    });
</script>

Open in new window

0
Bob SchneiderCo-OwnerAuthor Commented:
That worked.  Thanks.  But now when I change a value I get a datatable error "Cannot reinitialize datatable."  I will look into that but please let me know if there is something that jumps out at you on that.
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

leakim971PluritechnicianCommented:
<script type="text/javascript">
    $(document).ready(function () {
        var categories = 0;
        var gender = '';

        $('#categories,#gender').on('change', function () {
            categories = $("#categories").val();
            gender = $('#gender').val();
            getData(6, categories, gender)
        });
var dt = null;

        function getData(series, categories, gender) {
var url = '/series/results_array-new.asp?series_id=' + series  + '&gender=' + gender + '&age_to=' + categories;
if(dt) {
    dt.ajax.url(url).reload(); // http://datatables.net/reference/api/ajax.reload()
    return;
}
            dt = $('#standings').dataTable({ 'ajax': url });
        }
    });
</script>

Open in new window

0
Bob SchneiderCo-OwnerAuthor Commented:
Thanks.  I don't get an error now but it doesn't update either.  Note that I am using an asp variable for series in this format: <%=leriesID%>.  Is that a problem?
0
Bob SchneiderCo-OwnerAuthor Commented:
getData(<%=lSeriesID%>, categories, gender)
0
leakim971PluritechnicianCommented:
where to see the page in live?
0
Bob SchneiderCo-OwnerAuthor Commented:
0
leakim971PluritechnicianCommented:
I don't see that anywhere : getData(<%=lSeriesID%>, categories, gender)
0
Bob SchneiderCo-OwnerAuthor Commented:
I have been tinkering and I changed my approach to try to avoid that.  Is mixing asp variables with javascript/ajax considered good practice or not good practice?
0
leakim971PluritechnicianCommented:
I don't like it. But if it fill your needs...
0
Bob SchneiderCo-OwnerAuthor Commented:
I have reworked it to avoid that.  Page opens and loads once but then does not load when I make other changes in the selects.  No errors.  Any ideas?
0
Big MontySenior Web Developer / CEO of ExchangeTree.org Commented:
I have been tinkering and I changed my approach to try to avoid that.  Is mixing asp variables with javascript/ajax considered good practice or not good practice?

there is ABSOLUTELY nothing wrong with this, and is a common practice. i do it all the time in my apps.

clicking on your test page, it is now loading the data once, but when I try to load it again, I get the following javascript error on line 43:

"Cannot read property 'url' of undefined"

after where you build the url variable, try putting in an alert(url); right afterwards and see if it's being built properly
0
Bob SchneiderCo-OwnerAuthor Commented:
I did that and it appears it is being built properly.
0
Big MontySenior Web Developer / CEO of ExchangeTree.org Commented:
i think you need to reinitialize your dt variable before calling it again. The error is saying the URL property of an undefined object is not valid
0
Bob SchneiderCo-OwnerAuthor Commented:
I've tried putting it in a couple of places and  got a datatable error "Cannot reinitialize...".  Can you show me where to  reinitialize it please?

<script type="text/javascript">
     $(document).ready(function () {
        var categories = 0;
        var gender = '';
        var series = 0;

        $('#series,#categories,#gender').on('change', function () {
            categories = $('#categories').val();
            gender = $('#gender').val();
            series = $('#series').val();
            getData(series, categories, gender)
        });
 
        var dt = null;

        function getData(series, categories, gender) {
            var url = '/series/results_array-new.asp?series_id=' + series + '&gender=' + gender + '&age_to=' + categories;

            if(dt) {
                dt.ajax.url(url).reload(); // http://datatables.net/reference/api/ajax.reload()
                return;
            }
            dt = $('#standings').dataTable({ 'ajax': url });
       }
    });
</script>

Open in new window

0
Big MontySenior Web Developer / CEO of ExchangeTree.org Commented:
try this:

        var dt = null;

        function getData(series, categories, gender) {
            var url = '/series/results_array-new.asp?series_id=' + series + '&gender=' + gender + '&age_to=' + categories;
            dt = $('#standings').dataTable();

            if(dt) {
                dt.ajax.url(url).reload(); // http://datatables.net/reference/api/ajax.reload()
                return;
            }
            dt = $('#standings').dataTable({ 'ajax': url });
       }

Open in new window

0
leakim971PluritechnicianCommented:
Check this :

<script type="text/javascript">
     $(document).ready(function () {
        var categories = 0;
        var gender = '';
        var series = 0;

        $('#series,#categories,#gender').on('change', function () {
            categories = $('#categories').val();
            gender = $('#gender').val();
            series = $('#series').val();
            getData(series, categories, gender)
        });
 
        var dt = null;

       function getData(series, categories, gender)  {
            var url = '/series/results_array-new.asp?series_id=' + series + '&gender=' + gender + '&age_to=' + categories;
            if(dt) { 
                dt.fnSettings().sAjaxSource = url;
                dt.dataTable().fnDraw();
            }
            else {
                var settings = {
                    bServerSide:true, 
                    sAjaxSource:url, 
                    pagingType: "full_numbers", 
                    fnServerData: function(src, data, cb) {
                           $.post(src, data, cb, "json");
                    }
              };
              dt = $('#standings').dataTable(settings);
            }
       };       

    });
</script>

Open in new window


For your next question, check here : http://datatables.net/forums/discussion/291/pagination-totals-and-bserverside

DataTables expects to receive a JSON object with this following properties:

iTotalRecords - Total records, after filtering (not just the records on this page, all of them)
iTotalDisplayRecords - Total records, before filtering
aaData - The data in a 2D array
sColumns - column names - optional

So iTotalRecords and iTotalDisplayRecords are the ones you want I think.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Bob SchneiderCo-OwnerAuthor Commented:
Wow!  Thank you very much.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
AJAX

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.