[SOLVED] Get "input value" in to controller

ionic-v1
1

Hi, I need to get into the controller the value of an input field.

<script id="tpl/carica.html" type="text/ng-template">
<ion-view view-title="Carica">
	<ion-content class="padding">
		<div class="list list-inset">
			<label class="item item-input">
				<input type="number" id="codice_prodotto" name="codice_prodotto" ng-model="codice_prodotto">
			</label>
		</div>
		<button nav-direction="back" class="button button-block button-large button-balanced" ng-click="carica()">CARICA</button>
	</ion-content>
</ion-view>
</script>

app.controller('CaricaCtrl', function ($scope, sendAndLoad) {
    console.log('carica');
    console.log($scope.codice_prodotto);
    // $scope.scanBarcode = function() {
    $scope.carica = function() {
	console.log('codice prodotto: '+ $scope.codice_prodotto);
...
2

It’s:

$scope.codice_prodotto

Just like you used it.

Is your controller bound to tpl/carica.html?

3

yes my controller is:

.state('carica', {
	url: "/carica",
	templateUrl: "tpl/carica.html",
	controller: 'CaricaCtrl'
})

I seem to have used $scope.codice_prodotto not?

4

I’m just guessing, I think your problem is this: sendAndLoad

Do you have this service and have you looked at your console logs?

If that object does not exist controller execution will fail.

5

Yes i’have this service:

app.service('sendAndLoad', function() {
	
	this.posM = '';
	this.posS = '';
	this.posP = '';
	
});
6

What about console log?

Are you seeing this output:

console.log(‘carica’); ?

And what about this one:

console.log($scope.codice_prodotto); ?

Have you received any error for this last line?

7

The output is:

2015-07-28 20:11:35.221 test[4500:2932243] carica
2015-07-28 20:11:35.222 test[4500:2932243] carica2

With this code:

console.log('carica');
console.log($scope.codice_prodotto);
console.log('carica2');
8

Pass the model object as parameter in the function try using below ng-click="carica(codice_prodotto)"
CARICA

and in the controller try using below pass the parameter i think it is not getting the scope of the input field
$scope.carica = function(codice_prodotto) {
console.log('codice prodotto: '+ $scope.codice_prodotto);

10

I got another idea, I so this once but completely forgot about it. Instead of this;

<input type="number" id="codice_prodotto" name="codice_prodotto" ng-model="codice_prodotto">

use this:

<input type="number" id="codice_prodotto" name="codice_prodotto" ng-model="codice_prodotto.value">

And in your controller:

console.log($scope.codice_prodotto.value);

###EDIT

You need to use dot notation with Ionic and input elements placed inside a ion-content container:

11

I had already tried it, but it was printing even ‘console2’

12

I tried but I will return undefined :frowning:

13

Thank you both, so I solved.

<input type="tel" id="codice_prodotto" name="codice_prodotto" ng-model="settings.codice_prodotto">

<button nav-direction="back" class="button button-block button-large button-balanced" ng-click="carica(settings)">CARICA</button>

$scope.carica = function(settings) {
	console.log(settings);
	console.log('codice prodotto: '+ settings.codice_prodotto);
2 Likes
14

So dot notation was a fix :smile:

1 Like
15

Yes, with a different use :slight_smile:

1 Like
16 
.controller('HomeCtrl', function($scope) {
  $scope.AddItem = function(data){
    console.info(data)
  };
  $scope.items=[
    {
      item : "Repair TV",
      status : false,
    },
    {
      item : "Do Nothing",
      status : true,
    },
  ];
})

help me with this


<div class="bar bar-footer item-input-inset">
      
        <label for="" class="item-input-wrapper">
          <input id="homeNewItem" type="text" placeholder="New Home ToDo" value="hello">
        </label>
        <button class="button button-small" ng-click="AddItem(document.getElementById('homeNewItem').value)">Add</button>
     
    </div>