Angular save function not updating the boolean value

Question

Angular save function not updating the boolean value

One of the challenges I'm facing is with the scope in my controller. Here's what it looks like:

$scope.carprice.active = true

In my view, there are two radio buttons that have the following code:

ng-click="carprice.active=true"

ng-click="carprice.active=false"

I need to figure out how to modify the value of the scope properly. Currently, even after selecting the false option, it still saves as true in the database.

I've also attempted using the click as a model, but that didn't solve the issue either.

Any suggestions would be greatly appreciated. Thanks, Sam

javascript angularjs

Answer 1

Answer №1

To achieve this functionality, it is recommended to utilize the ngValue directive instead of ngClick. You can bind the radio buttons to the same model, carprice.active:

<script src="https://code.angularjs.org/1.4.8/angular.js"></script>
<script>angular.module('demo', [])</script>

<div ng-app="demo" ng-init="carprice.active = true;">
    
    <input type="radio" ng-model="carprice.active" ng-value="true"> Active
    <input type="radio" ng-model="carprice.active" ng-value="false"> Not active    
    
    <pre>{{ carprice.active }}</pre>
</div>

Answer 2

To achieve this functionality, it is recommended to utilize the ngValue directive instead of ngClick. You can bind the radio buttons to the same model, carprice.active:

<script src="https://code.angularjs.org/1.4.8/angular.js"></script>
<script>angular.module('demo', [])</script>

<div ng-app="demo" ng-init="carprice.active = true;">
    
    <input type="radio" ng-model="carprice.active" ng-value="true"> Active
    <input type="radio" ng-model="carprice.active" ng-value="false"> Not active    
    
    <pre>{{ carprice.active }}</pre>
</div>

Angular save function not updating the boolean value

Answer №1

Similar questions

Attempting to verify the presence of an element within an array and then making updates to the array

Determine the scope of an element in Javascript in relation to its parent container

JavaScript application that features an audio player complete with a dynamic progress bar and customizable tags

Having trouble reading the file using jQuery in Internet Explorer 8 and earlier versions due to its non-XML format (albeit resembling XML)

How can I create an accordion panel that can be toggled using

Utilizing Pug for Passing Variables to JavaScript

Understanding the visibility scope in JavaScript's object-oriented programming

"Efficiently handle JSON and binary data passing with the enhanced functionality of Express Body Parser

Are Angular global variables used in the same way as $scope in terms of visibility and usage?

Tips for populating an input field with a variable value

What is the technique for retrieving the data-id value and transferring it to a different page with jQuery's post method?

What is the method for adding an item to an array in JavaScript?

Tips for Accessing the TextInput Content in React Native

Unlocking the potential of GraphQL: Harnessing the power of sibling resolvers to access output from another

Troubleshoot: Bootstrap Tooltips visible in DOM but not functioning

How can aoColumnDefs be configured in jQuery DataTable without the need to instantiate a new DataTable object?

Exploring the Safari browser with Polymer 2.0

Ways to extract the value from a jQuery object

ECharts - Version 3.1.6 Event Plugin

Troubleshooting problem with strokeRect on canvas following a CSS transform rotate(90deg)