Collect own value

You are attaching the change event to the field that you refer to which you want to collect value , so in order to collect the value yourself, just refer to the this object or its representation in jQuery $(this) :

$('.dataFimVigenciaPlanoVigente').on('change', function(e){
  var $this    = $(this),
      meuValor = $this.val();
//...

See answer from @Borachio in this question of yours.

Your line:

var dataFimVigenciaPlanoVigente = $this.parent('td').find('.dataFimVigenciaPlanoVigente').val();

It is unnecessary because you are starting the field, going up to the parent element td , locating the field itself and then extracting its value . You can reduce the line to:

var dataFimVigenciaPlanoVigente = $this.val();

Related topic: What is the difference between $ (this) and $ this and this? .

Element cache

For the element with class dataFimVigenciaPlanoVigente , you are putting your reference in the cached DOM, however, to find your parent element you are constantly performing a search.

Your code could go to:

$('.dataFimVigenciaPlanoVigente').on('change', function(e){
  var $this = $(this),
      $wrap = $(this).parent('td');
// ...

And then to use:

var nomeCanalVenda =  $wrap.find('.nomeCanalVenda').val();

Twice the same value

When collecting the values of the various input , there is one that you are collecting twice for two different variables:

// Aqui por ID ao input dataInicioVigenciaAssociacaoPlano
var dataInicioVigenciaPlanoVigente = $this.parent('td').find('#dataInicioVigenciaAssociacaoPlano').val();

// ...

// Aqui por Class ao input dataInicioVigenciaAssociacaoPlano
var dataInicioAntesDeAlteracao = $this.parent('td').find('.dataInicioVigenciaAssociacaoPlano').val();

Working with "siblings"

Since you're working with sibling elements, you do not need to find parent , you can use the siblings() that returns the "sibling" elements:

Where you have:

var nomeCanalVenda =  $this.parent('td').find('.nomeCanalVenda').val();

You would have:

var nomeCanalVenda =  $this.siblings('.nomeCanalVenda').val();

Less code, better understanding.

$('.dataFimVigenciaPlanoVigente').on('change', function(e){

    var $this = $(this);

    var dataFimVigenciaPlanoVigente    = $this.val(),
        nomeCanalVenda                 = $this.siblings('.nomeCanalVenda').val(),
        dataInicioVigenciaPlanoVigente = $this.siblings('.dataInicioVigenciaAssociacaoPlano').val(),
        codigoCanalVenda               = $this.siblings('.codigoCanalVenda').val(),
        dataInicioAntesDeAlteracao     = $this.siblings('.dataInicioAntesDeAlteracao').val(),
        dataFimAntesDeAlteracao        = $this.siblings('.dataFimAntesDeAlteracao').val();

    // Apenas para debug
    $("#valoresObtidos").html("Valores obtidos: " + dataFimVigenciaPlanoVigente +" "+ nomeCanalVenda +" "+ dataInicioVigenciaPlanoVigente +" "+ codigoCanalVenda +" "+ dataInicioAntesDeAlteracao +" "+ dataFimAntesDeAlteracao);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><form><table><tr><td><inputtype="hidden" name="canalVendaVO.codigo" id="codigoCanalVenda" class="codigoCanalVenda" value="1" />
                <input type="hidden" name="canalVendaVO.nome" id="nomeCanalVenda" class="nomeCanalVenda" value="2" />
                <input type="hidden" name="dataInicioVigenciaAssociacaoPlano" id="dataInicioVigenciaAssociacaoPlano" class="dataInicioVigenciaAssociacaoPlano" value="3" />
                &nbsp;&nbsp;&nbsp;&nbsp;At&eacute;&nbsp;&nbsp;&nbsp;&nbsp;
                <input type='text' data-mask="data" data-date-type="default" size='10' maxlength='10' value="4" id="dataFimVigenciaAssociacaoPlano" class="dataFimVigenciaPlanoVigente" />
                <input type="hidden" name="dataInicioAntesDeAlteracao" id="dataInicioAntesDeAlteracao" class="dataInicioAntesDeAlteracao" value="5" />
                <input type="hidden" name="dataFimAntesDeAlteracao" id="dataFimAntesDeAlteracao" class="dataFimAntesDeAlteracao" value="6" />
            </td>
        </tr>
    </table>
</form>
<!-- apenas para debug -->
<div id="valoresObtidos"></div>

Multiple variables

When you want to declare multiple variables in JavaScript, you do not need to be constantly typing var , you can use the , tab as follows:

var dataFimVigenciaPlanoVigente    = $this.val(),
    nomeCanalVenda                 = $this.siblings('.nomeCanalVenda').val(),
    dataInicioVigenciaPlanoVigente = $this.siblings('.dataInicioVigenciaAssociacaoPlano').val(),
    codigoCanalVenda               = $this.siblings('.codigoCanalVenda').val(),
    dataInicioAntesDeAlteracao     = $this.siblings('.dataInicioAntesDeAlteracao').val(),
    dataFimAntesDeAlteracao        = $this.siblings('.dataFimAntesDeAlteracao').val();

Repeated IDs

In your code, it is applying id to input , but since you have those input within a cycle, what will happen is that you will end up with the repeated IDs on the page.

According to the rules, id is a single selector , being a way to reference a single object. The classes are common selectors , the same being a form of multiple references elements of a single instead.

For example, where you have:

<input type="hidden" name="canalVendaVO.codigo"  id="codigoCanalVenda" class="codigoCanalVenda" value='<s:property value="canalVendaVO.codigo" />' />

You should change to:

<input type="hidden" name="canalVendaVO.codigo" class="codigoCanalVenda" value='<s:property value="canalVendaVO.codigo" />' />

The idea is to remove all% of% of these fields that will be repeated over the cycle thus avoiding unpredictable JavaScript results.

Optimized code

Your code with the above corrections and suggestions is as shown below:

• Using id

  $('.dataFimVigenciaPlanoVigente').on('change', function(e){
  
      var $this = $(this),
          $wrap = $this.parent();
  
      var dataFimVigenciaPlanoVigente    = $this.val(),
          nomeCanalVenda                 = $wrap.find('.nomeCanalVenda').val(),
          dataInicioVigenciaPlanoVigente = $wrap.find('.dataInicioVigenciaAssociacaoPlano').val(),
          codigoCanalVenda               = $wrap.find('.codigoCanalVenda').val(),
          dataInicioAntesDeAlteracao     = $wrap.find('.dataInicioAntesDeAlteracao').val(),
          dataFimAntesDeAlteracao        = $wrap.find('.dataFimAntesDeAlteracao').val();
  });
  

  Example on JSFiddle .

• Using parent

  $('.dataFimVigenciaPlanoVigente').on('change', function(e){
  
      var $this = $(this);
  
      var dataFimVigenciaPlanoVigente    = $this.val(),
          nomeCanalVenda                 = $this.siblings('.nomeCanalVenda').val(),
          dataInicioVigenciaPlanoVigente = $this.siblings('.dataInicioVigenciaAssociacaoPlano').val(),
          codigoCanalVenda               = $this.siblings('.codigoCanalVenda').val(),
          dataInicioAntesDeAlteracao     = $this.siblings('.dataInicioAntesDeAlteracao').val(),
          dataFimAntesDeAlteracao        = $this.siblings('.dataFimAntesDeAlteracao').val();
  });
  

  Example on JSFiddle .

use this object. For example:

HTML:

<input type="text" class="button"/>
<input type="text" class="button"/>

jQuery:

$(function(){
  $(".button").click(function(){
    this.value = "novo valor";
  });
});

link