The function was triggered upon the form loading, instead of being activated when the button was clicked

Question

The function was triggered upon the form loading, instead of being activated when the button was clicked

The issue I am facing is that in the code snippet below, the function readCSV() is not being triggered when buttons for filepath1 and filepath2 are clicked. The function is only executed on form load. I was expecting it to work on button click as well.

I would appreciate any assistance with this matter.

Thank you!

<!DOCTYPE html>
<html ng-app="test" ng-controller="homePage">
... (original code snippet) ...

Script section

var test=angular.module("test",[]);
test.controller('submitController',function readCSV($scope, $http){
        var csv = "hello";//$scope.csvPath;
        $scope.filePath1;
        alert(csv);
});

javascript angularjs

Answer 1

Answer №1

The method in which you defined the controller is incorrect. It is unnecessary to include readCSV within the controller. Also, keep in mind that the controller is automatically initialized when the application loads.

If you want to invoke a function, follow this format:

var sample=angular.module("sample",[]);
sample.controller('submitController',function($scope, $http){
        $scope.readCSV=function(){
          //Perform actions here
        };
});

Answer 2

The method in which you defined the controller is incorrect. It is unnecessary to include readCSV within the controller. Also, keep in mind that the controller is automatically initialized when the application loads.

If you want to invoke a function, follow this format:

var sample=angular.module("sample",[]);
sample.controller('submitController',function($scope, $http){
        $scope.readCSV=function(){
          //Perform actions here
        };
});

Answer 3

Answer №2

Give this a shot:

let example = angular.module("example", []);
example.controller('uploadController', function ($scope, $http) {
    $scope.loadFile = function () {
        let file = "world";//$scope.filePath;
        $scope.filePath2;
        alert(file);
    }
});

Answer 4

Give this a shot:

let example = angular.module("example", []);
example.controller('uploadController', function ($scope, $http) {
    $scope.loadFile = function () {
        let file = "world";//$scope.filePath;
        $scope.filePath2;
        alert(file);
    }
});

The function was triggered upon the form loading, instead of being activated when the button was clicked

Script section

Answer №1

Answer №2

Similar questions

Guide to integrating various HTML files into a single HTML file with the help of Vue.js

Encountering a problem while trying to install ionic-native using npm

Revive the JavaScript library for handling mouse wheel events

Monitoring the "signed in" status within an AngularJS platform

Does the Node Schedule library create new processes by spawning or forking them?

"Combining multiple attributes to target elements while excluding specific classes

How can you display a border around a <td> element in an HTML table only when it contains data, using jQuery or JavaScript?

Issues with Ionic Toggle displaying incorrect value

Can you provide a guide on how to retrieve an HTML file using JSON?

Capturing all requests - javascript

Dealing with AJAX error in pure JavaScript

Using $index in ng-class to dynamically apply form validation styles

Developing a Generic API Invocation Function

Is it possible to refresh the chat-box using PHP?

Displaying various Vue components within Laravel 6.x

Validation of nested phone numbers using jQuery

When both input fields share the same directive, scope.$eval() will be undefined

Change element's parent property's child property into an array form

Firebase web authentication is most effective upon the second attempt

Enforce file selection using AngularJS based on certain conditions