AngularJS function failing to run JavaScript code

I encountered an issue when attempting to execute a JavaScript function within an Angular function. The error I am facing specifically mentions that the indexof and search functions are not functioning properly.

 <select class="form-control input-sm input_high" name="groupname" id="groupname" ng-model="tech_groupname">
                    <option value="">Select</option>
                    <option value="Dedicated-1">Test1</option>
                    <option value="Dedicated-2">Test2</option>
                    <option value="Yellow-2">Test3</option>
  </select>

<div class="ui-widget" ng-if="checkCorpPackage(tech_groupname)" ></div>

appTechInfo.controller('tech_info_ctrl', ['$scope',function($scope)
  { 
   //** check if package is corporate and need if start
    $scope.checkCorpPackage = function(temp_grp_name){
        //value is printed here if javascript function is not used
        console.log(temp_grp_name);

         //i have tested by getting data via scope too
        var test_data = $scope.tech_groupname;

        console.log(temp_grp_name.toLowerCase());
        /**
        if(temp_grp_name.indexof("Dedicated") > -1)
        {

           return true; 
        }
        else
        {
            return false;
        } 
         **/                  
    }
    //** check if package is corporate and need if start
  }]); 

Error log TypeError: Cannot read property 'toLowerCase' of undefined

i have searched similar problems but solution they are providing is not working for me

Answer №1

The variable temp_grp_name may become undefined as its value will change when the select control is modified. Therefore, you must check for undefined or null when handling it. Additionally, make sure to use the correct spelling of indexOf instead of indexof like this:

temp_grp_name.indexOf("Dedicated")

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

JQuery failing to trigger AJAX function

I'm struggling with what seems like a simple issue and it's driving me crazy. The problem lies in this straightforward section of the website. I have a .js file that uses ajax to save a post into the database when the submit button is clicked. A ...

What is the reason for not modifying the filtered and sorted data?

I am currently working on implementing filter options for an item list, but I am facing an issue where the filtering does not work when selecting dropdown options. Array in App.jsx const cameraShowList=[ {id:1,model:"Canon",title:"Canon ...

Creating a dynamic template in AngularJS directive

I am curious about how to create a dynamic template directive. Here's the challenge - when I am on the main page or main categories such as page1 or page2, my template should include all the divs. However, when I am on a submenu like subpage1 or subp ...

Importing a JavaScript file into another JavaScript file as text in React Native can be a convenient way

In my project, I have a file named MyFirstPage.js that contains the following code snippet: renderCards() { let icon = this.state.icon; .... .... .... } This code is responsible for rendering cards within the main render function. However, as the ...

Utilizing Vuetify color variables in combination with ternary operators: A guide

I'm experimenting with conditional logic to dynamically change the background color of a button. I've seen examples using the ternary operator to do so, but haven't come across any that utilize color variables defined in the theme options. I ...

Could not find yarn command even after installation with npm

Following the guidelines for yarn v2 installation, I tried to install using npm install -g yarn. I executed sudo npm install -g yarn on Ubuntu 20.04. However, after running this command, it returned "command not found." ❯ sudo npm install -g yarn > ...

Unusual escape_javascript quirk witnessed in Ruby on Rails

Once the ajax method is called, the escape_javascript function starts outputting </div> </div> </div> for each rendered item. Despite thoroughly checking all closing tags multiple times, I can't seem to identify any errors. Could thi ...

Issues encountered with sending post requests to a yii2 application when using Angular4

After implementing the following code: this.http.post('http://l.example/angular/create/', {name: 'test'}).subscribe( (response) => console.log(response), (error) => console.log(error) ); I encountered an error on ...

Combining Meshes in three.js LOD

I am searching for an efficient way to utilize the LOD Object from three.js (view example here). My concept involves creating an LOD method similar to the one outlined in chapter 2.1 (found here). The structure consists of 3 levels: a 3D model in close ...

Transferring PHP array data to JavaScript using echo

I'm currently in the process of working on a project that requires extracting data from a database and converting it into a JavaScript array. This array will be used to dynamically update a graph. Below is the PHP code I have written to retrieve the ...

Tips for avoiding redundant AJAX requests

Currently, I am working with JavaScript and not jQuery. Imagine a scenario where I have 3 users in my database [Kim, Ted, Box] and 3 buttons structured as follows: <button class="user">Kim</button> <button class="user">Ted</button> ...

Changing the size of an iframe and closing it by pressing the ESC

I am developing an application that requires the ability to resize an iframe. When the user clicks the "Full Screen" button, the iframe should expand to occupy the entire screen. The iframe should return to its original size when the user presses the "Es ...

What is the best way to restrict the degree of camera rotation in the left, right, up, and down directions in Three.js when using a

Although this question may have been asked before, I haven't been able to find a solution to my specific issue! I've set up a 3D canvas using WebGLRenderer, PerspectiveCamera, and OrbitControls. My camera's position is at 0, 10, 500 for the ...

What is the process for submitting a post request with custom fields to the Wordpress rest api?

Currently, I am attempting to make a post request to /wp-json/wp/v2/posts while also including custom fields. However, it seems that although the request field is successfully being sent, the custom fields are not updating with the data I am trying to send ...

Implement a counter in a JavaScript table, initializing it to zero

I have successfully written my code, but there is one issue. The first row is starting with the number one instead of zero. I'm looking for suggestions on how to start from zero. Any help would be greatly appreciated. Thanks! <script> var tabl ...

Error: The property 'open' is not defined in the mdMenu object

Encountered a bug while working with angular-material design... When using md-menu, if a sub menu item is opened (as shown in the image) and then hovering over a non-subMenu item (menu item), it throws an error "Cannot read property 'open' of nul ...

Display elements exclusively when the class XY is in an active state using JavaScript

Hello everyone, I'm new to this platform and excited to share my first post. Currently, I find myself facing a major challenge as I navigate through a bootcamp program. I have been working on a website with different sections that require specific fu ...

Ways to disseminate arguments when dealing with an array of arrays in JavaScript

Struggling to pass an array as arguments into the join method on path in node, but hitting a roadblock: var path = require("path"); var paths = [__dirname]; var userInput = ["app", "js"]; paths.push(userInput); var target = path.join.apply(null, paths); ...

Automatically submit upon selecting an option

Encountering some difficulties with the code provided below. Purpose of this code I have multiple list items (shown here is just a snippet) made up of select elements, options, and one submit input field. When an option is chosen, the user can click on ...

Using the Flow type checker with React library results in complications

I'm fairly new to JavaScript and React, so I appreciate your patience! I've recently started a project using create-react-app with React version 16.12.0. I installed a library that seems to be utilizing Flow. When attempting to use this library ...