Invoke the ng-click function within the ng-change function

Just starting out with angularjs and I have a question.

I am currently using single select and I want to retrieve the value selected and based on that value, perform an action. For example, if the value is "DELETE" then I would like to trigger the ng-click function called delete. Below is my code:

index.html

<body ng-app ng-controller="AppCtrl">
<select ng-model="some_action.type"  ng-change="actionchange(some_action.type)" ng-options="type.value as type.displayName for type in types">
</select>
</body>

script.js

function AppCtrl($scope) {

    $scope.some_action={
        type: 'Select'
    }

    $scope.types = [
        {value: 'DELETE', displayName: 'Delete'},
        {value: 'SUSPEND', displayName: 'Suspend'}
     ]
}

$scope.actionchange= function(value) {
 console.log('change action is -'+ value);
 //here I will fetch some ids which will be sent to another click function
};

So I am utilizing ng-click function separately for each action and aiming to use them within ng-change to trigger ng-click.

Answer №1

    function Controller($rootScope) {

        $scope.some_action = {
            option: 'Choose'
        }

        $scope.options = [{
                value: 'REMOVE',
                display: 'Remove'
            },
            {
                value: 'PAUSE',
                display: 'Pause'
            }
        ]
    }

    $rootScope.selectionChange = function(value) {
        console.log('selected action - ' + value);
        var idList= [];
        // condition to add ids to idList

        $rootScope.action_Remove(idList);
    };

$rootScope.action_Remove=function(idList){
// operations using idList
}

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

Even after setting the handler to return false, Angular continues to submit the form

In the following scenario, I have encountered an issue: Here is the HTML template snippet: <form [action]='endpoint' method="post" target="my_iframe" #confirmForm (ngSubmit)="submitConfirmation()"> <button type="submit" (click)="conf ...

Is there a way to capture the stdout and stderr output from a WebAssembly module that has been generated using Emscripten in JavaScript?

In my C++ code snippet below: #include <iostream> int main() { std::cout << "Hello World!" << std::endl; return 0; } I compile the code using: emcc -s ENVIRONMENT=shell -s WASM=1 -s MODULARIZE=1 main.cpp -o main.js This c ...

Sending information to an Ionic popover within an ng-repeat loop

Struggling to integrate Ionic Popover into my application under ng-repeat. How can I pass a parameter to it? <p ng-repeat="query in ctrl.timesheet">query.Name<button ng-click="openPopover($event)">Open Popover</button></p> <scr ...

Incorrect uploading of photos is occurring

Utilizing Html, AngularJs version 1.6.x, Dropzone.JS 4.3, as well as Load Image and Azure Blob Storage. When handling images on the front end: Images are automatically rotated based on their EXIF information They are resized with a maximum size of 1280 ...

Loop through the array while handling a promise internally and ensure completion before proceeding

I am currently working on populating a response array with Firestore snapshots and creating download links for stored files within each snapshot. Despite trying various solutions involving Promises, the response array consistently ended up being null. do ...

What could be causing the show button to change its style every time I click it?

I'm a beginner in the world of JavaScript. I have been working on customizing the "show more" button and encountered an issue. I managed to add text and a down arrow below the button, but when I click it, another button labeled "I don't know how ...

React Component that closes when it loses focus

In my React project, I am working on creating a custom select2 style component. Most of the functionality is complete, but I am struggling with figuring out how to hide the result box when the user clicks away. Here is the render method: render() { l ...

The functionality of PHP in relation to the jQuery post feature seems to be malfunction

After developing the JavaScript functionality for this contact form, below is the HTML structure without any CSS styling included: <!-- Contact Form --> <div class="cws-widget"> <div class="widget-title" style="color:#fec20b;">S ...

Customizing a Google chart legend to show on hover event

Utilizing the Google Chart API, I have created a line chart to display my data. To customize the legend, I initially set the chart's original legend to none and then designed my own legend according to my preferences. While everything is functioning ...

What is the best way to implement a custom toast delay in a React application using setTimeout

The concept is straightforward: When the function showToast is called, I aim to change my toast's className to show, and then remove it by replacing with an empty string after displaying it for 3 seconds. HTML: <div id="toast">New col ...

Differentiating Between Arrays and Objects in AngularJS ng-repeat

When using ng-repeat to display data in a View from an endpoint in the form of an atom feed, I encountered an issue. The endpoint returns JSON if the Accept header is 'application/json', but when there is only one entry in the atom response, the ...

JS unable to insert new row in table

I checked the input value before submitting it in the form and confirmed that it is correct, returning as a string.enter image description here const saveList = () => { const inputListNameText = inputListName.value; fetch('/api/lists' ...

Arranging unrelated divs in alignment

http://codepen.io/anon/pen/Gxbfu <-- Here is the specific portion of the website that needs alignment. My goal is to have Onyx Design perfectly aligned with the right side of the navbar, or to have the navbar extend up to the end of "Onyx Design". The ...

I am looking to send a combination of string and HTML data to the controller when using the Summernote editor in MVC

As a beginner in MVC development, there are certain aspects that I am still struggling with. Currently, I am using the Summernote Editor to compose blog posts and Ajax to submit them. However, I encountered an issue when trying to send both HTML data from ...

The Angular modal service is failing to show up on the screen

I am having trouble implementing the angular modal service in my web application. When I click on the button, the modal does not appear. Can someone help me figure out what I am doing wrong? Builder View <div ng-controller="BuilderController as vm"> ...

Best practices for using parent and child methods in Vue applications

I'm exploring the most effective approach to creating a modal component that incorporates hide and show methods accessible from both the parent and the component itself. One option is to store the status on the child. Utilize ref on the child compo ...

What is the best way to extract all "conditions" nested under the key "logic" at the 0th index in a JSON object?

I need to manipulate a nested object by removing every "condition" where the key is "logic" and the value is 0 from it. Here is an example of the object structure: Original input: [ { "conditions": [ { "logic": "AND", "paramet ...

What is the best way to execute the app functions, such as get and post, that have been defined

After creating a file that sets up an express middleware app and defines the app function in a separate file, you may be wondering how to run the app function. In your app.js file: const express = require('express') const cors = require('c ...

Parallax scrolling in all directions

Is there a resource available for learning how to program a website similar to the one at ? I am familiar with parallax but can't seem to find any examples that resemble what they have done on that site. ...

How can I create a fading trail effect in Three.js that diminishes over time?

I am interested in achieving a similar effect to the example I found on this website: However, my goal is to have the old trail gradually fade into the background over time instead of cluttering the screen with persistent marks. I discovered that by usin ...