AngularJS not detecting string values in arrays

I've run into a frustrating issue while working on an accounting project. When I input values into text boxes and click the Add Person button, the values are successfully added. However, when I attempt to save these values to the database by clicking the Save to Database button, the multiple entries do not display back onto my UI as expected.

In my SQL server table, there are multiple entries with the same first name. My goal is to retrieve all values with the same first name and populate them in the $scope.arr variable defined in my angular code.

While calling the $scope.GetPerson() method with an integer value (CustomerCode), the array ($scope.arr) gets populated correctly. But when passing a string value such as FirstName, the array does not populate with the matching entries from the database. I need assistance from experts to identify where I may be making a mistake.

Below are details of my Model, Angular JS script, C# controller, and HTML structure:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace TestProj.Models
{
    public class TestModel
    {
        public int ID { get; set; }
        public int CustomerCode { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public decimal Debit { get; set; }
        public decimal Credit { get; set; }
    }
}

If you're experiencing the same issue or have expertise in this area, your insights would be greatly appreciated!

Answer №1

The problem is related to your getPers() function. When you use JSON.stringfy(), it adds extra " to the string.

You should modify your code as follows:

this.getPers = function (personName) {
    var response = $http({
        method: "post",
        url: "/Test/GetPersonByFName",
        params: {
            firstname: personName
        }
    });
    return response;
}

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

How can I connect a row to a specific URI using ngTable or a similar tool?

Is there a way to link each row of a basic ngTable (example) to api/foo/first column? In this scenario, if the first row is clicked, it should redirect to /api/foo/Moroni. If achieving this with ngTable isn't possible, I'm open to solutions usi ...

Develop a Greasemonkey userscript that eliminates specific HTML lines upon detection

I am attempting to create a Grease Monkey script that can eliminate specific lines in HTML code. For example, consider the following: <ul class="actionList" id="actionList" style="height: 158px;"> <li class="actionListItem minion minion-0 fi ...

None of the Views are rendered after executing RedirectToAction

I created a Login Page that redirects to the required page after validation. However, when it redirects, the previous Login page view appears instead of the expected view. Below is the JavaScript code I am using: function abc() { var email = ...

Send the header script to dynamically loaded content via AJAX

While researching online, I discovered that the ajax load in jQuerymobile (JQM) does not contain the header javascripts. Here are some references for further reading: jQuery mobile tap event triggered for twice I am interested to know how the ajax conten ...

Retrieve the Checkbox id of a material-ui checkbox by accessing the object

I'm currently working on extracting the id of a Checkbox object in my JSX code. Here's how I've set it up: <div style={{display: 'inline-block', }}><Checkbox id='q1' onclick={toggleField(this)}/></div> ...

The error message thrown is: "Before executing this.props.action, .map

Currently, I am encountering an error message indicating that .map is undefined. It seems like this.props.action is not complete, causing the .map function to be unable to iterate over any items. Within the reducer: case GET_DEALERSHIP_GOAL_TYPE_SUCCESS: ...

How can you use window.open to open a URL and send information to it?

Is it possible to interact with a page opened using window.open() and pass data to it? For instance, can you input data into a text field on the opened page? Is it feasible to access elements on that page by their ID similar to using getElementById()? Ar ...

Angular Express encountering URL mismatch when retrieving files post-refresh

Currently, I am developing a small MEAN stack application. One of the features is that when an image is clicked, it displays a partial containing information about the image. Everything was working fine initially. However, after refreshing the page, Angula ...

Exploring the world of JSON communication through MVC Web API: A comprehensive guide

Similar cases to mine have been answered before, but my specific needs always seem to differ from others' problems. I am facing an issue where I'm sending JSON data from my HTML page to the MVC Web API, but unfortunately, the data I receive is a ...

Personalized Google Page Translate

I have attempted to use various scripts mentioned in this discussion on Implementing Google Translate with custom flag icons. Unfortunately, none of them seem to be working for me. While one script successfully switches between languages, it fails to rese ...

Maintaining Object Position in 2D Transforms

I am trying to create multiple perspective-transformed rectangles in the lower right corner of a canvas by using ctx.transform: ctx.transform(1, 0, -1, 1, 10, 10). My goal now is to adjust the size of the drawing based on a variable scale=n, while keeping ...

What is the best way to send variables from one page to another using jQuery or Javascript?

Is there a way to use POST with jQuery/Javascript to send data to another page and then redirect to that page? Instead of using GET... Using Javascript window.location = 'receivepage.php?variable='+testVariable; Once it's received by PHP ...

Tips on making a chrome extension button interact with an injected JavaScript file

My Chrome extension injects a JS file into webpages and opens a popup when clicked in the browser. The issue is that the injected file often cannot communicate with the rest of the extension. How can I resolve this problem? I'm still relatively new t ...

The return value from the (VUEX + JEST) function is not defined

While working on a test, I ran into an issue. Despite double-checking everything, I can't seem to call the function correctly. Can anyone please assist me with this? The code in index.vue looks like this: import { shallowMount, createLocalVue } from ...

Updating the country values in dropdown box1 using the onchange event with AJAX

I've hit a wall where I'm trying to populate the country after receiving an ajax response, but it's not displaying as selected. Here is the image for reference. If I select a country other than those in Africa, I should see all countries in ...

What could be causing the User object in the auth0/nextjs useUser hook to have missing properties?

The user object retrieved using the useUser hook from auth0/nextjs package seems to be missing some important properties: { "nickname": "example", "name": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="bedbc6dfd3ced2dbfec7 ...

I continue to encounter the following error message: A system error occurred while attempting to convert 'AngularTest' into an Angular project

I encountered an issue while attempting to integrate Karma into my Eclipse project. The error occurred during the conversion process to AngularJS: While converting 'AngularTest' to an angular project, I faced the following internal error: loader ...

Sending Java Servlet JSON Array to HTML

I am currently engaged in a project that requires extracting data from a MySQL database and implementing pagination. My approach involves utilizing JSON AJAX and JavaScript, although I am fairly new to JSON and AJAX. After successfully retrieving the neces ...

A Sweet Alert to Deliver your Morning Toasty Message

I seem to be encountering an issue with my toast message. Instead of the toast popping up immediately after submitting the form, it keeps appearing even if I haven't submitted the form and even when navigating from another page to this one, the toast ...

Switching the background image when hovering over a list element

Looking at the screenshot, it's clear that there is an unordered list with a background image set on the div. What I am trying to achieve is to have the background image change whenever I hover over a list item. Each list item should trigger a differe ...