What is the best way to invoke a controller function (where the controller can be dynamically assigned) from a personalized directive in AngularJS 1

Hey there, I've developed a custom directive that handles delete functionality across all screens. After deleting elements, I need to call a controller function to update the view. Keep in mind that the controller may vary based on the specific view.

angular.module('app.comon').directive('deletePopup', function modal(setterGetterService,restCallService) {
        return {

            template:'<div class="modal" id="delete-popup">' +
                       '<div class="modal-dialog">' +
                         '<div class="modal-content">' +
                           '<p>Are you sure you want to delete?</p>' +
                           '<div class="buttons-group text-center">' +
                             '<a ng-click="deleteList();" class="btn">delete</a> ' +
                             '<a ng-click="cancelAction()" class="btn btn-cancel">cancel</a> ' +
                           '</div>' +
                         '</div>' +
                       '</div>' +
                     '</div>',

            link: function (scope, element, attrs) {
                scope.cancelAction = function () {
                    $('#delete-popup').hide();
                }

                var dropper;

                scope.$on("DELETE_LIST", function(event, item){
                    dropper = item;
                 });

                 scope.deleteList = function () {

                    var deleteInfo =setterGetterService.getDeletePopupInfo();
    var headers =deleteInfo.headers;
                    var params = {
                        "URL" :deleteInfo.restCall ,
                        "METHOD" : deleteInfo.method,
                    }

                    restCallService.getResponse( headers, params)
                      .then(function(data) {
                        if (data.status == "success") {
                          alert("groupDeleted");     
                          $('#delete-popup').hide();         
                        } else {
                           alert(data.msg);
                        }

                     });

                }
            }
        }
    });

Answer №1

Your approach to communicating with other controllers needs adjustment. The most effective way to handle this is by triggering an event that alerts the other controller of a situation necessitating action.

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

Unable to change the value of Apexcharts components

Utilizing the Vue.js framework along with the Apexchart library, I have been able to create scatterplots for my data. By making use of Axios, I can successfully transmit my data and monitor it using console.log(). With the help of Apexcharts property updat ...

Animating Card depth on hover with Material UI

I am looking to add an animation effect to the Card component when the mouse hovers over it. I'm still fairly new to React and struggling with implementing it. Here is what I've tried so far: <Card linkButton={true} href="/servicios/ ...

What is the method to extract information from the provided URL?

Hello, I am looking to retrieve system requirements data from . How can I achieve this using JS or react? ...

Display the worth in a pop-up box

I am looking to display the form value in a pop-up window that opens after clicking the submit button. How can I achieve this? Here is my form: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> &l ...

When the react autocomplete dropdown appears, it pushes other input elements downward, affecting their

Having implemented an autocomplete dropdown feature by following this link, I am encountering an issue with displaying the dropdown items. As shown in the reference link, the dropdown items are rendered within a div tag with the position set to relative. ...

How to ensure your content is always visible on Mobile Safari iOS 8 by making sure it stays

Although minimal-ui is no longer supported on iOS8, I've encountered an issue with some fixed content at the bottom of a webpage. The page height is set to 100vh to cover the entire viewport, but some of the content at the bottom is extending below t ...

Using Javascript function with ASP.NET MVC ActionLink

I need help with loading a partial view in a modal popup when clicking on action links. Links: @model IEnumerable<string> <ul> @foreach (var item in Model) { <li> @Html.ActionLink(item, "MyAction", null, new ...

Page not reaching the very top when scrolled

Having a puzzling issue that's got me stumped. Currently working on my professor's website at jurgec.net. The problem is specific to the mobile version of the site. Whenever clicking on a link like "I am an undergraduate student," scrolling down ...

The login page continues to show an error message for incorrect credentials unless the submit button is clicked

My current project involves a React component called "Signin.js". Within this component, there are login input fields as I am working on creating a login system using Node.js, Express.js, and MySQL. To achieve this, I have set up a post request that sends ...

What is the top choice for creating a cutting-edge front-end web module?

Which generator or scaffold is recommended for creating a contemporary front-end web module using npm/webpack? ...

Transform an object into an array of objects by adding extra properties to each one

The following code snippet represents data in the form of an object with each key containing a date. The properties within the object include Open and Closed. If the value for Closed is 0, then that property is not included. let data = { "20 ...

How does code execution vary when it is wrapped in different ways?

(function($) { // Implement your code here })(jQuery); jQuery(function($) { // Add your code here }); ...

Coloring vertices in a Three.js geometry: A guide to assigning vibrant hues

This inquiry was previously addressed in this thread: Threejs: assign different colors to each vertex in a geometry. However, since that discussion is dated, the solutions provided may not be applicable to current versions of three.js. The latest versions ...

Steps to incorporating personalized HTML into a Mechanize page object

Is it feasible to insert custom HTML code into a Mechanize page object? The purpose is to circumvent the need for javascript code that generates a form, by incorporating the HTML produced by the javascript code into the mechanize page object fetched usin ...

Prevent Cookie Access from AJAX REST Request in JavaScript

We are in the process of developing a mobile application using web technology. Our endpoint (weblogic 11g) sends both a jessionid cookie and a _wl_authcookie_jessionid_ cookie which are automatically sent back to the server for authentication purposes. How ...

I am having trouble getting my AngularJS client to properly consume the RESTful call

As I venture into the world of AngularJS and attempt to work with a RESTful service, I am encountering a challenge. Upon making a REST call to http://localhost:8080/application/webapi/myApp/, I receive the following JSON response: { "content": "Hel ...

Using the outer ng-repeat's object property to filter nested ng-repeat items

I'm currently working on nesting two ng-repeats with two separate JSON files. The goal is to filter the second ng-repeat based on parameters from the first ng-repeat. The first JSON file, $scope.matches, includes information about each match in the W ...

AngularJS: The total is the accumulation of all corresponding objects

In my project, I’m dealing with an array of Requests that each contain an array of tasks. The goal is to update the duration field of each Request based on the sum of durations of its associated tasks and ensure that these changes are responsive to any u ...

Practical steps for programmatically adding or removing md-disable-backdrop in md-sidenav

Can the md-disable-backdrop attribute be removed from HTML? The issue arises when opening the side navigation as the md-sidenav does not have the md-disable-backdrop attribute. After making a selection from the form displayed in the side navigation, I now ...

Error: Unable to define $scope function in Angular and Jasmine integration

I am currently working with a controller var videoApp = angular.module('videoApp', ['videoAppFilters', 'ui.unique', 'angularUtils.directives.dirPagination']); videoApp.controller('VideoCtrl', function ($sc ...