The quick-order form

Rapid replaces dozens of product-page visits with a single searchable table. This walkthrough follows a buyer through one bulk order, and explains exactly how the form behaves.

The page

You publish a page, typically called “Quick Order”, containing the [rapid_order] shortcode. It renders a compact product table: each row is a purchasable product with the columns you enabled (image, SKU, price, stock), the product name (linked to the product page), and a quantity input. A Search products box sits above the table, and a submit button with a live “lines queued” tally sits below it. There is no on-page category dropdown, which products appear is set by the store scope, not chosen by the shopper.

Searching by name or SKU

The buyer types into the search box. Results update live via debounced AJAX, the script waits about 280 ms after the last keystroke, then rebuilds the table body in place with no page reload. Matching uses WooCommerce’s own product search (wc_get_products), which covers the product title, SKU and more, so a trade buyer can type a part number like HD-BLK-M instead of scrolling. Any quantities already entered are preserved across a re-render. The number of matches shown follows your results per page setting (1-50); to see different products, the buyer refines the search term, there is no “load more” button.

If a search returns nothing, the table shows “No products found.” A dropped connection or expired session shows a short status message (“Something went wrong…” or a session-expired prompt) in the aria-live region above the table.

Setting quantities

The buyer types a quantity against each product they want, as many rows as they like, building a whole order in one view. As quantities change, each row with a positive quantity is highlighted and the “lines queued” tally below the table counts up, so the buyer can see the order building. Products that are out of stock render with their quantity input disabled, so they can’t be added by mistake.

Batched add-to-cart

Clicking Add selected to cart submits every row with a quantity above zero in a single request. Rapid handles the submit early (before the page renders), re-checks each product is purchasable and in scope, adds them to the WooCommerce cart, then redirects back to the same page so cart cookies are written cleanly. The buyer sees one combined notice rather than a stream of separate messages, for example “5 products added to your cart.” If some lines couldn’t be added (out of scope, no longer purchasable), a second notice reports “N products could not be added.” Submitting with no quantities entered shows “No quantities were entered.” A single submit accepts up to 200 distinct line items. From there the buyer proceeds to the cart or checkout as normal; guest and logged-in buyers both work, following your usual WooCommerce checkout settings.

Works without JavaScript

The form degrades gracefully. With JavaScript disabled, the first page of in-scope products renders as a plain table, and the submit still batches the entered quantities into the cart server-side. Live search is an enhancement on top of this baseline, not a requirement, so no buyer is locked out.

Accessible and mobile-friendly

On small screens the table collapses to cards (each cell labelled by its column), so the form stays usable on a phone or tablet, handy for reps ordering on the move. Every quantity input carries a real screen-reader label naming its product (“Quantity for Espresso beans, 1 kg”), the search field is labelled, and search/submit status is announced through an aria-live region. Controls have visible focus states throughout.

B2B and wholesale patterns

• One page for the whole catalogue, scope set to all products, live search by SKU; buyers find anything fast.
• A focused page for one range, set the store scope to “Selected categories only” and tick the categories that range covers, so the Quick Order page only ever shows those products.
• Reorder workflows, buyers who repeat large orders type known SKUs, set quantities and submit once, instead of rebuilding the order product by product.

A typical session

1. A trade buyer opens your Quick Order page.
2. They type HD- and the matching hoodie SKUs appear without a reload.
3. They set quantities across several rows; the “lines queued” tally climbs.
4. One click adds them all; a single notice confirms “8 products added to your cart.”
5. They check out, a large order placed in under a minute.