CODEWITHSUNDEEP
ember.js
TymArtist
TymArtist

Reputation: 13

Ember Form Action returns Undefined Input Value

I'm running into a weird issue with Ember.js.

I built out a basic search form like so, with an Ember input field that submits to a form action 'submitSearch':

import Ember from 'ember';

export default Ember.Route.extend({
	actions: {
	  submitSearch: function() {
	  	  var searchItem = this.get('searchItem');
	      this.transitionTo({queryParams: {'q':searchItem}});
	  }
  }
});
<div class="search">
		<form {{action "submitSearch" on="submit"}}>
			<fieldset>
				{{input type="text" class="form-control" value=searchItem}}
				<input type="submit" name="submit" id="submit-search" class="btn btn-default" value="Search" />
			</fieldset>		
		</form>
	</div>

Any reason why I would be getting a value of 'undefined' when logging out searchItem? I've tried just about everything including creating a model, but I can't get the input to save.

Upvotes: 0

Views: 370

Answers (1)

jcbvm
jcbvm

Reputation: 1670

The searchTerm value in your template is referring to your controller's searchTerm property, not a property of your route (by default when referring to a property in your template, it is referring to a property of the corresponding controller).

To get the value in the route, simply do this.get('controller.searchTerm').

Upvotes: 1

Related Questions