CODEWITHSUNDEEP
javascripthtmlangularjs
user4973456
user4973456

Reputation:

send textbox input on ng-click

I have an input and a button

<input type="text" name="search_tags" id="search_tags" placeholder="Search by Tags" class="form-control"  >
<button type="submit" class="btn btn-primary btn-lg" ng-click="searchTags()">Search</button>

How do I pass the text present in the input textbox to the searchTags() function after button ng-click?

Upvotes: 1

Views: 3625

Answers (4)

Keyur Shah
Keyur Shah

Reputation: 536

Use the ng-model directive to bind data from the model to the view on HTML controls (input, select, textarea)

The ng-model directive provides a two-way binding between the model and the view.

<input ng-model="search_tag" type="text" name="search_tags" id="search_tags" placeholder="Search by Tags" class="form-control"  >
<button type="submit" class="btn btn-primary btn-lg" ng-click="searchTags(search_tag)">Search</button>

Upvotes: 0

Syam Pillai
Syam Pillai

Reputation: 5217

You are using angularJs. So you can give ng-model to the input so that you can access the value through it.

One way to access is 

<input type="text" ng-model="text_content" placeholder="Search by Tags" class="form-control">
<button type="submit" class="btn btn-primary btn-lg" ng-click="searchTags(text_content)">Search</button>

otherwise, you can just access the value in controller with out passing in the function.

<input type="text" ng-model="text_content" placeholder="Search by Tags" class="form-control">
<button type="submit" class="btn btn-primary btn-lg" ng-click="searchTags()">Search</button>

You can access the value in controller by $scope.text_content

Upvotes: 0

Daniel
Daniel

Reputation: 3514

You need to reference a ng-model for your input field like that:

<input ng-model="myScopeVariable" type="text" name="search_tags" id="search_tags" placeholder="Search by Tags" class="form-control" >
<button type="submit" class="btn btn-primary btn-lg" ng-click="searchTags(myScopeVariable)">Search</button>

Upvotes: 0

Satpal
Satpal

Reputation: 133403

Set ngModel directive with the input control, then pass that to ngClick of button.

<input type="text" ng-model="myText">
<button type="submit"  ng-click="searchTags(myText)">Search</button>

The property myText will be accessible in $scope

jsFiddle

Upvotes: 4

Related Questions