How to change the value in an API?

[leands]

Good day, I’m a total newbie when it come to this so I’m working on some of my project a JobSearch website and the search function using API(CareerJet API Public), I’ve already connected to the API and get the results but the only problem is when the results are too many they come in pages, I would like to know how to change the $page in my code so that it can traverse to the next page by using two button mainly the ‘Prev and Next’ buttons. I’ve tried making this basic paging code to traverse and change the value of the $page

 

if( $page > 1 ){
   if(isset($_POST['prev'])) {
       $page = $page - 1; 
  }
}
if ( $page < $result->pages ){
  if(isset($_POST['next'])) {
       $page = $page + 1;
  }
}

the thought process of this is that when I click the Next button it would increment and should replace the $page = 1 to $page = 2 and load to proceed to next page of the call.
Now I’m stuck on what to do, any help is greatly appreciated. Thank you so much if you’ve help me understand!

This is my code and here is the API

Full files of my project

Edited December 4, 2021 by leands

[requinix]

The concept is called "pagination". For most people that has to do with database queries, but with your API calls it's still very similar in execution.

You need to get the desired page number from the form; if you want Prev and Next buttons then you could include the page number in the form and know which button means -1 or +1, but easier would be to make the buttons have the actual page number as their values.

Processing the form to get the page number has to happen before you use the API, of course. Your $page > 1 and $page < $result->pages checks are good for deciding whether to show the Prev and Next buttons, but since you need the page number before you use the API, you can't use the results of that API call to decide what to do.

My suggestion is:

1. Get the $page from the form data (if it is >=1) or use 1 if there wasn't a valid number given
2. Call the API with the page number
3. Show the results like normal
4. In the form, if $page > 1 then show the Prev button, and if $page < number of pages then show the Next button
5. For the two buttons, give them a name of "page" and a value of $page - 1/$page + 1 appropriately: when someone clicks either button then that will submit a "page" in the form data for your code to use

[leands]

Thank you so much for the suggestions, I've been stuck in this part since last week. I'm very new to PHP coding and this will help me a lot.

[requinix]

If you have further questions, please reply in this thread instead of reaching out over private message.

<?php
if (isset($_GET['page']) {
  $page = $_GET['page'];
} else {
  $page = 1;
}
?>

$_GET is only used for values that go into the URL. They're easy to spot. Your form is using the POST method (which I would say is correct) so all values send that way must be accessed through $_POST.

Try fixing that. If it's still not working then post (not link, please) the full code you have now with a detailed description of what you expected it to do and what it's actually doing instead.

[leands]

I've tried changing it to $_POST and still it did not work, maybe the problem is that it didn't get the $page when I click the button to submit that should have return null so that It would set the $page=1 and also I dont know what to put in the button value to increment and decrement them.

I expected it that when I press the search button it should set the $page = 1 and when I press the next button it should set the $page=2 and vice versa but instead I only get the first page of the result I get from the API

Here is my full code

<?php 

session_start();
error_reporting(0);

require_once "Careerjet_API.php";

$cjapi = new Careerjet_API('en_PH');
$api = new Careerjet_API('en_PH') ;

if (isset($_POST['page'])) {
    $page = $_POST['page'];
  } else {
    $page = 1;
}# Or from parameters.

$output = '';
$thead = '';

if(isset($_POST['key_search'])) {
  $searchq = $_POST['key_search'];
  $searchw = $_POST['location'];

$result = $api->search(array(
  'keywords' => $searchq,
  'location' => $searchw,
  'page' => $page ,
  'affid' => '678bdee048',
  'pagesize' => 6,
));

if ( $result->type == 'JOBS' ){
  echo "Found ".$result->hits." jobs" ;
  echo " on ".$result->pages." pages\n" ;
  $jobs = $result->jobs;

  if($jobs == false) {
    $thead = '<div class="card">
    <h1 class="card-body">No results found</h1>
    <p class="mb-2">No results found. Please modify your search.</p>
  </div>';
  } else {
    foreach( $jobs as $job ) {
      $output .= ' <tbody>
              <tr scope="row" align="center">
                        <td>'.$job->title.'</td>
                        <td width="150px">'.$job->locations.'</td>
                        <td align = "center">'.$job->company.'</td>
                         <td align = "center" width="150px">'.$job->salary.'</td>
                        <td><small class="d-block" >'.$job->description.'</small></td>
                        <td width="20px"><a href="'.$job->url.'">APPLY NOW</a></td>
              </tr>
              </tbody> ';
      $thead = ' 
              <div class="table-responsive1">
                <table class="table table-striped table-dark table-striped">
                  <thead>
                    <tr align = "center">
                      <th scope="col">Hiring</th>
                      <th scope="col">Location</th>
                      <th scope="col">Company</th>
                      <th scope="col">Salary</th>
                      <th scope="col">Description</th>
                      <th scope="col"></th>
                    </tr>
                  </thead>
                  '.$output.'
                </table>
              </div>
            </div>';
    }
  }

  echo "You are on page $page\n" ;

}
# When location is ambiguous
if ( $result->type == 'LOCATIONS' ){
  $locations = $result->solveLocations ;
  foreach ( $locations as $loc ){
    echo $loc->name."\n" ; # For end user display
    ## Use $loc->location_id when making next search call
    ## as 'location_id' parameter
  }
}
}

?>

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>JobSite</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <link rel="stylesheet"   type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"/>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
  <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
  
  <style>
  .table td {
    text-align: center; 
}
    @media (min-width: 1200px) {
        .container{
            max-width: 1500px;
    }
}
</style>

</head>
  <body class="bg-image" style="background-image: url('https://images.wallpapersden.com/image/wxl-los-angeles-panorama_71443.jpg'); height: 100vh; background-repeat: repeat-y;">

   <br>
   <br>

<div class="container">
  <div class="row">
    <div class="col-lg-6 offset-lg">
      <form method = "POST">
          <div class="input-group" id="adv-search">
              <!-- this is for searching using your prefered job -->
            <input type="text" class="form-control form-control-search" style="margin-right:20px;" name="key_search" placeholder="Search for your job." />
             <!-- this is for searching using your desired location -->
            <input type="text" class="form-control form-control-search" style="margin-right:5px;" name="location" placeholder="Insert Location" />
            <!-- this should be the button that set the $page to null so when the $_POST catch it would be equals to 1, this is the button to search -->
            <button type="submit" name= "page" class="btn btn-primary" value ="<?php $page= ''; ?>"><span class="fa fa-search" aria-hidden="true"></span></button>
      </div>
    </div>
    </form>
  </div>
</div>
<br>
<br>
  <div class="container">
  <div align ="center">
  <form method='get'>;

   <!-- this prints the table of results and the next and prev button-->
<?php 
    print("$thead");
    #i dont know how to increment and decrement inside the value
    echo "<button type='submit' name= 'page' value = '' class='btn btn-primary'>PREV</button>";
    echo "<button type='submit' name= 'page' value = '' class='btn btn-primary'>NEXT</button>";
?>
  </form>
</div>
</div>
</body>   
</html>

I'm very sorry for messaging you directly instead in here, please any examples is greatly appreciated Thank you!

[requinix]

#i dont know how to increment and decrement inside the value
echo "<button type='submit' name= 'page' value = '' class='btn btn-primary'>PREV</button>";
echo "<button type='submit' name= 'page' value = '' class='btn btn-primary'>NEXT</button>";

You might be overthinking this. It's true that you can't change the $page variable inside the string, which isn't exactly what you should be doing anyways, but you can do things outside the string. See what you can come up with along those lines.

Also don't forget that you still need the two if checks you had before for when the $page is >1 or <the page count.

[leands]

So do I need to make a PHP code outside the inputs? like this
 

<form method="post">
<?php

if ($page > 1) {
	$page = $page - $_POST['page']; } 
if  ($page < $result->pages) { 
    $page = $page + $_POST['page'];
}
?>

<button type="submit" name="page" value = "$_POST['page']" class='btn btn-primary'>PREV</button>
<button type="submit" name="page" value = "$_POST['page']" class='btn btn-primary'>NEXT</button>

</form>

I don't know if this is right in my mind

[requinix]

Stop throwing code at it with the hope that everything will start working and instead spend a minute thinking about what it is you're doing. It's a far more efficient method for solving problems.

You've decided that $_POST has the page number of the results you want, and you put that value into $page. If you want to change page numbers then you need to include in the form data a new value for "page".
The two buttons for previous and next are the things that the user will interact with, and they can each contain whatever new value it takes to make their actions happen. The previous button should use the previous page number and the next button should use the next page number - that would be $page-1 and $page+1 respectively, right?

So you need to put the $page-1 and $page+1 numbers into the two buttons' values.

We can worry about accidentally browsing to page 0 after that.

Edited December 7, 2021 by requinix
something weird happened to the post contents

[leands]

I finally made it work, thank you so much for suggestions and help, apparently my mistake is that I'm using $_POST not $_GET, so when I go to the next page the $page value disappear so you can't  increment/decrement it anymore

if (isset($_GET['page'])) {
  if ($_GET['page'] != false) {
    $page = $_GET['page'];
  } else {
  $page = 1; }
}

 

[requinix]

...no? Or did you change how the form works? Because everything so far has been with POST.

[leands]

I just change the form method to GET because all the values disappear when I click the Next button. On the first page it works fine then when I go to the next page it says undefine variables and index.

<?php 

session_start();
error_reporting(0);
require_once "Careerjet_API.php";

$cjapi = new Careerjet_API('en_PH');
$api = new Careerjet_API('en_PH') ;
$tab = $nbsp;
#this should get the current page and resets if you press the main button
if (isset($_GET['page'])) {
  if ($_GET['page'] != false) {
    $page = $_GET['page'];
  } else {
  $page = 1; }
}


# Or from parameters.

$output = '';
$thead = '';

$searchq = $_GET['key_search'];
$searchw = $_GET['location'];
$sort = $_GET['sort'];
$contracttype = $_GET['contracttype'];
$contractperiod = $_GET['contractperiod'];

$result = $api->search(array(
  'keywords' => $searchq,
  'location' => $searchw,
  'page' => $page ,
  'affid' => '678bdee048',
  'pagesize' => 6,
  'sort' => $sort,
  'contracttype' => $contracttype,
  'contractperiod' => $contractperiod,
));


if ( $result->type == 'JOBS' ){
  $jobs = $result->jobs;

  if($jobs == false) {
    $thead = '<div class="card">
    <h1 class="card-body">No results found</h1>
    <p class="mb-2">No results found. Please modify your search.</p>
  </div>';
  } else {
    foreach( $jobs as $job ) {
      $output .= ' <tbody>
              <tr scope="row" align="center">
                        <td>'.$job->title.'</td>
                        <td width="150px">'.$job->locations.'</td>
                        <td align = "center">'.$job->company.'</td>
                         <td align = "center" width="150px">'.$job->salary.'</td>
                        <td><small class="d-block" >'.$job->description.'</small></td>
                        <td align = "center">'.$job->date.'</td>
                        <td width="20px"><a href="'.$job->url.'">APPLY NOW</a></td>
              </tr>
              </tbody> ';
      $thead = ' 
              <div class="table-responsive1">
                <table class="table table-striped table-dark table-striped">
                  <thead>
                    <tr align = "center">
                      <th scope="col">Hiring</th>
                      <th scope="col">Location</th>
                      <th scope="col">Company</th>
                      <th scope="col">Salary</th>
                      <th scope="col">Description</th>
                      <th scope="col">Date Posted</th>
                      <th scope="col"></th>
                    </tr>
                  </thead>
                  '.$output.'
                </table>
              </div>
            </div>';
    }
  }

}
# When location is ambiguous
if ( $result->type == 'LOCATIONS' ){
  $locations = $result->solveLocations ;
  foreach ( $locations as $loc ){
    echo $loc->name."\n" ; # For end user display
    ## Use $loc->location_id when making next search call
    ## as 'location_id' parameter
  }
}

if ($contracttype == 'p') {
  $contractname = "Permanent"; }
if ($contracttype == 'c') {
    $contractname = "Contract"; }
if ($contracttype == 't') {
    $contractname = "Temporary"; }
if ($contracttype == 'i') {
    $contractname = "Training"; }
if ($contracttype == 'v') {
    $contractname = "Voulountary"; }

    if ($contractperiod == 'f') {
      $contractnameP = "Full Time"; }
    if ($contractperiod == 'p') {
        $contractnameP = "Part Time"; }

?>

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>JobSite || Home</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet"  type="text/css" href="new.css">
  <link rel="icon" href="https://www.nicepng.com/png/full/248-2487394_magnifying-glass-vector-magnifying-glass-icon.png">
   <link rel="stylesheet"   type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"/>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
  <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
  <style>
  .table td {
text-align: center;
}
@media (min-width: 1200px) {
    .container{
        max-width: 1500px;
    }
}

</style>

</head>
  <body class="bg-image" style="background-image: url('bgwallpaper.jpg'); height: 100vh; background-repeat: repeat-y;">

<!-- Header -->
<nav>
     <div class="logo"><a href="searchbar.php">JOBsite</a></div>
      <label for="btn" class="icon">
      <span class="fas fa-bars"></span>
    </label>
    <input type="checkbox" id="btn"> 
     <ul>
       <li><a href="#">About</a></li>
       <li>
         <a href="#">Services</a>
         <ul>
           <li><a href="#">Interview tips</a></li>
           <li><a href="#">Job Strategy</a></li>
           <li><a href="#">Pandemic advice</a></li>
           <li><a href="#">Career management</a></li>
         </ul>
       </li>
       <li>
         <a href="#">Features</a>
         <ul>
           <li><a href="#">Resume</a></li>
           <li><a href="#">Employer</a></li>
         </ul>
       </li>
       <li>
         <a href="#">Contacts</a>
         <ul>
           <li><a href="#">Inquiry</a></li>
           <li><a href="#">DOLE</a></li>
           <li><a href="#">JobSITE</a></li>
         </ul>
       </li>
       <li>
          <?php if($_SESSION['username'])
          echo '<a href="logout.php">Logout</a></li>';
          else{
        echo '<li><a href="login.php">Login/Register</a></li>'; }
            ?>
        </li>
     </ul>
   </nav>

   <br>
   <br>

<div class="container">
  <div class="row">
    <div class="col-lg-8 offset-lg">
      <form action = "searchbar-result.php" method = "GET">
        <h3 class="text-center text-light">Find Better. Faster with JobSearch</h3>
          <div class="input-group" id="adv-search">
            <input type="text" class="form-control form-control-search" style="margin-right:5px;" name="key_search" placeholder="Search for your job." />
            <input type="text" class="form-control form-control-search" style="margin-right:5px;" name="location" placeholder="Insert Location" />
            <div class="dropdown">
                  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                      Sort by?
                  </button>
                <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                    <label for="relevance" class="dropdown-item">Relevance</label>
                    <input type="radio" id="relevance" name="sort" value="relevance">
                    <label for="salary" class="dropdown-item">Salary</label>
                    <input type="radio" id="salary" name="sort" value="salary">
                    <label for="date" class="dropdown-item">Date</label>
                    <input type="radio" id="date" name="sort" value="date">
               </div>
            </div>
            <div class="dropdown" style="margin-left: 5px">
                  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                      Contract Type?
                  </button>
                <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                    <label for="Permanent" class="dropdown-item">Permanent</label>
                      <input type="radio" id="Permanent" name="contracttype" value="p">
                    <label for="Contract" class="dropdown-item">Contract</label>
                      <input type="radio" id="Contract" name="contracttype" value="c">
                    <label for="Temporary" class="dropdown-item">Temporary</label>
                      <input type="radio" id="Temporary" name="contracttype" value="t">
                    <label for="Training" class="dropdown-item">Training</label>
                      <input type="radio" id="Training" name="contracttype" value="i">
                    <label for="Voluntary" class="dropdown-item">Voluntary</label>
                      <input type="radio" id="Voluntary" name="contracttype" value="v">
               </div>
            </div>
            <div class="dropdown" style="margin-left: 5px">
                  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                      Contract Period?
                  </button>
                <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                    <label for="FullTime" class="dropdown-item">Full Time</label>
                      <input type="radio" id="FullTime" name="contractperiod" value="f">
                    <label for="PartTime" class="dropdown-item">Part Time</label>
                      <input type="radio" id="PartTime" name="contractperiod" value="p">
               </div>
            </div>
              <button type="submit" name= "page" class="btn btn-primary" value="" style="margin-left: 5px"><span class="fa fa-search" aria-hidden="true"></span></button>
      </div>
    </div>
    </form>
  </div>
</div>
<br>
<br>

  <div class="container">
  <form method='get'>;
  <div class="card ">
  <div class="card-body float-left">
    Found <?= $result->hits ?> Jobs || Sorted By: <?= ucfirst($sort) ?> || Contract Type: <?= ucfirst($contractname) ?> || Contract Period: <?= ucfirst($contractnameP) ?> 
    || Total Page : <?php echo "<b>$result->pages</b>" ?> || [Current Page : <?php echo "<b>$page</b>" ?>]
  </div>
</div>
  <div align ="center">
  <?php
    print("$thead");
    
    # Paging code
  if( $page > 1 ){
    echo "<a href='searchbar-result.php?page=".($page-1)."&sort=".$sort."&contracttype=".$contracttype."&contractperiod=".$contractperiod."' class='btn btn-primary'><<<</a> \n";
  }
  if ( $page < $result->pages ){
    echo "<a href='searchbar-result.php?page=".($page+1)."&sort=".$sort."&contracttype=".$contracttype."&contractperiod=".$contractperiod."'class='btn btn-primary'>>>></a>";
  }

  ?>

  </form>
</div>
</div>
<br>
</body>   
</html>