Sending a string to a function in Angular

I thought this task would be straightforward, but for some reason, I am unable to make it work. The only thing I need to do is pass a string to the function.

Here's what I have tried:

<form ng-submit="edit(type)" ng-init="type='debt'">

Additionally, I also attempted:

<div ng-controller="FormCtrl">      

  <form ng-submit="edit('debt')">
        <input type="submit" value="ADD">
  </form>

</div>

Checking the JavaScript side of things:

app.controller('FormCtrl', function ($scope, $cookies, $http){

    $scope.edit = function(typ){
    alert(typ);
    }

});

All I am trying to achieve is to display an alert with the word 'debt'. However, instead of that, I keep getting 'undefined'.

Answer №1

Your code is functioning properly, but you encountered an issue because you included the `$cookies` dependency without adding `angular-cookies.js` to your app (module name `ngCookies`). This caused a problem on your page. If you need `$cookies`, make sure to include the appropriate reference. Otherwise, remove the `$cookies` reference.

View Working Plunkr

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

Trigger a click event on a div element that is nested within a form

Having trouble displaying an alert when clicking on a disabled button because the user needs to first click on a terms checkbox. Here's my jQuery code: $('#divButton').on("click", function() { if ($('#buybutton').prop('d ...

Leverage selenium to enter data for numerous elements by utilizing xpath

I am new to using Selenium and I am exploring ways to locate a series of input elements using xpath or css. My goal is to iterate over each element and input text into them. For example: <form> value1 <input type="text" placeholder="value1"> ...

angular click triggers the following content

How can I make the following content appear when clicked? I have a list of content that displays up to 20 items, but I want to show the rest when clicked. I have created the nextMovieList method for this purpose. import { Component, OnInit } from ' ...

Issues with local storage ternary expression in React are causing unexpected behavior

I am attempting to accomplish this task. const userToken = localStorage.getItem('token') {userToken.length ? null : <div className='registerLogin'> Register... </div> } The ternary operator is not working ...

Adding real-time value to AngularJS directives without triggering reassessment

Seeking guidance on utilizing an AngularJS directive as an HTML element, with the intention to provide it two values. One will be fetched by iterating through a collection, while the other will be derived from that value: <mydirective myval="val" mymag ...

Dispatching multiple selections to the server

My form includes multiple selects (using Select2) and I'm trying to submit the data to the server using HTML5's Formdata object. Everything works well when sending text or files, but not in this particular case. I've set the name attribute ...

Understanding the distinction among servlet responses in JavaScript?

I have a situation on my website where I am utilizing ajax to send information to a java servlet and then using the following javascript code to read the response: $.ajax({ url : 'myfirstservlet', async: false ...

troubles with variables in AngularJS Formly templates

Having trouble displaying model or other variables in my template? Check out this link for reference: http://jsbin.com/wofulinufo/edit?html,js,output. Question: What is the solution for displaying variables from controller? Even when I try using {{model} ...

Get started with adding a Typescript callback function to the Facebook Login Button

I am in the process of implementing Facebook login into my Angular7 application using Typescript. Although I have successfully integrated Facebook's Login Button plugin for logging in, I am facing issues with providing a callback method to the button& ...

Unable to detect the click event on Bootstrap accordion

I am currently utilizing Bootstrap to populate a table with data and then attempting to capture an accordion show event. My intention is to extract the div id in order to make an ajax call for more information on the respective item. Unfortunately, I have ...

Is it possible for Selenium's JavaScript Webdriver to interact with global JavaScript variables?

Looking to access global variables using JavaScript with WebDriver. Here is my code snippet: this.Then(/^I read global var$/, function (selectedElement) { fetchGlobalVar(window.location.href); }); function fetchGlobalVar(varName){ return varName; } ...

I encountered an unexpected obstacle while reloading my Next.js application with animejs. The error message reads: "SyntaxError: Unexpected token 'export'." This unwelcome occurrence took place during the

Encountering an error with animejs when reloading my Next.js app: An unexpected token 'export' is causing a SyntaxError. This issue occurred during the page generation process. The error originates from file:///Users/.../node_modules/animejs/lib ...

The inserted button's click event does not trigger the contentEditable DIV

I have a contentEditable DIV that I manage using the directive below: <div class="msg-input-area" [class.focused]="isMsgAreaFocused" contenteditable [contenteditableModel]="msgText" (contenteditableModelChang ...

Maximizing efficiency when conducting a thorough analysis of the contents within a JSON object and implementing jQuery

I am currently using an ajax call to send data to a controller and retrieve json data in return. Here is an example of the data that is returned: { "old": "The Old Password field is required.", "new": "The New Password field is required.", "n ...

Forward to a task with a unique identifier obtained through asynchronous JavaScript calls

I am currently working on an application that utilizes AJAX with FullCalendar functionality. My goal is to enable users to click on a specific item on the calendar, prompting a dialog box with a "View Details" button. Clicking on this button should redire ...

Pattern matching for identifying repeated numeric sequences

I'm struggling to come up with a regular expression to identify patterns of repeated numbers (more than twice) such as: 1111 or a1111 or test4555 Can anyone lend a hand with this, please? ...

Create an input field that limits the user to typing only three unique characters

How can I restrict the user to input only three characters in a text field? Specifically, I want to limit it to either 3, 6, or 9. ...

Tips for sending multiple values to the next page using AngularJS

Hey there, I'm new to AngularJS and currently using Onsen UI in my demo application. I have two pages in my app and I'm trying to pass two values to the next page. I managed to pass one value successfully, but when I attempt to send the second on ...

What is the purpose of using CORS with Express?

Here is how my express server setup looks: const cors = require('cors'); const express = require('express'); const app = express(); const port = 8000; app.use(cors({origin: 'http://localhost:8000'})); // Handle requests of c ...

Is it necessary to validate, sanitize, or escape data before utilizing the build method in sequelize.js?

I currently have a node/express/sequelize application where I am utilizing the build method in sequelize to generate instances of my foo model. Foo Controller exports.create = function(req, res) { var foo = db.Foo.build(req.body); foo.save().t ...