How to debug: Change from div to form element in React. No response

Question

I try to change from div to form element (to use the type="submit" ) in the react render but there's no response. It shows http://localhost:3000/ ? FYI, div is working fine. The code is as below:

<div className="SearchBar">
 <input placeholder="Enter A Song, Album, or Artist" onChange={this.handleTermChange} />
 <a onClick={this.handleSearch}>SEARCH</a>
</div>

===

<form className="SearchBar" onSubmit={this.handleSearch}>
 <input placeholder="Enter A Song, Album, or Artist"  onChange={this.handleTermChange} />
 <button type="submit">SEARCH</button>
</form>

The Github repo is here .

Thank you for your time.

Answer 1

Probably your submit is giving refresh on the screen.

Use an e.preventDefault () at the beginning of your function its handleSearch function