Preventing Users from Bidding Less than the Latest Bid on an Auction Website

Ask the community
1

Hey everyone!

I’m building a small auction website using Softr, and I’ve run into a bit of a challenge. I want to make sure users (which aren’t logged in as i didnt implement a logged access) can’t submit a bid (thru a form block) that’s lower than the current highest bid. I assume this can be achieved by implementing a check that compares the user’s bid amount with the latest highest bid stored in Airtable (I’m using a rollup field to track this).

Has anyone done something similar or know the best way to go about it? I’m stuck at the moment and could really use some guidance on how to set up the logic to enforce this in the form. Any native/nocode tips on how to pull in the latest bid and validate the user’s input before submission would be greatly appreciated!

Thanks in advance for your help!

2

As far as I know,

Any native/nocode tips on how to pull in the latest bid and validate the user’s input before submission

It will not be possible to do this natively/without code using Softr’s form(s).

1 Like
3

Thanks Mark, any low code solution you would think of? I’ve asked ChatGPT about it and it suggests using the following Javascript and of course it doesn’t seem to work :frowning:

// Airtable API setup
const AIRTABLE_PERSONAL_ACCESS_TOKEN = 'hidden';
const BASE_ID = 'hidden';
const ITEMS_TABLE_NAME = 'Items'; // Table name where the current highest bid is stored
const HIGHEST_BID_FIELD_NAME = 'Current Highest Bid'; // Field name for the highest bid in the Items table

// Function to get Auction Item ID from the URL
function getAuctionItemId() {
  const params = new URLSearchParams(window.location.search);
  return params.get('recordId'); // Assuming the recordId is passed as a URL parameter
}

// Function to fetch the highest bid from Airtable
async function fetchHighestBid(auctionItemId) {
  const url = `https://api.airtable.com/v0/${BASE_ID}/${ITEMS_TABLE_NAME}/${auctionItemId}`;
  
  const response = await fetch(url, {
    headers: {
      Authorization: `Bearer ${AIRTABLE_PERSONAL_ACCESS_TOKEN}`
    }
  });
  
  if (response.ok) {
    const data = await response.json();
    return data.fields[HIGHEST_BID_FIELD_NAME]; // Get the highest bid from the field
  } else {
    console.error('Failed to fetch highest bid from Airtable');
    return null;
  }
}

// Function to validate the bid
document.querySelector('form').addEventListener('submit', async (event) => {
  const userBid = parseFloat(document.querySelector('#user-bid-input').value); // Replace #user-bid-input with your form input selector
  const auctionItemId = getAuctionItemId(); // Get the auction item ID dynamically from the URL
  
  // Fetch the highest bid for the specific auction item
  const highestBid = await fetchHighestBid(auctionItemId);

  if (highestBid === null) {
    alert("Could not retrieve the current highest bid. Please try again later.");
    event.preventDefault();
    return;
  }

  // Compare user's bid with the current highest bid
  if (userBid <= highestBid) {
    event.preventDefault(); // Stop the form from submitting
    alert(`Your bid must be higher than the current highest bid of $${highestBid}. Please enter a higher amount.`);
  } else {
    alert(`Your bid of $${userBid} is valid!`);
    // The form will be submitted if the bid is valid
  }
});
4

I don’t know if Fillout.com forms would do that validation for you or not, but worth trying their free plan.

1 Like
5

thanks a lot Mark, that was my plan B.

1 Like
6

I’ve been learning to use Fillout forms recently and know that they are powerful, and also appreciate they aren’t the native solution you were originally looking for. Hopefully you’ll achieve all you are trying to do. It would be great to learn about your progress and results.

1 Like
7

I’ve been using Tally.so instead of Fillout and set it up to pass URL parameters directly from Airtable fields. Here’s a step-by-step:

  1. Passing Data with URL Parameters: In Airtable, I created a formula field that concatenates the form URL with specific data fields, such as the current highest bid and the name of the art piece.
  2. Updating Softr’s Action Button: In Softr, I updated the action button (the button that users click to place a bid) to open the URL that contains the form on Tally.so. This URL is populated by the formula field in Airtable.
  3. Adding Conditional Logic in Tally.so: In Tally.so, I applied conditional rules to prevent users from submitting a bid that is lower than or equal to the current highest bid.
  4. Redirecting After Submission: Finally, I set the form to redirect users back to Softr after submitting their bid.
1 Like