Comments by simpledeveloper (Top 9 by date)

i don't know buddy, for some reason this isn't going well, this is the message I am getting after running the npm install

C:\Users\aaleem\Desktop\DevelopedProjects\React\AQView\AQView\ClientApp>npm install -g codesandbox
npm WARN deprecated datauri@1.1.0: Datauri 2.0 released. See more in https://github.com/data-uri/datauri/releases/tag/v2.0.0
npm WARN deprecated mimer@0.3.2: Mimer 1.0 released. See more in https://github.com/data-uri/mimer/releases/tag/v1.0.0
npm WARN deprecated socks@1.1.10: If using 2.x branch, please upgrade to at least 2.1.6 to avoid a serious bug with socket data flow and an import issue introduced in 2.1.0
C:\Users\aaleem\AppData\Roaming\npm\codesandbox -> C:\Users\aaleem\AppData\Roaming\npm\node_modules\codesandbox\lib\index.js
+ codesandbox@2.1.10
updated 1 package in 18.971s

Then when I run the following script this is the error that I am getting.

C:\Users\aaleem\Desktop\DevelopedProjects\React\AQView\AQView\ClientApp>codesankbox ./
'codesankbox' is not recognized as an internal or external command,
operable program or batch file.

What is the reason buddy?

Installing 2015 did work for me, its OK, all our packages are in 2015 so no problem. Thanks for all your help buddy

thank you and its beautiful for people to come and help, I tried complete VS 2017 installation, it didn't work, what is the reason IDK. I will try the other solution you have provided.

I made some progress, I was able to call the Get methods, but not able to call the Put and Post methods.
My Web Api methods are as follows, for some reason I am not able to call these Web Api methods, am I doing anything wrong these methods, please let me know:

    [Produces("application/json")]
    [Route("api/Employee")]    
    public class EmployeeController : Controller
    {
        EmployeeDataAccessLayer objemployee = new EmployeeDataAccessLayer();

        [HttpGet("[action]")]
        //[Route("api/Employee/Index")]
        public IEnumerable<TblEmployee> Index()
        {
            return objemployee.GetAllEmployees();
        }

        [HttpPost]        
        public int Create(TblEmployee employee)
        {
            return objemployee.AddEmployee(employee);
        }

        [HttpGet("{id}")]
        //[HttpGet("{id}", Name = "Details")]
        public TblEmployee Details(int id)
        {
            return objemployee.GetEmployeeData(id);
        }
        
        [HttpPut("{id}")]
        public int Edit(int id, TblEmployee employee)
        {
            return objemployee.UpdateEmployee(employee);
        }

        [HttpDelete("{id}")]
        public int Delete(int id)
        {
            return objemployee.DeleteEmployee(id);
        }

        [HttpGet("[action]")]
        public IEnumerable<TblCities> GetCityList()
        {
            return objemployee.GetCities();
        }
    }

I am trying to call this method using reactjs component, I am not able to call this method, can you please help me where am I making mistake
Here is my Table rendering component:

    private renderEmployeeTable(empList: EmployeeData[]) {
        return <table className='table'>
            <thead>
                <tr>
                    <th></th>
                    <th>EmployeeId</th>
                    <th>Name</th>
                    <th>Gender</th>
                    <th>Department</th>
                    <th>City</th>
                </tr>
            </thead>
            <tbody>
                {empList.map(emp =>
                    <tr key={emp.employeeId}>
                        <td></td>
                        <td>{emp.employeeId}</td>
                        <td>{emp.name}</td>
                        <td>{emp.gender}</td>
                        <td>{emp.department}</td>
                        <td>{emp.city}</td>
                        <td>
                            <a className="action" onClick={(id) => this.handleEdit(emp.employeeId)}>Edit</a>  |
                            <a className="action" onClick={(id) => this.handleDelete(emp.employeeId)}>Delete</a>
                        </td>
                    </tr>
                )}
            </tbody>
        </table>;
    }

Now I am calling it as below the Edit method as below

    private handleEdit(id: number) {       
        this.props.history.push("api/employee/edit/" + id);
    }

And I have Delete Web Api method that's not being called too from the above ts script file

        [HttpDelete("{id}")]
        public int Delete(int id)
        {
            return objemployee.DeleteEmployee(id);
        }

And I have Create method which is supposed to be called by ts file at the time of save button click that's not being called as well:

 [HttpPost]        
        public int Create(TblEmployee employee)
        {
            return objemployee.AddEmployee(employee);
        }

The ts script for the create call is as below on the save button click:

import * as React from 'react';
import { RouteComponentProps