I have a form with 2 inputs and 2 radio-button. Form is valid when both fields are filled and one of the radio-button is selected. In this case I enable submit button. The problem is that the submit button becomes enabled even when no radio-button is selected
<form name="formAdd" novalidate ng-submit="sendForm()" class="basic-grey" ng-controller="SignUpController">
<input id="antiForgeryToken" data-ng-model="antiForgeryToken" type="hidden" data-ng-init="antiForgeryToken='#GetAntiForgeryToken()'" />
<div class="bg-danger validationErrors" ng-show="validationErrors">
<ul>
<li ng-repeat="error in validationErrors">{{error}}</li>
</ul>
</div>
<div class="form-group">
<label for="Email">Email</label>
<input name="Email"
type="text"
class="form-control"
placeholder="Enter email"
ng-model="person.Email"
ng-required="true"
ng-minlength="3" />
</div>
<div class="form-group">
<label for="UserName">User name</label>
<input name="UserName"
type="text"
class="form-control"
placeholder="Enter user name"
ng-model="person.UserName"
ng-required="true" />
</div>
<div class="form-group" style="height:30px;">
<label for="Role">Your role</label>
<label data-ng-repeat="choice in question.choices" name="Role">
<input type="radio" name="response" data-ng-model="choice.isUserAnswer" data-ng-value="true" ng-required="true" />
{{choice.text}}
</label>
</div>
Cancel
<button type="submit" ng-disabled="formAdd.$invalid" class="btn btn-primary">Save</button>
</form>
Updated
(added controller)
var app = angular.module('signupvalidation', []);
app.controller('SignUpController', function ($scope, $http) {
$scope.person = {};
$scope.question = {
questionText: "",
choices: [{
id: 1,
text: "I'm an admin",
isUserAnswer: "false"
}, {
id: 2,
text: "I'm an user",
isUserAnswer: "false"
}]
};
$scope.sendForm = function () {
$http({
method: 'POST',
url: 'api/accounts/create',
data: $scope.person,
headers: {
'RequestVerificationToken': $scope.antiForgeryToken
}
}).success(function (data, status, headers, config) {
$scope.message = '';
if (data.success == false) {
var str = '';
for (var error in data.errors) {
str += data.errors[error] + '\n';
}
$scope.message = str;
}
else {
$scope.message = 'Saved Successfully';
$scope.person = {};
}
}).error(function (data, status, headers, config) {
$scope.message = 'Unexpected Error';
});
};
});
Please see demo below
<label for="Role">Your role</label>
<label data-ng-repeat="choice in question.choices" name="Role">
<input type="radio" name="response" data-ng-model="person.userType" data-ng-value="choice.value" ng-required="!person.userType" />
{{choice.text}}
</label>
var app = angular.module('app', []).
controller('HomeCtrl', function($scope) {
$scope.question = {
questionText: "",
choices: [{
id: 1,
text: "I'm an admin",
value: "admin"
}, {
id: 2,
text: "I'm an user",
value: "user"
}]
};
});
<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="https://code.jquery.com/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body ng-controller="HomeCtrl">
<form name="formAdd" novalidate ng-submit="sendForm()" class="basic-grey">
<input id="antiForgeryToken" data-ng-model="antiForgeryToken" type="hidden" data-ng-init="antiForgeryToken='#GetAntiForgeryToken()'" />
<div class="bg-danger validationErrors" ng-show="validationErrors">
<ul>
<li ng-repeat="error in validationErrors">{{error}}</li>
</ul>
</div>
<div class="form-group">
<label for="Email">Email</label>
<input name="Email" type="text" class="form-control" placeholder="Enter email" ng-model="person.Email" ng-required="true" ng-minlength="3" />
</div>
<div class="form-group">
<label for="UserName">User name</label>
<input name="UserName" type="text" class="form-control" placeholder="Enter user name" ng-model="person.UserName" ng-required="true" />
</div>
<div class="form-group" style="height:30px;">
<label for="Role">Your role</label>
<label data-ng-repeat="choice in question.choices" name="Role">
<input type="radio" name="response" data-ng-model="question.userType" data-ng-value="choice.value" ng-required="!question.userType" />{{choice.text}}
</label>
</div>
Cancel
<button type="submit" ng-disabled="formAdd.$invalid" class="btn btn-primary">Save</button>
<pre>{{person | json}}
</form>
</body>
</html>
Related
The problem is that the readForm() function won't return the object from $("#submitButton).on("click",readForm). I'm confused because the onclick event is working since the console.log("working") line does log "working" to the console when the #submitButton button is clicked.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="col-md-6">
<h2>Employee Page</h2>
<form id="employeeProfile">
<div class="form-group">
<label for="firstName">First Name:</label>
<input id="firstName" type="text" class="form-control" placeholder="Please enter first name.." name="firstName">
</div>
<div class="form-group">
<label for="lastName">Last Name:</label>
<input id="lastName" type="text" class="form-control" placeholder="Please enter last name." name="lastName">
</div>
<div>
<label for="age">Age:</label>
<input id="age" type="number" class="form-control" placeholder="Please enter your age." name="age">
</div>
<div class="radio-group" id="gender">
<h5>
<b>Gender:</b>
</h5>
<div class="radio">
<label>
<input id="genderM" type="radio" name="gender" value="male">Male:
</label>
</div>
<div class="radio">
<label>
<input id="genderF" type="radio" name="gender" value="female">Female:</label>
</div>
<div class="radio">
<label>
<input id="genderOth" type="radio" name="gender" value="other" checked="checked">Other:</label>
</div>
</div>
<div>
<label for="salary">Salary:</label>
<input id="salary" type="number" class="form-control" placeholder="please enter you salary." name="salary">
</div>
<div class="manager">
<label for="manager">Manager:</label>
<input id="manager" type="checkbox" name="managerY">
</div>
<div class="form-group">
<label for="comments">Comments</label>
<textarea id="comments" class="form-control" rows="3" placeholder="Place any comments here." name="comments"></textarea>
</div>
<button id="submitButton" type="button" class="btn btn-primary">Submit Profile</button>
<button id="calculateTax" type="button" class="btn btn-default">Calculate tax</button>
</form>
</div>
</div>
<script>
$(document).ready(function () {
$("#submitButton").on("click", readForm);
});
function readForm() {
console.log("working");
return {
firstName: $("#firstName").val(),
lastName: $("#lastName").val(),
age: $("#age").val(),
gender: $('input[name=gender]:checked').val(),
salary: $("#salary").val(),
manager: $("#manager").prop("checked"),
comments: $("#comments").val()
}
};
</script>
</body>
</html>
I'm new to all this so any and all help is greatly appreciated. Thanks.
Try this:
$(document).ready(function () {
$("#submitButton").on("click", function() {
var result = readForm();
console.log(result);
});
});
$(document).ready(function () {
$("#submitButton").on("click", readForm);
});
You ask why readForm return nothing, but how do you know when it's returning ?
$(document).ready(function () {
$("#submitButton").on("click", function readFormReturn() {
console.log(readForm())
});
});
Here you should log what readForm is returning
The function is returning a value, you are just not doing anything with it, if you where to replace your return with a console.log, you will see that it does return.
console.log( {
firstName: $("#firstName").val(),
lastName: $("#lastName").val(),
age: $("#age").val(),
gender: $('input[name=gender]:checked').val(),
salary: $("#salary").val(),
manager: $("#manager").prop("checked"),
comments: $("#comments").val()
});
But if you want to do something with the data, you will have to do it inside the function, so set that informaton into a variable, like this:
var data = {
firstName: $("#firstName").val(),
lastName: $("#lastName").val(),
age: $("#age").val(),
gender: $('input[name=gender]:checked').val(),
salary: $("#salary").val(),
manager: $("#manager").prop("checked"),
comments: $("#comments").val()
};
And do the operations inside the function, because you can't return the data through the on event, link.
I have a new auction form. The user has to insert all the requested field , then by clicking on a button "Invite People" can invite other saved users or can invite people by e mail. The email part works fine. But the users part give me some problem.
The html part:
<div ng-show="showBid" class="panel panel-default" ng-controller="NewAuctionController">
<div class="panel-heading">Invite Members</div>
<div class="panel-body">
<ul class="list-group" ng-repeat="user in users">
<li class="col-md-4" id="userlist" ng-hide="user.name == profile">
<img ng-src="{{user.img}}" class="userImage">
<div class="username"> {{user.name}}</div>
<div class="userrole"> {{user.role}} </div>
<div class="usercompany">{{user.company}}</div>
<input type="checkbox" ng-model="user.isChecked" ng-click="insertinvited(user)">
</li>
</ul>
The above part i tried also with ng-change, but it's the same.
The insertinvited() is:
$scope.invitations=[];
$scope.insertinvited= function (user) {
if(user.isChecked) {
$scope.invitations.push(user.name);
} else {
var toDel = $scope.invitations.indexOf(user.name);
$scope.invitations.splice(toDel,1);
}
console.log($scope.invitations);
};
In the console this works, cause when i check the box the array is pushed correctly
But when i try to use that array here:
<div ng-show="showBid" class="panel panel-default" >
<div class="panel-heading">Members Selected:</div>
<div class="panel-body">
<ul class="list-group">
<li class="list-group-item" ng-repeat="invitation in invitations">
<div class="listmail"> {{invitation}}</div>
</li>
</ul>
</div>
</div>
The array seems to be empty, infact when i pass the array to the controller and i try to do a console.log the array is empty.
Anyone could me help?
Edited
This is all my html code:
<form ng-controller="NewAuctionController"
name="myform">
<div>
<div ng-hide="showBid">
<div ng-show="uploading" class="progress">
</div>
<label class="btn" style="background-color: #858892">
Browse
<input type="file" ng-disabled="uploading" file-model="file.upload" name="myfile" style="display: none;" onchange="angular.element(this).scope().photoChanged(this.files)">
</label>
<br>
<br>
<br>
<img class="mythumbnail" ng-src="{{ thumbnail.dataUrl || default }}">
<br>
<br>
<div ng-show="message">
<div ng-class="alert">{{ message }}</div>
</div>
<div class="form-group" id="productname">
<label for="exampleInputName1">Product Name</label>
<input type="text" class="form-control" id="exampleInputName1" placeholder="Enter Product" ng-model="productTitle" >
</div>
<br>
<div class="form-group">
<label for="exampleInputdescription1"> Description:</label>
<input type="text" class="form-control" id="exampleInputdescription1" placeholder="Enter Description" ng-model="productDescription" >
</div>
<div class="form-group">
<label> Expiration Date:</label><br>
<input type="date" class="form-control" name="expiration date" ng-model="endtime" ><br>
</div>
<div class="quantity">
<label>Quantity:</label><br>
<input type="number" name="quantity" ng-model="quantity" placeholder="u" class="form-control" ><br>
</div>
<div class="Warranty">
<label>Warranty (days):</label><br>
<input type="number" name="warranty" class="form-control" ng-model="warranty" placeholder="days" ><br>
</div>
<div class="form-group">
<label>Minimum Price:</label><br>
<input type="number" name="minimum price" id="min" ng-model="minPrice" placeholder="€" class="form-control" ><br>
</div>
<div class="form-group">
<label>Buy-Now Price:</label><br>
<input type="number" name="minimum price" id="min" ng-model="productbuynow" placeholder="€" class="form-control" ><br>
</div>
<div class="form-group">
<label>Location of the goods:</label><br>
<input type="text" name="location" id="country" ng-model="Country" placeholder="Country" class="form-control" ><br>
<input type="text" name="Town" id="town" ng-model="Town" placeholder="Town" class="form-control" ><br>
<input type="text" name="address" id="address" ng-model="Address" placeholder="Address" class="form-control" ><br>
<input type="text" name="Postal code" id="postalCode" ng-model="PostalCode" placeholder="Postal Code" class="form-control" ><br>
</div>
<div class="form-group">
<label>Terms of payment: </label><br>
<select ng-model="payment">
<option value="Letter of credit">Letter of credit</option>
<option value="Cash in advance">Cash in advance</option>
<option value="Confirmed Irrevocable Credit">Confirmed irrevocable Credit</option>
</select><br>
</div>
<div class="form-group">
<label>Terms of Delivery: </label><br>
<select ng-model="delivery">
<option value="Carriage Paid To">Carriage Paid To</option>
<option value="Free Carrier">Free Carrier</option>
<option value="Confirmed Irrevocable Credit">Ex Works</option>
</select><br>
</div>
<input class="savebutton" type="submit" value="Invite People" ng-click="clickToOpen5()"><br>
<div ng-show="showBid" class="panel panel-default" ng-controller="NewAuctionController">
<div class="panel-heading">Invite Members</div>
<div class="panel-body">
<ul class="list-group" ng-repeat="user in users">
<li class="col-md-4" id="userlist" ng-hide="user.name == profile">
<img ng-src="{{user.img}}" class="userImage">
<div class="username"> {{user.name}}</div>
<div class="userrole"> {{user.role}} </div>
<div class="usercompany">{{user.company}}</div>
<input type="checkbox" ng-model="user.isChecked" ng-change="insertinvited(user)">
</li>
</ul>
</div>
<div class="panel-heading">Members Selected:</div>
<div class="panel-body">
<ul class="list-group">
<li class="list-group-item" ng-repeat="invitation in invitations">
<div class="listmail"> {{invitation}}</div>
</li>
</ul>
</div>
<div class= "insertmail" ng-show=" showBid ">
Or Insert E-mail:<br>
<input type="email" name="emailaddress" ng-model="emailaddress">
<div ng-show="showBid" class="panel panel-default" >
<div class="panel-heading">Mail Inserted:</div>
<div class="panel-body">
<ul class="list-group">
<li class="list-group-item" ng-repeat="mail in mails">
<div class="listmail"> {{mail}}</div>
</li>
</ul>
</div>
</div>
<button ng-show="showBid" class="savebutton" ng-click="saveauction(profile)">SAVE</button><br>
</div>
</form>
And this is all my controller:
angular.module('NewAuctionCtrl', ['ngDialog', 'fileModelDirective', 'uploadFileService']).controller('NewAuctionController', ['$scope','$http' ,'ngDialog','uploadFile', '$timeout' , function($scope, $http, ngDialog, uploadFile, $timeout){
$scope.file = {};
$scope.message = false;
$scope.alert = '';
$scope.photoChanged = function (files) {
if (files.length > 0 && files[0].name.match(/\.(png|jpeg|jpg|pdf)$/)) {
$scope.uploading = true;
var file = files[0];
var fileReader = new FileReader();
fileReader.readAsDataURL(file);
fileReader.onload = function(e) {
$timeout(function() {
$scope.thumbnail = {};
$scope.thumbnail.dataUrl = e.target.result;
$scope.uploading = false;
$scope.message = false;
});
};
} else {
$scope.thumbnail = {};
$scope.message = false;
}
};
$http.get('/api/users').then(function(Users) {
$scope.users = Users.data;
});
$scope.mails = [];
$scope.emailaddress = '';
$scope.insertmail = function () {
$scope.mails.push($scope.emailaddress);
$scope.emailaddress = '';
};
$scope.invitations = [] ;
$scope.insertinvited= function (user) {
if(user.isChecked) {
$scope.invitations.push(user.name);
} else {
var toDel = $scope.invitations.indexOf(user.name);
$scope.invitations.splice(toDel,1);
}
console.log($scope.invitations);
};
$scope.saveauction = function (user) {
console.log($scope.invitations);
var array = {
param1: $scope.productTitle,
param2: $scope.productDescription,
param3: $scope.endtime,
param4: $scope.minPrice,
param5: $scope.productbuynow,
param6: user,
param7: $scope.quantity,
param8: $scope.warranty,
param9: $scope.Country,
param10: $scope.Town,
param11: $scope.Address,
param12: $scope.PostalCode,
param13: $scope.payment,
param14: $scope.delivery,
param15:$scope.invitations
};
$scope.uploading = true;
uploadFile.upload($scope.file).then(function (data) {
if (data.data.success) {
$scope.uploading = false;
$scope.alert = 'alert alert-success';
$scope.message = data.data.message;
$scope.file = {};
$http.post('/api/newauction', array)
.then(
function () {
swal(
'Good job!',
'New Auction is created',
'success'
)
});
$scope.sendmail();
}
else {
$scope.uploading = false;
$scope.message = data.data.message;
swal(
'Oops...!',
$scope.message,
'error'
);
$scope.file = {};
}
});
};
$scope.clickToOpen5 = function () {
$scope.showBid = !$scope.showBid;
};
$scope.sendmail = function (){
var address = $scope.mails;
console.log(address);
if(address[0]) {
$http.post('/api/sendmail/', {address: address}).then(function (err) {
if (err)
console.log(err);
});
}
};
});
You should change ng-click to ng-change
<input type="checkbox" ng-model="user.isChecked" ng-change="insertinvited(user)">
And in del of you , i think it should
var todel =$scope.invitations.indexOf(user.name);
$scope.invitations.splice(toDel,1);
This can be the problem of scope inheritance in angular JS.
try to do following changes:
In controller save this to some parameter like:
var vm = this;
now use vm.invitations instead of $scope.invitations.
and in ng-repeat use:
ng-repeat="invitation in vm.invitations"
You are clearing the array with each click.
Remove this statement:
$scope.invitations = [];
and move it to controller's main body; then it should work(especially if you're using ng-change).
this is due to the prototypical inheritance in javascript.
using var vm= this inside controller and
renaming $scope.invitations to vm.invitations in controller and invitations in html to vm.invitations.
will resolve the issue
I am using AngularJS v1.5.8.
In html
<div class="form-group row" data-ng-repeat="friend in friends track by $index">
<label class="col-xs-1 control-label">Friend </label>
<div class="col-xs-2">
<input type="text" class="form-control" required ng-model="friend.first_name" placeholder="First Name" />
</div>
<div class="col-xs-2">
<input type="text" class="form-control" required ng-model="friend.last_name" placeholder="Last Name" />
</div>
<div class="col-xs-4">
<input type="email" class="form-control" required ng-model="friend.email" placeholder="Email" />
</div>
<div class="col-xs-2">
<input type="text" class="form-control" ng-model="friend.phone" placeholder="Phone" />
</div>
<div class="col-xs-1">
<span class="glyphicon glyphicon-plus"></span>
</div>
<div class="col-xs-1">
<span class="glyphicon glyphicon-remove"></span>
</div>
<div class="clearfix"></div>
In controller
$scope.friends = [{first_name: "", last_name: "", email: "", phone: ""}];
$scope.addMore = function () {
console.log('in add');
$scope.friends.push({
first_name: "",
last_name: "",
email: "",
phone: ""
});
};
$scope.removeFriend = function(index) {
console.log("in remove: "+index);
$scope.friends.splice(index,1);//delete last row in html form..am I expecting something wrong....
};
while I inspect the code I get removeList($index) instead I was hoping removeList(1) or removeList(4).
What possibly can be wrong?
I have two questions
- why even if I am passing index correctly , it end up deleting last element
- how data entered will be updated in angular...
If you have some tutorial to follow please share the link
I think you have some typos:
$scope.removeList = function(referIndex) {
console.log("in remove: " + referIndex); // note it is + not .
$scope.lists.splice(referIndex, 1); // note $scope.lists not $scope.list
};
Here no need to use track by index because we are not using duplicate key.
Please use below code
<div ng-app="myApp" ng-controller="myCtrl">
<div class="form-group row" data-ng-repeat="friend in friends">
<label class="col-xs-1 control-label">Friend </label>
<div class="col-xs-2">
<input type="text" class="form-control" required ng-model="friend.first_name" placeholder="First Name" />
</div>
<div class="col-xs-2">
<input type="text" class="form-control" required ng-model="friend.last_name" placeholder="Last Name" />
</div>
<div class="col-xs-4">
<input type="email" class="form-control" required ng-model="friend.email" placeholder="Email" />
</div>
<div class="col-xs-2">
<input type="text" class="form-control" ng-model="friend.phone" placeholder="Phone" />
</div>
<div class="col-xs-1">
<span class="glyphicon glyphicon-remove">Remove</span>
</div>
</div>
<div class="col-xs-1">
<span class="glyphicon glyphicon-plus">Add</span>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope)
{
$scope.friends = [{first_name: "", last_name: "", email: "", phone: ""}];
$scope.addMore = function () {
console.log('in add');
$scope.friends.push({
first_name: "",
last_name: "",
email: "",
phone: ""
});
};
$scope.removeFriend = function(index)
{
console.log("in remove: "+index);
$scope.friends.splice(index,1);//delete last row in html form..am I expecting something wrong....
};
})
</script>
I am trying to create a webapp that uses angularjs and a backend api build in flask and sqlalchemy. The problem is that some keys in the json contain a dot and angularjs can't handle this. The problem is with the location.name field.
This is the json from the api
{
"brand": "Unknown",
"id": 6,
"location.name": "USB",
"name": "Usb verlengkabel 0.5m",
"uri": "http://localhost:5000/items/6"
}
And this is my angular controller:
angular
.module('inventory')
.controller('Item.ItemEditController', Controller);
function Controller($stateParams,$http) {
var ctrl = this;
$http.get(config.API_URL+'/items'+'/'+$stateParams.itemId ).success(function(data) {
ctrl.item = data;
}).error(function(data){ctrl.errormsg = data});
ctrl.updateItem = function () {
$http({
method: 'PUT',
url: config.API_URL +'/items/' + $stateParams.itemId,
data : this.item
})
.then(function successCallback(response) {
ctrl.result = { class:'alert alert-success', message:'Opgeslagen!'};
console.log(ctrl.result);
}, function errorCallback(response) {
console.log("error")
ctrl.result = { class:'alert alert-danger', message:'Er is iets fout gegaan bij het opslaan'};
});
}
}
And the html page
<div ng-if="ctrl.result.class" ng-class="ctrl.result.class">
{{ctrl.result.message}}
</div>
<form class="form-horizontal" role="form" ng-submit="ctrl.updateItem()">
<div class="form-group">
<label for="name" class="col-sm-2 control-label">Name</label>
<div class="col-sm-10">
<input type="text" ng-model="ctrl.item.name" class="form-control" id="name" placeholder="name"/>
</div>
</div>
<div class="form-group">
<label for="brand" class="col-sm-2 control-label">Brand</label>
<div class="col-sm-10">
<input type="text" ng-model="ctrl.item.brand" class="form-control" id="brand" placeholder="brand" />
</div>
</div>
<div class="form-group">
<label for="location" class="col-sm-2 control-label">Location</label>
<div class="col-sm-10">
<input type="text" ng-model="ctrl.location.name" class="form-control" id="location" placeholder="location" />
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<input type="submit" class="btn btn-primary" value="Save"/>
</div>
</div>
</form>
use ctrl.item['location.name'] instead of ctrl.location.name
<input type="text"
class="form-control"
id="location"
placeholder="location"
ng-model="ctrl.item['location.name']" />
plunker: http://plnkr.co/edit/V2LsFL7SNMV8n5nkLQWa?p=preview
I have a form with a checkbox that binds to ng-model property. When I check the checkbox the value is set in the model but when its unchecked, the key and value are never set at all so it fails api validation.
<div class="form-group">
<label for="title">Title</label>
<input type="text" ng-model="post.title" placeholder="Post title..." />
</div>
<div class="form-group">
<label for="author">Author</label>
<input type="text" ng-model="post.author" placeholder="Your name" />
</div>
<div class="form-group">
<label for="content">Content</label>
<textarea ng-model="post.content"></textarea>
</div>
<div class="form-group">
<label for="visible">Visible?</label>
<input type="checkbox" ng-model="post.is_visible" />
</div>
<div class="form-group">
<input type="submit" class="btn btn-primary" value="Save" />
</div>
blogModule.controller('PostCreateController', ['$scope', '$stateParams', 'PostResource',
function ($scope, $stateParams, PostResource) {
$scope.post = new PostResource();
$scope.addPost = function () {
console.log($scope.post); // post.is_visible is undefined
//$scope.post.$save();
}
}
]);
This is what the model looks like before it's saved:
{
$resolved: true
author: "asdag"
content: "adfadsf"
title: "adgadf"
proto: ...
}
Why is post.is_visible undefined instead of being set to false? What can I do to make it set false?
try this
<input type="checkbox" ng-model="post.is_visible" ng-init="post.is_visible=false" />