Search jQuery

jQuery Forum

Can someone explain this code please

in Using jQuery Plugins • 8 years ago

This is a followup to my last post.

https://forum.jquery.com/topic/tablesorter-and-tablesorterpager-how-to-reload-tablesorter-table-after-using-drop-down-values-to-run-new-query

If either is answered I will end the other.

As a jQuery/Ajax/tablesorter novice, I was hoping someone could explain what this code is actually doing (rather than me continuing to go on my assumptions). It seems to me, if I am seeing this correctly, that the developer began with too much happening.

I see the following happening:

1 - The campaign_array is getting loaded

2 - The $.ajax call on line 10 is happening

3 - The call to get _campaign_summary works, and the desired information is returned

4 - I can see the info required for the table in data through the console log - line 16

5 - Lines 17-19 seem to be calling get_campaign_summary again. This time the campaign_array parameter is empty so, as it should, my page does not show the table. (I can see this in a log file I write to in get_campaign_summary)

So, if what he wants is for the table to reload with the data retrieved by get_campaign_summary, what needs to come out (an assumption because of the two calls to get_campaign_summary) and what needs to change?

$("form").on("submit", function(e){
e.preventDefault();
campaign_array = multi_list.campaign_list.multiselect("getChecked").map(function(){
return this.value;
}).get();
console.log('Campaign Array: ', campaign_array);
var ajaxObj = $.ajax({
url : VALIDATION_URL + '?operation=get_campaign_summary&campaign_array=' + campaign_array,
type : $(this).attr('method'),
dataType: 'json',
data : $(this).serialize(),
success : function( data,html ) {
console.log('Submitted: ', data);
campaign_summary.table
.html(html)
.trigger("updateAll",[resort]);
},
error : function( data, xhr, err ) {
console.log('Oops: ', data, xhr , err);
}
});
console.log('ajaxObj: ', ajaxObj);
return false;
});

Replies(5)

watusiware

Re: Can someone explain this code please

8 years ago

Are you a non-coding manger trying to read code and second-guess? You should discuss the code with your developer and have them explain it to you, then.

Numbers below are from your 1-5 list:

3. Please do not refer to this as a "call". A "call" means, typically, a function or method call. This is an "Ajax request" to your server. Not a "call".

5. It probably does not do what you think it does, and I don't know why you think that.

But I have no idea what this code does, because it uses an object - campaign_summary - that you have not included in your post. I have no idea what campaign_summary contains, where it came from, or what that code does. It appears it is updating a table on your page, though.

(I can see this in a log file I write to in get_campaign_summary

You are referring-to a log file on your server? So, get_campaign_summary some function in your server code? This is irrelevant to jQuery.

because of the two calls to get_campaign_summary

There aren't any calls to get_campaign_summary . jQuery cannot call your server code. There is one Ajax request in the code that you posted.

rpereira

Re: Can someone explain this code please

8 years ago

watusiware,

sorry if I offended you somehow. I am not a non-coding manager,and the developer who wrote this is no longer here for me to talk with. I am a developer who is very new to jquery, ajax and the tablesorter plugin and I am trying my best to sort through quite a bit of code that does not seem to be working. I know it would be best to sit with someone and walk the code, but there is nobody else. At this time I am the only developer, and I need help.

I apologize for referring to an ajax request as a call, it was not a mistake of ignorance, rather of typing without full consideration in my haste to ask for help. I do realize that it is making an ajax request.

There is no campaign_summary object. The previous developer created campaign_summary.table this way:

campaign_summary.table = $('#campaignTable');

campaignTable is the id of the html table which gets instantiated with both .tablesorter and .tablesorterPager (the code below references a function (rows_to_array) not shown here - it just formats the data into an array for the tablesorterPager

campaign_summary.table.tablesorter({
theme: 'blue',
widthFixed: true,
sortLocaleCompare: true,
widgets: ['zebra'],
sortList: [ [0,1] ],
headers: {
'.pager' : {
sorter: false
},
'.no_sort' : {
sorter: false
}
}
});
/*Apply the pager to the summary table, also provides AJAX calls */
campaign_summary.table.tablesorterPager({
container: $("#campaignTable .pager"),
removeRows: false,
cssGoto: '.gotoPage',
ajaxUrl: VALIDATION_URL + '?operation=get_campaign_summary&page={page}&size={size}&{sortList:column}',
customAjaxUrl: function(table, url) {
$(table).trigger('changingUrl',url);
return url;
},
ajaxObject: {
dataType: 'json'
},
ajaxProcessing: function(data) {
// Code to handle data recieved from database
if(!data){return;} //if nothing recieved exit
total = data.total;
if(total < 1){
campaign_summary.body.empty();
}
// console.log('Data: ', data);
// console.log('Data Row: ', data.rows);
rows = rows_to_array(data.rows);
headers = $.makeArray(data.headers);
headers.push(''); //end of array
return [total, rows, headers]; //Required return for pager to function
}
});

There is a file that handles all requests via a switch statement. I should have been more clear in my post. This line:

url : VALIDATION_URL + '?operation=get_campaign_summary&campaign_array=' + campaign_array,

sets the url to that file with 2 parameters. The, operation=get_campaign_summary is the case checked by the switch. That case actually calls a mysql function, also named get_campaign_summary, which takes campaign_array as a parameter.

Here is the section of code for that:

if ($_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest'):
$request = (object) array_map(NULL, $_GET);
$response = array();
switch ($request->operation):
< Other cases code removed >
case 'get_campaign_summary':
log_message(log_var_dump($request));
$campaign_array = explode(',',$request->campaign_array); // creates an array from the comma delimited string
$response = get_campaign_summary($campaign_array,$request->filter,$request->column,$request->page,$request->size,false,false);
log_message("RESPONSE: " . print_r($response,true));
< additional cases code removed >
endswitch;
echo json_encode($response);
exit(0);
else:
echo 'Direct access not allowed.';
endif;

I can see in both the console.log and a log file written to by the log_message function, that the get_campaign_summary function and the request do get the needed data in $response

I can also see in the log file that when I comment the following lines out of the request

campaign_summary.table
.html(html)
.trigger("updateAll",[resort]);

the log ends showing the contents of $response from this log_message call on line 15 direclty above

log_message("RESPONSE: " . print_r($response,true));

and the console.log shows the contents of data from this call on line 16 in my original post

console.log('Submitted: ', data);

When I put the commented lines back in, I can see the contents of $response and then more log messages from the mysql function showing it was called again with campaign_array either empty or null.

This is from the log file:

RESPONSE: Array
(
[total] => 0
[rows] => Array
(
[0] => Array
(
[error] => Please Select One or More Campaigns
)
)
)

watusiware

Re: Can someone explain this code please

8 years ago

No offense taken! I was reading-in to your statement that "the developer began with too much happening"...

OK, so you're stuck with some code that you don't fully understand, and, unfortunately, you can't get help from the author. Understood.

There is no campaign_summary object. The previous developer created campaign_summary.table this way:

campaign_summary.table = $('#campaignTable');

campaign_summary , as shown in the code above IS an object. This code adds or updates an object member, "table".

I assume you've omitted some code that initializes campaign_summary, e.g.:

var campaign_summary = {};

The code most likely is using this object as an associative array:

http://www.quirksmode.org/js/associative.html

Posting server code here isn't of much use, since it's a forum about jQuery, and there are way too many server languages to deal with them all. I can't tell what language you use on your server. It looks a bit like javascript. Part of it looks like PHP. I can't guess.

You seem to have some evidence from your server logs that suggests that you are getting multiple Ajax requests, is that correct? Did you use your browser's inspection tools to see if, in fact, the browser actually IS sending multiple (or two) Ajax requests?

I suspect a server coding error.