Function does not recognize hidden elements

Question

Function does not recognize hidden elements

Navigation

#1 by (1 votes)

0

I have a function, it works perfectly, but I need to hide the fields, which do not need to appear for the client, but when hidden, the function does not receive the values,

<div class="col-md-4" id="fim">
  <label id="lblFim" class="control-label">Data Fim</label>
  <input id="txtVencimentoC" type="text" class="form-control" data-mask="00/00/0000" style="display:none" data-mask-reverser="false" />
  <input id="txtTol" type="text" class="form-control" data-mask="00/00/0000" style="display:none" data-mask-reverser="false" />
  <input id="txtDataTolerancia" type="text" class="form-control" style="display:none" data-mask="00/00/0000" data-mask-reverser="false" />
  <input asp-for="PS.DataFim" id="txtDataFim" type="text" class="form-control" data-mask="00/00/0000" data-mask-reverser="false" />
</div>

I'm using the:

style="display:none"

Remembering that it is inside the div id = end, and sometimes I need to hide the entire div. I do this:

$("#fim").hide();

How can I hide the fields, and they still work in the function?

edit: How do I get the data in the function:

  function GravarDados() {
var dataInicio = $("#txtDataInicio").val();
var dataFim = $("#txtDataFim").val();
var diaVencimento = $("#txtDiaVencimento").val();
var tolerancia = $("#txtTolerancia").val();
var valor = $("#txtValor").val();
var planoId = $("#cbplanos option:selected").val();
var tipoPlano = $("#txtTipoPlano").val();
var pessoaId = $("#id").val();
var proporcional = $("#lblProporcional").val();
var dataTolerancia = $("#txtDataTolerancia").val();
var vencimentoC = $("#txtVencimentoC").val();
var descricao = $("#cbplanos option:selected").text();
var pre = $('#cbpre').prop('checked');
var pos = $('#cbpos').prop('checked');
var pro = $('#cbproporcional').prop('checked');
var url = "/PessoasServicos/Gravar";

$.ajax({
    url: url
    , data: { DataInicio: dataInicio, DataFim: dataFim, DiaVencimento: diaVencimento, Tolerancia: tolerancia, Valor: valor, PlanoId: planoId, TipoPlano: tipoPlano, PessoaId: pessoaId, Descricao: descricao, Proporcional: proporcional, Pre: pre, Pos: pos, Pro: pro, DataTolerancia: dataTolerancia, VencimentoC: vencimentoC}
    , type: "POST"
    , datatype: "html"
    , success: function (data) {
        if (data.resultado > 0) {
            location.reload();
        }
    }
});
}

If I leave it visible, it gets the values, if I put the style="display: none" it does not get the values.

javascript ajax

asked by anonymous 04.07.2018 / 16:45

1 answer

How to capture the id of each row in a scrollable list? How to use Javascript with Bootstrap4?

score 1 · Answer 1

Create an Object in javascript and pass it as parameters, instead of passing data: { DataInicio: dataInicio, , surely your controller does not have optional parameters and when you do not pass it, the data does not load in the controller.

Try to do as follows.

var dados = Object();


dados.dataInicio = $("#txtDataInicio").val();
dados.dataFim = $("#txtDataFim").val();
dados.diaVencimento = $("#txtDiaVencimento").val();
dados.tolerancia = $("#txtTolerancia").val();
dados.valor = $("#txtValor").val();
dados.planoId = $("#cbplanos option:selected").val();
dados.tipoPlano = $("#txtTipoPlano").val();
dados.pessoaId = $("#id").val();
dados.proporcional = $("#lblProporcional").val();
dados.dataTolerancia = $("#txtDataTolerancia").val();
dados.vencimentoC = $("#txtVencimentoC").val();
dados.descricao = $("#cbplanos option:selected").text();
dados.pre = $('#cbpre').prop('checked');
dados.pos = $('#cbpos').prop('checked');
dados.pro = $('#cbproporcional').prop('checked');


$.ajax({
    url: url
    , data: { 'data':  dados}
    , type: "POST"
    , datatype: "html"
    , success: function (data) {
        if (data.resultado > 0) {
            location.reload();
        }
    }
});
}


[HttpPost]
public ActionResult XXXXXXXXX(string data)