Hi all,

I have a table which holds 130 companies and their related details.
I have done the code to insert the information into the table when new companies come along. But now I need to display the existing information. I am looking at doing it using a form for now, will change over to CSS when I get the hang of it!
My problem is not the display of the information, but I would like to have a few buttons at the bottom of the form which will then go to the next record, previous record, first record, last record (old access style) once the button is clicked.

Can I get some guidance on this please?

Dani AI

Generated

Recommended, practical approach for a non-reloading “Access-style” navigator: use a tiny AJAX endpoint that returns one record as JSON, and have your form update from that data. For ~130 rows either preload everything into JS or fetch per-click; fetching per-click is simple, keeps data fresh, and avoids a heavy initial download. This expands on ’s options and gives a ready-to-implement pattern for .

<?php
// get_company.php - returns one company as JSON (change DSN/credentials)
header('Content-Type: application/json; charset=utf-8');
$pdo = new PDO('mysql:host=localhost;dbname=mydb;charset=utf8mb4','dbuser','dbpass',[PDO::ATTR_ERRMODE=>PDO::ERRMODE_EXCEPTION]);

$dir = $_GET['dir'] ?? null; // 'next','prev','first','last'
$id  = isset($_GET['id']) ? (int)$_GET['id'] : 0;

if ($dir === 'first') {
  $stmt = $pdo->query('SELECT * FROM companies ORDER BY id ASC LIMIT 1');
} elseif ($dir === 'last') {
  $stmt = $pdo->query('SELECT * FROM companies ORDER BY id DESC LIMIT 1');
} elseif ($id && $dir === 'next') {
  $stmt = $pdo->prepare('SELECT * FROM companies WHERE id > ? ORDER BY id ASC LIMIT 1'); $stmt->execute([$id]);
} elseif ($id && $dir === 'prev') {
  $stmt = $pdo->prepare('SELECT * FROM companies WHERE id < ? ORDER BY id DESC LIMIT 1'); $stmt->execute([$id]);
} elseif ($id) {
  $stmt = $pdo->prepare('SELECT * FROM companies WHERE id = ? LIMIT 1'); $stmt->execute([$id]);
} else {
  echo json_encode(null); exit;
}

echo json_encode($stmt->fetch(PDO::FETCH_ASSOC) ?: null);

Client-side, keep it vanilla JS: call that endpoint with id + dir (next/prev/first/last), parse JSON, and populate form fields. Disable nav buttons while loading, handle empty responses (no next/prev), and use textContent or value to avoid injecting HTML. Example pattern:

function loadCompany(params){
  const url = new URL('/get_company.php', location.origin);
  Object.keys(params).forEach(k=>url.searchParams.set(k, params[k]));
  document.querySelectorAll('button.nav').forEach(b=>b.disabled=true);
  fetch(url).then(r=>r.ok? r.json(): Promise.reject(r.statusText))
    .then(data=>{
      if(!data) { /* disable appropriate buttons */ return; }
      document.getElementById('company_id').value = data.id;
      document.getElementById('company_name').value = data.name || '';
    })
    .catch(console.error)
    .finally(()=>document.querySelectorAll('button.nav').forEach(b=>b.disabled=false));
}

Tips/troubleshooting: prefer id-based next/prev queries (shown above) instead of OFFSET to avoid skips when rows are added/deleted; index the column you order by; if you want alphabetical navigation use a composite comparison (WHERE (name, id) > (?,?)) to handle duplicates; add a small server endpoint that returns id/name pairs for a dropdown or autosuggest when the list grows (as suggested). Sanitize outputs, use prepared statements (PDO as above), and provide a non-JS fallback (regular page links) for progressive enhancement.

Recommended Answers

All 6 Replies

Member Avatar for Member #120589

You have a few options - you can load all the info and show/hide with javascript or you can load one at a time using vanilla php or ajax.

This is very similar to "pagination".

Downside with the first method is that it may be slow to load initially as you pile on the number of companies and also new companies inserted by you will not show up (nor will updated info) if the user is in the middle of paging through the list. However, it should be lightning fast in paging through.

The second method needs a round trip to the server with a new SQL query every time you page through. New data if added to the end of the list, should ensure that these are available to the user. However, the time to show a new company will be slower - but if data is simple without too much processing, you may not notice too much (ajax option). If you just use php (no js), then the page will reload on every button click.

Want to avoid the page reloading at every click. Also, I don't see the users going through every single record - they will be sitting there the whole day if they do that!

Maybe the second option will be more suitable. But then again, when I think it through, how about a drop down that when you select a user, a form gets generated and displays that user? That seems like the way forward. Can you help me with that? I imagine it will involve some js?

Member Avatar for Member #120589

A dropdown would certainly be easier, until you get to hundreds of options. Then you may go to an 'initial' paginator maybe or even a ajaxified autocomplete textbox which would display options matching what you type.

If you have a little think about what you want and have a go at some code, we'll certainly help you with it.

thanks your information

Best be prepared for the worst I think.
The autocomplete thing sounds the way to go forward. Will have a look for some code and see how far I get. Will give you a shout when I need to be rescued.

Member Avatar for Member #120589

Sorry I meant autosuggest not autocomplete !

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.