1

Estou com um problema aqui que não consigo resolver , nesse script a baixo realiza um calculo de sobre os assentos marcados, até aqui esta tudo perfeito o problema e quando eu coloco um botão submit para enviar os dados e acaba zerando o campo de resultado dando Erro de NaN. como posso corrigir isso?

inserir a descrição da imagem aqui segue o javascript https://jsfiddle.net/fabioo7/wjsdxLvk/

$(window).load(function(){
var contador = function() {
var n = $("input:enabled:checked").length;
var unchecked = 0;
var cb = $(this).index();
$("input:enabled").each(function(i) {
if ((i < cb) && !($(this).is(":checked"))) {
++unchecked;
}
}) 

if($(this).is(":checked")){
$('#campo').append('<div style="margin-top: 10px;"><input type="text"     placeholder="Insira seu Ticket" name="tks[]" required  class="created"    name="check1" ></div>');
}else{
$('.created').eq($(this).index()-unchecked).remove();
} 

$("#checkcount").text(n + (n === 1 ) + " Cadeiras Marcadas");
};
contador();
$("input[type=checkbox]").on("click", contador);


(function() {
var elements = document.getElementsByTagName('input');
var resultado = document.getElementById('resultado_soma');
var resultadoInput = document.getElementById('resultado_soma2');
var checkCount = document.getElementById('checkcount2');

var total = 0;

for (var i = 0; i < elements.length; i++) {
    elements[i].onclick = function() {
        if (this.checked === false) {
            total = total - this.value;
        } else {
            total = total + parseFloat(this.value);
        }

        resultado.innerHTML  = 'R$ ' + total.toFixed(2).replace(".",",");
        resultadoInput.value  = total.toFixed(2).replace(".",",");
        checkCount.value =  $("input:enabled:checked").length;
    }
}
})();

});
2
  • O que você exatamente quer fazer com essa função "Pagar"? 11/01/2016 às 23:33
  • Tranquilo Samir.... E que na hora que vou salvar não vai nada no post pois da Erro NaN só de clicar no input submit 11/01/2016 às 23:35

1 Resposta 1

3

Fiz algumas modificações. Olhe-as abaixo:

1.

O principal problema é que você está usando na maioria dos seletores para os checkbox, apenas input, sem especificar seu type. Por exemplo:

var n = $("input:enabled:checked").length;

Dessa maneira, você também seleciona as input:text, bem como as input:submit, o que não é o desejado, então substitua a linha acima por:

var n = $("input:checkbox:enabled:checked").length;

Faça também isso na linha do each, como está:

$("input:enabled").each(...

Como deveria estar:

$("input:checkbox:enabled").each(...

Já na área do Javascript Puro, a var elements está assim:

var elements = document.getElementsByTagName("input");

Deveria estar assim, utlizando o seletor querySelectorAll, como o filtro [type='checkbox']:

var elements = document.querySelectorAll("input[type='checkbox']");

E por último na checkCount.value = $("input:enabled:checked").length, que agora está assim:

checkCount.value =  $("input:checkbox:enabled:checked").length

2.

Para a captura do index dos elementos criados dinamicamente. Especifiquei dentro do .index(), como parâmetro, o :checkbox

$('.created').eq($(this).index(':checkbox')-unchecked).remove()

3.

Para que não seja permitido submeter o formulário sem que o tenha se escolhido ao menos uma opção, fiz essa função:

$('form').submit(function(e){
    if($("input:checkbox:enabled:checked").length == 0){
    e.preventDefault();
  }
})

Demonstração - JsFiddle

Dica: é importante que ao invés da seleção dos elementos por seus tagNames você use um seletor por class ou id, assim não haverá problemas com a multiplicade das tags. :)

1
  • Show funcionou perfeitamente 12/01/2016 às 2:35

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .