The $modal popup function does not recognize the scope value as an object when it is undefined

I'm facing an issue with my code that involves using a $uibModal popup to add a new record. Despite passing the scope object into the function to save it, I keep getting 'undefined' as the result. Below is the code snippet along with the [plunker] (http://plnkr.co/edit/WXKCyzlfJFCA3FB7S2pa?p=preview) link.

  $scope.userList=[];
  $scope.addUser = function(){
    $uibModal.open({
      templateUrl: 'userData.html',
      controller: 'MainCtrl'
    });
  };
  $scope.addNewUser=function(user){
    console.log(user);
    $scope.userList.push({
      'id': user.id,
      'name': user.name,
      'age': user.age,
      'gender': user.gender
    });
    $scope.clearUserArea(user);
  };
  $scope.clearUserArea = function(user){
    console.log(user);
    user.id='';
    user.name='';
    user.age='';
    user.gender='';
  };

If anyone could help me pinpoint where I might be going wrong in this code, that would be greatly appreciated. Also, feel free to check out my plunker link for more details on this.

Answer №1

In your code, there was a typo in ng-modal. The correct syntax should be ng-model instead of ng-modal.

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

Trouble getting custom directives to work on Angular when using SSL

Take a look at the following two pages: (https)[url]/cart and (http)[url]/cart You'll see that there are console errors on the secure version but none on the insecure one. I'm using Angular custom directives that aren't being resolved ov ...

Is there a way for me to automatically close the navbar by clicking anywhere on the body of

Here is the structure of my navigation bar: <div id="mySidenav" class="sidenav"> <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a> <span ...

Waiting for update completion in Firebase Firestore (Javascript for web development)

When I retrieve a document, update it, and then try to access the updated data, I am getting undefined logged. Can anyone explain why this is happening and suggest a solution for successfully fetching the new data from the document? db.collection("collect ...

Is using canvas the best option for creating simple image animations with JavaScript?

I am currently working on a basic animation project using JavaScript. This animation involves switching between 13 different images per second to create movement. I have created two simple methods for implementing this animation. The first method involves ...

The error occurred while trying to cast the value of "{{Campground.name}}" to an ObjectID. This value, which is of type string, could not be converted to an ObjectID at the path "_id" for

const express = require("express"); const session = require("express-session"); const cookieParser = require('cookie-parser') const mongoose = require("mongoose"); const { Campground, User, Review } = require(" ...

Can an element on a webpage be dynamically assigned an ID using JavaScript or PHP?

Is it possible to dynamically set the ID of an element during runtime of a webpage? Let's consider this scenario - <body id="body1"> Now, I would like to dynamically set the ID of this "body" element using a variable value in PHP code. Is som ...

Retrieving input values with JQuery

HTML <td data-title="Quantity"> <div class="clearfix quantity r_corners d_inline_middle f_size_medium color_dark m_bottom_10"> <button class="btn-minus bg_tr d_block f_left" data-item-price="8000.0" data-direction= ...

When using angular.less, the @import feature is functioning correctly but a 404 error is displayed in the

Currently, I am working on a project using AngularJS along with angular.less. To centralize all my constants, I have stored them in one .less file and imported it at the beginning of all my other less files using a relative path: @import "constants" Even ...

How to access and modify the parent controller's array from a child controller within an ng-repeat iteration

I am facing a challenge where I need to perform manipulations on items within an array that is stored in a parent controller. The twist is that these manipulations have to be done from within an ng-repeat loop inside a child controller. After looking into ...

Tips for utilizing a for loop within an array extracted from a jQuery element for automation

I am looking to streamline the process using a for loop for an array containing 10 image files in the parameters of initialPreview and initialPreviewConfig. My envisioned solution involves the following code snippet: for (i = 0; i < 11; i++) { "< ...

Transforming a THREE.js shader into a PIXI.js shader

I am currently exploring the world of PIXI.js and custom Shaders, and I must admit, it's a bit overwhelming for me. I came across a GLSL Shader (created by DonKarlssonSan) that I would like to convert to PIXI.js in order to compare performance. Any as ...

Exploring the Possibilities of Wordpress Search with Multiple Dropdown Options

Is it possible to search across multiple categories? For example, I have 4 dropdown menus: 1. City 2. Area 3. Month 4. Products/Services When a user visits my site, they will see a static page with 4 dropdown lists and a "search" button. After the user ...

I am encountering an issue with the material ui dropdown component in my react native app where I am receiving a TypeError stating that it cannot read the property 'style' of undefined. This error is likely caused

Upon installation of Material UI and importing The Dropdown component, I encountered the error TypeError: Cannot read property 'style' of undefined, js engine: hermes. This is my code import React, { useEffect, useState } from "react"; import { ...

Store data in Firebase Storage and retrieve the link to include it in Realtime Database

Utilizing Firebase Realtime Database and Firebase Storage for this application involves uploading images from the pictures array to Firebase Storage. The goal is to obtain the Firebase Storage link for each image, add it to the object pushed into imagesU ...

Converting JSON-style data into a string with the power of node mysql

Just a quick note - I'm a total newbie in the world of web development, so I might be missing an obvious solution here. My challenge is to insert a dataset into a MySQL database using nodejs/expressjs/mysql. I've managed to establish a connecti ...

Creating a registration and authentication system using firebase

When using Google authentication with Firebase, is the Signup and Login logic the same? I am creating a page for user authentication but I'm unsure if I should have separate pages for signing up and logging in. This confusion arises from the fact that ...

Assign a JavaScript variable upon clicking a polygon on Mapbox

I have a MapBox map that consists of approximately 800 polygons representing census tracts, created using TileMill. The map has been integrated into an HTML page alongside a D3.js chart. A drop-down menu on the page allows users to select one of the 800 ce ...

ES6 Conditional Import and Export: Leveraging the Power of Conditional

Looking to implement a nested if else statement for importing and exporting in ES6? In this scenario, we have 2 files - production.js and development.js which contain keys for development and production code respectively. Additionally, there is another fil ...

"The jQuery colorpicker function is not functioning properly when applied to newly added elements

I've got these amazing gadgets with a cool sliding box feature inside. Initially, there are two widgets visible on the page, but you have the option to add or delete a widget as needed. Within the sliding box, there is a color picker tool. Interestin ...

retrieve HTML content from XML document using the correct user input

I am looking to create a section of an HTML page that can only be accessed through a specific code. The page is coded using pure HTML, CSS, and JavaScript. Here is the proposed logic: User inputs a string into a form Upon clicking the submit button, an ...