Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Hugo Borges_120734

erro com este código java

Recommended Posts

Galera tenho o seguinte código abaixo:

<html><head>

  <!-- Inicializa o Jquery -->
  <link type="text/css" href="../../JS/Jquery/css/jquery-ui-1.10.2.custom.css" rel="Stylesheet" />
  <script src="../../JS/Jquery/js/jquery-1.9.1.js" type="text/javascript"></script>
  <script src="../../JS/Jquery/js/Principal.js" type="text/javascript"></script>
  <script src="../../JS/Jquery/js/jquery-ui-1.10.2.custom.min.js" type="text/javascript"></script>
  <!-- FIM Inicializa o Jquery -->
  

<script type="text/javascript">
// Formateção da data
   function mascaraData(campoData){
              var data = campoData.value;
              if (data.length == 2){
                  data = data + '/';
                  campoData.value = data;
      return true;              
              }
              if (data.length == 5){
                  data = data + '/';
                  campoData.value = data;
                  return true;
              }
         }
		 
		 

// Gera calendario com jquey
$(function(){
$(".calendario").datepicker({
    dateFormat: 'dd/mm/yy',
    dayNames: ['Domingo','Segunda','Terça','Quarta','Quinta','---ta','Sábado','Domingo'
        ],
    dayNamesMin: [
    'D','S','T','Q','Q','S','S','D'
    ],
    dayNamesShort: [
    'Dom','Seg','Ter','Qua','Qui','---','Sáb','Dom'
    ],
    monthNames: [  'Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro',
    'Outubro','Novembro','Dezembro'
    ],
    monthNamesShort: [
    'Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set',
    'Out','Nov','Dez'
    ],
    nextText: 'Próximo',
    prevText: 'Anterior'
    });
});


// Crias os campos das parcelas
function adicionarCampos() {
var objSelect = document.getElementById("numParcelas");
var i;
var linha = "";

	if (objSelect.value != "") {
		for (i=0; i < objSelect.value; i++) {
			linha += "<input type='text' name='data"+i+"' id='linha"+i+"' class='calendario' OnKeyUp='mascaraData(this);'><br>"
		} 
		document.getElementById("txtParcelas").innerHTML = linha;
	}else{
		document.getElementById("txtParcelas").innerHTML = "";
	}
} 
window.onload = function(){
   adicionarCampos(); //executando ao carregar a página
};
</script>



</head>

<form name="form1" action="" method="post">

<input id="numParcelas" type="text" name="numParcelas" OnKeyUp="adicionarCampos()" value="1">

<br><span id="txtParcelas"></span>


<br><br><br>
<!-- Calendario funcionando -->
<input class="calendario" maxlength='10' type="text" name="data" OnKeyUp="mascaraData(this);">
</form>
</body>
</html>

Bom o que ele faz e bem simples. tem um campo input (name="numParcelas") onde eu informo a quantidade de parcelas, e ele adiciona os input para ser colocado as data.

 

Tenho 2 funções;

1º Formateção da data

2º Ao clicar no campo input que é gerado pelo java ele abre um calendário

 

O problema que que não esta funcionando no input que e gerado pelo java:

linha += "<input type='text' name='data"+i+"' id='linha"+i+"' class='calendario' OnKeyUp='mascaraData(this);'><br>"

Porem ele funciona perfeitamente no input que eu coloquei via html mesmo;

<input class="calendario" maxlength='10' type="text" name="data" OnKeyUp="mascaraData(this);">

Alguém sabe o que estou fazendo de errado.

 

 

OBS: Uso o jquery para gerar o calendário

Compartilhar este post


Link para o post
Compartilhar em outros sites

Você precisa chamar novamente a função datepicker do jQuery na hora que vc criou um novo nó HTML ele não vem com o evento de datepicker bindad logo depois de dar o innerHTML na variavel linha
chame:

$(".calendario").datepicker({
    dateFormat: 'dd/mm/yy',
    dayNames: ['Domingo','Segunda','Terça','Quarta','Quinta','---ta','Sábado','Domingo'
        ],
    dayNamesMin: [
    'D','S','T','Q','Q','S','S','D'
    ],
    dayNamesShort: [
    'Dom','Seg','Ter','Qua','Qui','---','Sáb','Dom'
    ],
    monthNames: [  'Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro',
    'Outubro','Novembro','Dezembro'
    ],
    monthNamesShort: [
    'Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set',
    'Out','Nov','Dez'
    ],
    nextText: 'Próximo',
    prevText: 'Anterior'
    });
});

Compartilhar este post


Link para o post
Compartilhar em outros sites

DANILO perfeito esta parte ja esta ok. olha o código ai.

 

OBS: Vc deixou passar um

});

 

Porem fica faltando arrumar a formatação tem alguma ideia de como arrumar ela?

 <!-- Sistema de parcelamento -->
 <script type="text/javascript">
 
 function adicionarCampos() {
	var objSelect = document.getElementById("numParcelas");
	var i;
	var linha = "";

	var total = (<?=$valor_nota?> / objSelect.value);


		for (i=0; i < objSelect.value; i++) {	
		
		    // Calcula as datas
			var data = new Date();

			var dia = data.getDate();
            if (dia.toString().length == 1){
      			dia = "0"+dia;
			}
			
			data.setMonth(data.getMonth() + i);
    		var mes = data.getMonth()+1;
    		if (mes.toString().length == 1){
      			mes = "0"+mes;
			}
   		
            var minhaData = dia + '/' + mes + '/' + data.getFullYear();
			
			linha += "<input type='text' name='valor"+i+"' id='linha"+i+"' value='"+total+"' class='form_campos_numeros'>   <input type='text' name='data"+i+"' id='linha"+i+"' value='"+minhaData+"' class='calendario' maxlength='10'><br>"
		} 
		
		
		document.getElementById("txtParcelas").innerHTML = linha;
		
		$(".calendario").datepicker({
    dateFormat: 'dd/mm/yy',
    dayNames: ['Domingo','Segunda','Terça','Quarta','Quinta','---ta','Sábado','Domingo'
        ],
    dayNamesMin: [
    'D','S','T','Q','Q','S','S','D'
    ],
    dayNamesShort: [
    'Dom','Seg','Ter','Qua','Qui','---','Sáb','Dom'
    ],
    monthNames: [  'Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro',
    'Outubro','Novembro','Dezembro'
    ],
    monthNamesShort: [
    'Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set',
    'Out','Nov','Dez'
    ],
    nextText: 'Próximo',
    prevText: 'Anterior'
    });
	
  }
 </script>

Compartilhar este post


Link para o post
Compartilhar em outros sites

A consegui arrumar, o código esta funcionado tudo. porem tem um bug. O calendário jquery esta aparecendo, porem não da para clicar na data escolhida. Alguem sabe o que pode ser?

 

Segue como o código esta.

<html><head>

  <!-- Inicializa o Jquery -->
  <link type="text/css" href="../../JS/Jquery/css/jquery-ui-1.10.2.custom.css" rel="Stylesheet" />
  <script src="../../JS/Jquery/js/jquery-1.9.1.js" type="text/javascript"></script>
  <script src="../../JS/Jquery/js/Principal.js" type="text/javascript"></script>
  <script src="../../JS/Jquery/js/jquery-ui-1.10.2.custom.min.js" type="text/javascript"></script>
  <!-- FIM Inicializa o Jquery -->
  

<script type="text/javascript">

		 
		 



// Crias os campos das parcelas
function adicionarCampos() {
var objSelect = document.getElementById("numParcelas");
var i;
var linha = "";

	if (objSelect.value != "") {
		for (i=0; i < objSelect.value; i++) {
			linha += "<input type='text' name='data"+i+"' id='linha"+i+"' class='calendario' OnKeyUp='mascaraData(this);'><br>"
		} 
		document.getElementById("txtParcelas").innerHTML = linha;
	}else{
		document.getElementById("txtParcelas").innerHTML = "";
	}

// Gera calendario com jquey
$(".calendario").datepicker({
    dateFormat: 'dd/mm/yy',
    dayNames: ['Domingo','Segunda','Terça','Quarta','Quinta','---ta','Sábado','Domingo'
        ],
    dayNamesMin: [
    'D','S','T','Q','Q','S','S','D'
    ],
    dayNamesShort: [
    'Dom','Seg','Ter','Qua','Qui','---','Sáb','Dom'
    ],
    monthNames: [  'Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro',
    'Outubro','Novembro','Dezembro'
    ],
    monthNamesShort: [
    'Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set',
    'Out','Nov','Dez'
    ],
    nextText: 'Próximo',
    prevText: 'Anterior'
    });

} 
window.onload = function(){
   adicionarCampos(); //executando ao carregar a página
};

// Formateção da data
   function mascaraData(campoData){
              var data = campoData.value;
              if (data.length == 2){
                  data = data + '/';
                  campoData.value = data;
      return true;              
              }
              if (data.length == 5){
                  data = data + '/';
                  campoData.value = data;
                  return true;
              }
         }
</script>



</head>

<form name="form1" action="" method="post">

<input id="numParcelas" type="text" name="numParcelas" OnKeyUp="adicionarCampos()" value="1">

<br><span id="txtParcelas"></span>


<br><br><br>
<!-- Calendario funcionando -->
<input class="calendario" maxlength='10' type="text" name="data" OnKeyUp="mascaraData(this);">
</form>
</body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.