Send Angularjs object to C#API POST

Question

I am not able to save the data registered in a form in the SQL Server database.

The structure is as follows:

The class:

public partial class EMPRESAS_PARTICIPANTES
{
    public int ID { get; set; }

    public int ID_AUX { get; set; }

    [StringLength(150)]
    public string NOME_FANTASIA { get; set; }

    [StringLength(20)]
    public string CNPJ_CPF { get; set; }

    [StringLength(20)]
    public string TELEFONE_01 { get; set; }

    [StringLength(20)]
    public string CELULAR { get; set; }

    [StringLength(100)]
    public string EMAIL { get; set; }
}

I have a form:

<form name="novoCrmForm">
    <div class="row">
        <div class="form-group text-left col-md-8">
            <label for="Nome">Nome <i class="danger">*</i></label>
            <input type="text" class="form-control" ng-model="empresaParticipante.nomE_FANTASIA" name="nomE_FANTASIA" placeholder="Nome" ng-required="true" ng-minlength="2" ng-maxlength="150">
        </div>
        <div class="form-group text-left col-md-4">
            <label for="cpf">CPF</label>
            <input type="text" class="form-control" ng-model="empresaParticipante.cnpJ_CPF" name="cnpJ_CPF" placeholder="CPF" ng-required="true">
        </div>
    </div>

    <div class="row">
        <div class="form-group text-left col-md-6">
            <label for="Celular">Celular <i class="danger">*</i></label>
            <input type="text" class="form-control" ng-model="empresaParticipante.celular" name="celular" placeholder="Celular">
        </div>
        <div class="form-group text-left col-md-6">
            <label for="Telefone">Telefone</label>
            <input type="text" class="form-control" ng-model="empresaParticipante.telefonE_01" name="telefonE_01" placeholder="Telefone">
        </div>
    </div>
    <div class="row">
        <div class="form-group text-left col-md-12">
            <label for="Email">Email <i class="danger">*</i></label>
            <input type="email" class="form-control" ng-model="empresaParticipante.email" name="email" placeholder="Email" ng-required="true" ng-minlength="2" ng-maxlength="50">
        </div>
    </div>
</form>

<button type="button" class="btn btn-info" data-dismiss="modal" ng-click="adicionarRegistro(empresaParticipante)" ng-disabled="novoCrmForm.$invalid">Salvar</button>

and from save, send to an Angularjs Function:

var adicionarRegistro = function (empresaParticipante) {
    empresaParticipante.data = new Date();
    $http.post("http://localhost:50183/api/crm/salvar", empresaParticipante).success(function (data) {
        delete $scope.empresaParticipante;
        $scope.novoCrmForm.$setPristine();
        carregarRegistros();
    });
};

In this Function of Angularjs, sends the object to the API in C#. The problem is that already when receiving the parameter, in the method signature, it arrives empty.

[Route("salvar")]
[HttpPost]
public HttpResponseMessage post([FromBody] EMPRESAS_PARTICIPANTES empresaParticipante)
{
    IEmpresas_ParticipantesBO Empresas_ParticipantesBO = new Empresas_ParticipantesBO();
    Retorno retorno = new Retorno();

    try
    {
        //salvar
        retorno = Empresas_ParticipantesBO.salvar(empresaParticipante);
    ...
    } 
    catch(Exception){}
}

Does anyone know why the object is coming to the empty API? How can I resolve?

---

Obs.:

• I’m only using some table fields,

• Table has no mandatory fields,

• The class was mapped with Codefirst.

Answer 1

You own the EMPRESAS_PARTICIPANTES class?

Here’s an example I did:

 public HttpResponseMessage Post([FromBody]RRNC plano)
        {
            try
            {
                rnc.Salvar(plano);

                this.texto = new HttpError(mensagem.PostWeb());
                return Request.CreateResponse(HttpStatusCode.OK, texto);

            }
            catch (Exception)
            {
                this.texto = new HttpError(mensagem.ErroWeb());
                return Request.CreateResponse(HttpStatusCode.InternalServerError, texto);
            }

        }

Angular:

recursoRNC.salvar($scope.rnc, function (retorno) {
                    notificacao.informacao(retorno.Message);
                    $scope.buscarTodos();
                }, function (erro) {
                    notificacao.alerta(erro.data.Message);
                });

At the angle, companyParticipant, has the same field name as in Webapi EMPRESAS_PARTICIPANTES?

Answer 2

I managed to make the button that is not to call the Function of Angularjs.

Although I don’t quite understand the reason. Yet!

the Solution was as follows:

When starting the Angular App, I played for a variable, and when instantiating the controller, I did not declare the angular.module("Crm" []); again, but only entered the controller into the variable that had already declared my app.

following example below:

var crmApp = angular.module("Crm", []);
crmApp.controller("CrmCtrl", function ($scope, $http) {

After this assignment, my form is calling the Angular Function.