Reverse Engineer an Ajax Post for a Java Post Request

[gw1500se]

I'm trying to automate getting information from a web site that uses Ajax to do a query. I know how to set up a post query in Java but I am not a javascript/ajax expert. I need to figure out what value pairs are being passed back to the ajax request. Here is the HTML segment that I am trying to automate:

<div><a class="btn btn-default updated-events" style="background-color: #ab0634; color: #FFFFFF;">Recently Updated Events</a></div><br /><br /><div class="form-group "><input type="hidden" name="org_id" value="KCBA" class=""  id="org_id"   /></div><div class="panel panel-default"><div class="panel-heading"><div style="font-weight: bold;">Choose Search Options:</div></div><div class="panel-body"><div class="row"><div class="col-md-3"><div class="form-group "><label>Begin Date</label><input type="text" name="evr_begin" value="2/1/2019" class="form-control datepicker force_enter"  id="evr_begin"   /></div></div><div class="col-md-3"><div class="form-group "><label>End Date</label><input type="text" name="evr_end" value="2/28/2019" class="form-control datepicker force_enter"  id="evr_end"   /></div></div><div class="col-md-6"><div class="form-group"><label>Event Type</label><br /><select name="evr_type" class="form-control" id="evr_type"><option value="">Show All</option><option value="274"  >Backyard BBQ Contest</option><option value="271"  >Certified BBQ Judge Class</option><option value="315"  >Certified Kosher BBQ Judge Class</option><option value="279"  >Competitor Series BBQ Contest</option><option value="305"  >Cooking Class</option><option value="282"  >Grilling Contest</option><option value="316"  >International</option><option value="280"  >Judging</option><option value="275"  >Kids Q BBQ Contest</option><option value="278"  >Kosher BBQ Contest</option><option value="269"  selected  >Master Series BBQ Contest</option><option value="276"  >Steak Cookoff</option><option value="314"  >Table Captain Class</option></select></div></div></div><div class="row"><div class="col-md-12"><div class="form-group "><label>Event Name Keyword</label><input type="text" name="evr_keyword" value="" class="form-control force_enter"  id="evr_keyword"   /></div><div class="form-group "><div class="checkbox-left"><input type="radio" class="checkbox-control evr_map_type"   name="evr_map_type" value="2"  checked  /></div><div class="checkbox-right"><label>Search Worldwide</label></div><div style="clear: both;"></div><div class="checkbox-left"><input type="radio" class="checkbox-control evr_map_type"   name="evr_map_type" value="0"  /></div><div class="checkbox-right"><label>Search By Radius</label></div><div style="clear: both;"></div><div class="checkbox-left"><input type="radio" class="checkbox-control evr_map_type"   name="evr_map_type" value="1"  /></div><div class="checkbox-right"><label>Search By Region (City, State, or Country)</label></div><div style="clear: both;"></div></div></div></div><div class="row"><div class="by_radius" style="display: none;"><div class="col-md-6"><div class="form-group "><label>Enter Zip Code, City, or Address to search by</label><input type="text" name="evr_address" value="" class="form-control force_enter"  id="evr_address"   /></div></div><div class="col-md-3"><div class="form-group "><label>Radius (in miles)</label><input type="text" name="evr_radius" value="50" class="form-control force_enter"  id="evr_radius"   /></div></div></div><div class="by_region" style="display: none;"><div class="col-md-6"><div class="form-group "><label>Enter Region Name</label><input type="text" name="evr_region" value="" class="form-control force_enter"  id="evr_region"   /></div><div id="region_error" style="color:#f00"></div></div><div class="col-md-3"><div class="form-group "><div class="checkbox-left"><input type="radio" class="checkbox-control "  id="evr_region_type"   name="evr_region_type" value="0"  /></div><div class="checkbox-right"><label>City</label></div><div style="clear: both;"></div><div class="checkbox-left"><input type="radio" class="checkbox-control "  id="evr_region_type"   name="evr_region_type" value="1"  checked  /></div><div class="checkbox-right"><label>State</label></div><div style="clear: both;"></div><div class="checkbox-left"><input type="radio" class="checkbox-control "  id="evr_region_type"   name="evr_region_type" value="2"  /></div><div class="checkbox-right"><label>Country</label></div><div style="clear: both;"></div></div></div></div><div class="col-md-3"></div></div><div class="row"><div class="col-md-12" style="text-align: right;"><br /><a class="actionBtn evr_search" style="font-size: 18px;">Search</a></div></div></div></div><br /><br /><div class="row" id="map-container"><div class="col-md-8"><div id="map_canvas"></div></div><div class="col-md-4"><div id="evr_search_results"></div></div></div><div id="updated-events-container" style="display: none;"></div><div id="search_dialog" style="max-width: 1000px;"></div>		</div>
		<script type="text/javascript">
			function ApplyStyles(){
				$('.actionBtn').button();
				$('.chzn-select').chosen();
				$('.chzn-select-deselect').chosen({allow_single_deselect: true});
				$('.select2').select2();
				$('.buttonset, .radios').buttonset();
				$('.datepicker').datepicker();
				$('.datetimepicker').datetimepicker();
				$('.styled_text').addClass('ui-state-default ui-combobox-input ui-autocomplete-input ui-widget ui-widget-content ui-corner-all');
				$('.ttip, .VICON').tooltip();
			}
			$(function(){
				ApplyStyles();
				$(document).ajaxComplete(function(){
					setTimeout(function(){
						ApplyStyles();
					}, 50);
				});
			});
		</script>

I think the ApplyStyles function is extracting the data from the form but I don't know how to determine the names of the parameters and to which values they correspond. Can someone help me reverse engineer this? TIA.

Let me know if anything else needs to be provided from the HTML source.

[requinix]

There's no AJAX in there.

Use your browser to watch the AJAX request and see what fields it submits.

[gw1500se]

Thanks for the reply. I assumed this was an Ajax call:

$(document).ajaxComplete

I'm using Firefox. Is watching AJAX a plug-in? I don't know how to do that. I didn't even know that was possible.

Update: I think I found what you were referencing in developer tools under network. I'll need to study it to figure out what it is telling me.

Edited February 10, 2019 by gw1500se

[gw1500se]

Quick, semi-related followup question. Is this a JSON response?

{"0":{"ev_reg_id":33489,"org_id":"KCBA","evr_cat_id":"269*275*280","name":"Humble Rodeo and BBQ ","evr_name_url":"","description":"<p><strong><em> ...

 

[kicken]

Yes, it appears to be.

[requinix]

6 hours ago, gw1500se said:

Thanks for the reply. I assumed this was an Ajax call:

$(document).ajaxComplete

 

That is code that runs after the call.