Exploring options beyond ng-model

When attempting to apply ng-model on a textarea, I encountered an error in IE 11. Here is the code snippet:

<div ng-hide="DoctorDashboardCtrl.showEducation">
      <textarea placeholder="2000 Characters Free flow text" width="832px" height="100px" class="form-control" ng-model="DoctorDashboardCtrl.otherdetails.education">
             <!-- {{DoctorDashboardCtrl.otherdetails.education}} -->       
      </textarea>
</div>

After receiving an invalid argument error in IE11, I made the following change:

<div ng-hide="DoctorDashboardCtrl.showEducation">
     <textarea placeholder="2000 Characters Free flow text" width="832px" height="100px" class="form-control" ng-bind="DoctorDashboardCtrl.otherdetails.education"> 
           {{DoctorDashboardCtrl.otherdetails.education}} 
     </textarea>
</div>

However, upon clicking the save button, the value of DoctorDashboardCtrl.otherdetails.education does not update and instead displays the old value. Is there a different solution to this issue or must I continue working with this error persistently?

javascriptangularjsangular-ngmodel

Answer №1

@Gaurav: Make sure to include a watch in your code to ensure you receive the most updated values

`$scope.$watch(
            function(){
                return $scope.otherdetails.education;
            },
            function(newValue, oldValue){
                if(newValue && newValue != oldValue) {
                    $scope.otherdetails.education = newValue;
                }
            },
            true
        );`

Additionally, initialize an empty array and string at the beginning of your controller:

$scope.otherdetails = [];
$scope.otherdetails.education = "";

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Modifying the data attribute within the div does not result in a different image for the 360-degree spin view

My current project involves utilizing js-cloudimage-360-view.min.js to create a 360-degree view of images. I have successfully retrieved the images, but I am encountering difficulty in updating the images by clicking a button. index.html <!DOCTYPE html ...

javascripthtml

Setting a condition for a function call when a checkbox is clicked

My table has columns labeled NoBill and Bill, with checkboxes as the values. Here is the default view of the table: https://i.stack.imgur.com/ZUvb2.png When the checkbox in the NoBill column is clicked, the total value (this.total) is calculated. The t ...

javascriptangularnpmangular6angular7

Unable to retrieve data on the frontend using Node.js and React

I have been attempting to retrieve all user data from the backend to display on the webpage. However, it seems that the getAllUsers() function is not returning a response, as no console logs are being displayed. Here is my ViewUsers.js file: import React, ...

javascriptnode.jsreactjsaxios

Managing the backspace function when using libphonenumber's AsYouTypeFormatter

I've been attempting to integrate the google-libphonenumber's AsYouTypeFormatter into a basic input field on a web form. For each key pressed by the user, I feed it into the inputDigit method. However, I've encountered an issue where when th ...

javascripttypescriptkeyboard-eventsbackspacelibphonenumber

What is the best way to transfer a PHP variable to an external PHP file I am retrieving data from using AJAX?

I have two files named index.php and ajax.php. In index.php, I am using AJAX to retrieve data from ajax.php and display it on the page. I want to pass the username to ajax.php so that I can use it in my SQL statement. Does anyone know how I can accomplish ...

javascriptphpjquerymysqlajax

Sharing FormikProps between components in React: A step-by-step guide

I am struggling to pass the necessary values and props that Formik requires to the component one level up. My approach involves using several small components for various forms, and I need to pass them through a complex component to be able to pass them do ...

javascriptreactjstypescriptreact-propsformik

Ways to dynamically update template URL in AngularJS during runtime

In my code located in app.js var app = angular.module('plunker', []); app.controller('MainCtrl', function($scope) { // Fetching data from API calls var empDept = GetEmployeeData(); var marFin = GetFinanceData(); var x = ...

angularjs

Utilizing jQuery to Bind AJAX Events without a DOM Element

The documentation for jQuery AJAX Events provides examples that all involve using a jQuery DOM Element to declare a binding, like so: $('.log').ajaxSend( hander ); I am interested in capturing jQuery AJAX Events without the need for a DOM Eleme ...

javascriptjquery

Problem with using Twitter Bootstrap in IE11 when Browser Profile Enterprise is enabled

I am facing an issue with a Bootstrap 3 web page. Some machines have IE configured to load intranet pages in Enterprise profile mode, while others have the default Desktop profile set in IE11. This configuration has caused the layout to break completely. ...

javascriptcsshtmltwitter-bootstrapinternet-explorer

Leaving Facebook with onbeforeunload functionality

Within my AngularJS application, I am utilizing the Facebook SDK. When I trigger FB.logout() upon clicking the logout button, it functions correctly: $scope.logout = function() { FB.logout() } However, I also aim to log out from Facebook when ...

javascriptangularjsfacebook-javascript-sdk

The absence of an object id is a common issue encountered in Django framework when data is sent from Angular

Here is a snippet of code that I am currently working on: { skillName : "Professional Skills" _id : {$oid: "5adf23946ab671bf6cb36aff"} } This code is being sent to the DjangoService function below: @csrf_exempt @api_view(['GET',& ...

angularjsdjangomongodb

What's causing this MUI React data grid component to be rendered multiple times?

I have developed a wrapper for the MUI Data Grid Component as portrayed: Selection.tsx: import * as React from 'react'; import { DataGrid, faIR, GridSelectionModel } from '@mui/x-data-grid'; import type {} from '@mui/x-data-grid/t ...

javascriptreactjsmaterial-ui

Tips for concealing a container in angularJS when all entries have been filtered

In my AngularJS 1.4.3 application, I have implemented a filter feature. My goal is to hide the div container if all entries in vm.nightServices are filtered out. Even though I tried using ng-show="vm.nightServices.length > 0", it did not work as expecte ...

angularjsangular-filters

The URL provided for the jQuery AJAX call is not valid

My ajax request is set up like this: $.ajax({ url: self.opts.url.replace('//www.', '//'), type: 'POST', ... }); To ensure accuracy, I included the .replace method. The URL stored in opts.url is "http://website.co ...

javascriptjqueryajax

Avoid interrupting the code execution until it has finished completely

Let's discuss a common scenario: $('button').on('click',function(){ // Performing AJAX requests (which may take some time); }); If the user clicks the button multiple times, numerous ajax requests can be triggered. To prev ...

javascriptjqueryajaxasynchronous

"Ensuring Username Uniqueness in AngularJS and CakePHP3: A Step-by-Step

<input type="email" id="username" dbrans-validate-async="{unique: isUsernameUnique}" ng-model="username" required class="form-control" name="username"> $scope.isUsernameUnique = function(username) { $http.get(url+'/isUsernameUnique&apo ...

javascriptangularjsapiangularjs-directivecakephp-3.0

Utilizing Ajax to retrieve data from Google Places API in JSON format

I've been working on a simple webpage that allows users to enter the name of a city in a text box and then displays basic information about it, such as the address and name. My main issue right now is with the Google Places API. Below is what I have m ...

javascriptajaxjsongoogle-places-api

Grant permission for a distant server to connect to the API server hosted on the local

I'm currently experimenting with home automation using my Raspberry Pi. I have successfully set up a Node+Express API server located at address http://192.168.100.100:3000, with the local folder being ~/api. This server is responsible for sending sign ...

javascriptnode.jsexpressnginx

Canvas featuring labels at the top with a strikethrough effect when utilizing a pie chart in chart.js

I am working on a piece of code that aims to showcase a summary of the most popular forms based on the number of inserted rows in their respective database tables. The goal is to visually represent this data using a pie chart generated with chart.js 2.8. & ...

javascriptphpbootstrap-4chart.js

Wait until the link is clicked before showing the list element

Is there a way to prevent the display of list element id="two" in the code below until link "#two" has been clicked, removing element id="one"? I am looking for a CSS or JS solution that completely hides the list element rather than just hiding it from vie ...

javascriptjqueryhtmlcss