Function does not recognize hidden elements

Asked

Viewed 30 times

0

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

<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 he is inside the end id=div, and sometimes I need to hide the whole div. I do it this way:

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

How can I hide the fields, and they continue to function ?

Edit: How 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 make it visible, it receives the values, if I put the style="display:None" it does not receive the values.

javascript ajax

  • Which plugin are you using there, girl? Wouldn’t it be the case that this lib is ignoring elements with display: none? You can add this information to the question?

  • Your code works: http://jsfiddle.net/gdt5zmo0/ can show you the exact way you are using it?

  • When I take the data in a function to pass to the controller, it does not receive it.

  • @Sergio, could it not affect the fact that she is using ASP NET CORE? because your test is not taking into consideration the compilation that Net Core makes

  • I updated the question with the data, I use the same function in webforms, and it works with the style="display:None", but in ASPNET CORE, it doesn’t work.

  • this code is run " dry" on the page or within a function? what is the code string to get to that point? (cc @Wallacemaxters)

  • The function is called by clicking the button, it works, when the elements are visible, if I put the None display, it does not recognize.

  • 1

    @Sergio my concern is whether . NET CORE may be "removing" elements with display: none. It’s just a guess. If it changes the behavior of the tag based on an attribute, I thought the same might happen in the case of the display: None

  • It worked here, instead of putting display:None, in the function even I hide, doing so: $("#txtDataTolerancia"). Hide(); $("#txtVencimentC"). Hide();

Show 4 more comments

1 answer

1

Create an object in javascript and pass it as parameters, instead of passing data: { DataInicio: dataInicio, , surely your controller has no optional parameters and when you don’t pass it the data doesn’t get into the controller.

Try to do it this way.

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)

  • The problem is not this, when the elements are visible it receives perfectly, already managed to solve. Thank you.

Browser other questions tagged javascript ajax

You are not signed in. Login or sign up in order to post.