Here is controller code:
$scope.FormData.Quantity = $scope.sum();
Here is HTML Code:
<input type="text" name="FormData.Quantity" ng-model="FormData.Quantity" />
Displaying blank textbox. How to assign?
you have assign function to ng-model , which may not returning anythinmg , try this one...
$scope.FormData = {};
$scope.sum = function(){
return "whatever";
};
$scope.FormData.Quantity = $scope.sum();
Related
I am trying to pass data to an API for the user e-mail subscription status as "Y"/"N".
In the controller code console.log(a.checked) is undefined. But in regular javascript a onclick event for the input element type="checkbox" has the this.checked to respond correspondingly as true or false. Why is it not happening here in AngularJS?
My html code with angular directive ng-click:
<label for="mail_sub">E-mail subscription</label>
<input id="mail_sub" type="checkbox" name=checkbox ng-click="mailsubscription(this)">
Code of the controller:
.controller("registerCtrl", function($scope, $state, userProcess) {
$scope.mailsubscription = function(a) {
console.log(a);
console.log(a.checked); // console output is: "undefined"
signupinfo = {};
if (a.checked) {
signupinfo.u_mail_subscription = 'Y';
} else {
signupinfo.u_mail_subscription = 'N';
}
console.log(signupinfo);
};
/*$scope.registerProcess = function(signupinfo){
console.log(signupinfo);
userProcess.signup(signupinfo).sucess(function(response){
if(response.status){
}
})
};*/
});
There is no checked defined in your scope. You have do to something like this:
$scope.checked = false
$scope.mailsubscription = function () {
$scope.checked = !$scope.checked;
console.log($scope.checked)
};
Or you can use ngModel directive in your template
<input id="mail_sub" type="checkbox" name=checkbox ng-click="mailsubscription(this)" ngModel="checked">
If you go this way you dont need to toggle the variable checked by your self.
I m new in angularJS:
When I change the value of my input, in my console I don t have the new value.
How can I get the new value of my input when I change it?
controller.js:
$scope.nam = guillaume;
$scope.firstchange = function(){
$scope.displayed = {'display':'block'};
console.log($scope.nam);
};
home.html:
<input ng-change="firstchange()" ng-model="nam" class="param-right"></input><p>Prénom</p>
You have to pass the model as a parameter to your handler.
controller.js
$scope.nam = guillaume;
$scope.firstchange = function(nam){
$scope.displayed = {'display':'block'};
console.log(nam);
};
home.html
<input ng-change="firstchange(nam)" ng-model="nam" class="param-right"></input><p>Prénom</p>
I am trying to load json data on the form which has two text fields. TextFields display correct price and qty from json. But, the problem is when user updates the price and qty, updated price and qty are not reflecting in controller method - $scope.total(). Here is my code
HTML file
<div ng-repeat="row in myData">
<input type="text" ng-model="row.price">
<input type="text" ng-model="row.qty">
</div>
JS file
$http.get('http call’).success(function(data){
$scope. myData = data
})
$scope.row = {
price : 10.0,
qty : 2;
};
$scope.total = function() {
console.log($scope.row.price);
console.log($scope.row.qty);
}
JSON - [{"price":10.50,"qty":3}]
Not sure what I am missing here? why updated values are not reflecting in controller?
Your $scope.total function needs to be called somewhere, and as mentioned by #pankajparkar, $scope.row is different than the row in your directive (which belongs to the ng-repeat's scope only).
Do this:
<div ng-repeat="row in myData">
<input type="text" ng-model="row.price" ng-change="total()">
<input type="text" ng-model="row.qty" ng-change="total()">
</div>
JS:
$http.get('http call').success(function(data){
$scope.myData = data;
});
$scope.total = function() {
console.log($scope.myData[0].price * $scope.myData[0].qty);
};
As your data is an array you loop througt is to get the total of all your objects:
$scope.total = function() {
var sum = 0;
myData.forEach(function(obj){
sum += obj.qty * obj.price
});
return sum;
}
and you need to call this function when values change.
Fiddle
With only one element in your array, your function total should be like #Joao answer:
$scope.total = function() {
return $scope.myData[0].price * $scope.myData[0].qty;
};
Fiddle
First thing if response is only one item then it should not be an array
It should be Single JSON such as {"price":10.50,"qty":3}
HTML Code
<input type="text" ng-model="myData.price">
<input type="text" ng-model="myData.qty">
<button type="button" ng-click="updateTotal()">
JS CODE
$http.get('http call').success(function(data){
$scope.myData = data;
});
$scope.total = function(){
//now here you will get updated scope values
console.log($scope.myData.price * $scope.myData.qty);
}
Hope this will be help full to you.
$scope.total is a function, but it is not returning anything.
instead of:
var total = $scope.row.price * $scope.row.qty
try:
return $scope.row.price * $scope.row.qty
Here is my case , I have an array :
var fileParamsArray=['fileThumbanilRetina','fileThumbanilNonRetine','fileThumbanilHdpi' ];
and in my view i have :
<input type="file" name="fileThumbanilRetina" file-model="fileThumbanilRetina" />
<input type="file" name="fileThumbanilNonRetine" file-model="fileThumbanilNonRetine" />
<input type="file" name="fileThumbanilHdpi" file-model="fileThumbanilHdpi" />
in my angularJS controller i want to have something like $scope.fileThumbanilRetina but when try to append array index value to $scope . its not happening
In my controller Here is my function :
$scope.submitForm = function() {
var fileParamsArray = [
'fileThumbanilRetina',
'fileThumbanilNonRetine',
'fileThumbanilHdpi' ];
for(i=0;i<fileParamsArray.length;i++) {
var file = $scope.fileParamsArray[i];
console.log(file);
//call to service function
fileUpload.uploadFileToUrl(file, uploadUrl,fileParamsArray[i]);
}
}
Please Help
If I've understood your 'question' right...you want something like
for(var i ...)
var file = $scope[fileParamsArray[i]];
...
I have mentioned my HTML.
<div ng-controller="myCtrl">
<input type=text ng-model="name">
</div>
in my JS file
function myCtrl($scope){
$scope.name=//this field comes from DB say 'ABC'
}
My question :
When my html is get loaded, it will disply "ABC" in textbox. Which is fine.
Now if user change that name to "XYZ", So $scope.name value is "XYZ".
So I need to identify that input value is changed. Previous value is "ABC" and now the value is "XYZ" how we can figured it out that value is changed?
You can use the ngChange directive.
<input type="text" ng-model="name" ng-change="change()">
Then, in your controller, add a method called change to the scope:
$scope.change = function () {
console.debug('Changed to ' + $scope.name);
}
Do it like this:
function myCtrl($scope){
$scope.$watch('name', function(newValue, oldValue){
});
}
function myCtrl($scope){
var dbName= 'ABC'; //this field comes from DB say 'ABC'
$scope.name= dbName;
$scope.$watch('name', function(newValue) {
if(newValue != dbName) {
// do something
}
});
}