# Search index selection

**URL:** <https://discuss.elastic.co/t/search-index-selection/252265>\
**Category:** Elastic Search\
**Tags:** elastic-app-search\
**Created:** [October 15, 2020, 8:05pm UTC](https://discuss.elastic.co/t/search-index-selection/252265 "2020-10-15T20:05:00Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![skiptheyeets](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/skiptheyeets/32/67440_2.png) [@skiptheyeets](https://discuss.elastic.co/u/skiptheyeets)\
**Post date:** [October 15, 2020, 8:05pm UTC](https://discuss.elastic.co/t/search-index-selection/252265/1 "2020-10-15T20:05:00Z")

</div>

Is there any way to pass a specific a search index to `SearchProvider`? I've been trying by passing down props but I always get a props undefined when `onAutocomplete` or `onSearch` are called.

```auto
// App.js

const App= () => {
  return (
    <>
      <Dropdown/> // selects specific index from a dropdown
      <SearchIndex searchIndex="foo" />
    </>
  )
}

```

```auto
// SearchIndex.js
class SearchIndex extends Component {
  constructor(props) {
    super(props);
    this.state = { searchIndex: props.searchIndex };
  }

  onResultClick() { }

  onAutocompleteResultClick() { }

  async onAutocomplete(searchTerm) {
    const requestBody = buildRequest({ searchTerm });
    const json = await runRequest(this.state.searchIndex, requestBody);
    const state = buildState(json);

    return { autocompletedResults: state.results };
  }

  async onSearch(state) {
    const { resultsPerPage } = state;
    const requestBody = buildRequest(state);
    const responseJson = await runRequest(this.state.searchIndex, requestBody);
    const responseJsonWithDisjunctiveFacetCounts = await applyDisjunctiveFaceting(responseJson,
      state,
      ["companies", "date_uploaded"],
      this.state.searchIndex);

    return buildState(responseJsonWithDisjunctiveFacetCounts, resultsPerPage);
  }

  render() {
    return (
      <SearchProvider config={{
        debug: false,
        hasA11yNotifications: false,
        onResultClick: this.onResultClick,
        onAutocompleteResultClick: this.onAutocompleteResultClick,
        onAutocomplete: this.onAutocomplete,
        onSearch: this.onSearch
      }}>
        <WithSearch mapContextToProps={({ wasSearched }) => ({ wasSearched })}>
          {({ wasSearched }) => (
            <div className="App">
              <ErrorBoundary>
                <Layout
                  header={
                    <SearchBox
                      autocompleteMinimumCharacters={3}
                      autocompleteResults={{
                        linkTarget: "_blank",
                        sectionTitle: "Results",
                        titleField: "title",
                        urlField: "link",
                        shouldTrackClickThrough: true,
                        clickThroughTags: ["test"]
                      }}
                      autocompleteSuggestions={true}
                    />
                  }
                  sideContent={
                    <div>
                      {wasSearched && (
                        <Sorting
                          label={"Sort By"}
                          sortOptions={[
                            {
                              name: "Title",
                              value: "title",
                              direction: "asc"
                            }
                          ]}
                        />
                      )}
                      <Facet
                        field="search_index"
                        label="Search Index"
                        filterType="any"
                        isFilterable={true}
                      />
                      <Facet
                        field="date_uploaded"
                        label="Date Uploaded"
                        filterType="any"
                        isFilterable={true}
                      />
                    </div>
                  }
                  bodyContent={
                    <Results
                      titleField="title"
                      urlField="link"
                      shouldTrackClickThrough={true}
                      resultView={Result}
                    />
                  }
                  bodyHeader={
                    <React.Fragment>
                      {wasSearched && <PagingInfo />}
                      {wasSearched && <ResultsPerPage />}
                    </React.Fragment>
                  }
                  bodyFooter={<Paging />}
                />
              </ErrorBoundary>
            </div>
          )}
        </WithSearch>
      </SearchProvider>
    )
  }
}

export default SearchIndex;

```

---

<div class="post-metadata">

**Author:** ![JasonStoltz](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/jasonstoltz/32/49893_2.png) [@JasonStoltz](https://discuss.elastic.co/u/JasonStoltz)\
**Post date:** [October 20, 2020, 3:09pm UTC](https://discuss.elastic.co/t/search-index-selection/252265/2 "2020-10-20T15:09:08Z")

</div>

This is really really cool. And it looks to me like it should work. Are you still unable to get this working?

If not, can you elaborate on what you mean by you get prop undefined?

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\
**Post date:** [November 17, 2020, 3:09pm UTC](https://discuss.elastic.co/t/search-index-selection/252265/3 "2020-11-17T15:09:10Z")

</div>

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.