Jump to content

Table update with Ajax


rushy
 Share

Recommended Posts

I have a table in my template that I  would like to update using Ajax when a button is pressed. I am not sure how to go about this and hope somebody here could point me in the right direction. Here is my code for the table output. You can see I loop through the fields to output using a hard wired selector to list the retailer type. I have a button for Supermarkets that fires a js handler myFunc and I need to put the ajax there to call this page again with a param so I can then form the selector for supermarkets and update the table. When I get this working and understand how to do it in ajax I will code up a selector that is formed dependant on a bank of buttons and the table will update without the rest of the page - like magic! That's what ajax is for right?!

Thanks for any help - Paul

    <button type="button" onclick="myFunc()" value="1" class="btn btn-primary">Supermarkets</button>
		<div class= "table-responsive">
			<table class="table table-hover table-striped">
				 <thead>
					 <tr>
							 <th>Retailer</th>
							 <th>No. bags issued</th>
							 <th>Gross proceeds £</th>
							 <th>Net proceeds £</th>
							 <th>Other use of net proceeds</th>
							 <th>Amount donated £</th>		    
							 <th>Good causes in receipt of proceed</th>
							 <th>No. of paper bags issued</th>
							 <th>No. of bags for life</th>
					 </tr>
				 </thead>
				 <tbody>
				 <?php
						 $pg = $pages->get("/single-use-carrier-bags/");
						 $retailer = $pg->find("category=DIY, sort=title, include=all");
						foreach ($retailer as $r)
						{ 
							 echo "<tr>
							 <td><a href= '$r->url'>$r->title</a></td>
							 <td>".numFormat($r->no_bags_issued)."</td>
							 <td>".numFormat($r->gross_proceeds)."</td>
							 <td>".numFormat($r->net_proceeds)."</td>
							 <td>$r->other_use_net_proceeds</td>
							 <td>".numFormat($r->amount_donated)."</td>		                                           						 
							 <td>$r->good_causes_in_receipt</td>
							 <td>".numFormat($r->no_paper_bags_issued)."</td>
							 <td>".numFormat($r->no_bags_for_life)."</td>
							 </tr>";
						 }
				?>
				</tbody>
			</table>	      
		</div>
	 </div>   
	</div>

<script type="text/javascript">
function myFunc() {
	
}
</script>

 

Link to comment
Share on other sites

Hi Paul,

lets try to get started with a basic flow.

 

Create a file called mytable.php in the root directory (along side the index.php file) and paste the following code :

  Reveal hidden contents

 

Then In your template file put the following code :

  Reveal hidden contents

 

Hope it get you started.

 

  • Like 2
Link to comment
Share on other sites

Thank you very much for taking the time to do this! That looks just what I need to point me in the right direction, at least I now have some hope I am starting off in the right direction. I will let you know how I get on and if I get stuck on some aspect of this I will probably be bothering you again... ! 

Regards - Paul

  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...