Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

How do I limit the number of results returned when I type in the searchbox

See original GitHub issue

Sorry just a dumb question,. Cause I’m torn between ais-refinement-list and ais-results and where to add them…

  <ais-instant-search
    :search-client="searchClient"
    index-name="criminals"
    > 
    <ais-search-box v-model="criminalsName" class="bg-grey-lightest border p-2 border-gray mr-4 h-10 w-full rounded-sm font-basic mt-2 mb-4 w-full" placeholder="Search criminals...">
    </ais-search-box>
    <ais-hits v-show="this.criminalsName.length > 0 ">
     <template
     slot="item"
     slot-scope="{ item }"
     >
     <div id="searchresults" class="h-auto max-w-3xl mx-auto w-full">
      <span class="p-4 border-b  flex justify-between items-center group hover:bg-teal-100">
        <a class="block flex-1 no-underline" href="#">
          <ais-highlight
          :hit="item"
          attribute="full_name"
          />
          <p class="font-bold text-sm text-indigo-600 hover:text-indigo-500">
            <span class="mr-2 text-teal-500">Alias</span>
            <ais-highlight
            :hit="item"
            attribute="alias"
            /> 
            <span class="mr-2 text-teal-500">Contact Number</span>
            <div>
              <!-- <ais-results :limit="10"></ais-results> -->
              <!-- <ais-refinement-list :limit="5"></ais-refinement-list> -->
            </div>
            <ais-highlight
            :hit="item"
            attribute="contact_number"
            />
          </p>
        </ais-highlight>
      </a>
      <a href="#">
        <img class="hidden md:block h-16 border-none" src="https://www.tailwindtoolbox.com/components/searchy.gif">
      </a>
    </span>  
  </div>
  </template>
  </ais-hits>
  </ais-instant-search>

Issue Analytics

State:
Created 3 years ago
Comments:5 (3 by maintainers)

Top GitHub Comments

1reaction

Haroenvcommented, Mar 24, 2020

You can add hits per page either via the dashboard, or via a configure widget:

<ais-configure :hits-per-page.camel="5" />

Hope that’s clear!

0reactions

Haroenvcommented, Mar 25, 2020

I could see your template was a little invalid, so here’s a version with those issues resolved @abrhambas01 https://codesandbox.io/s/smoosh-night-j7r1c