[Resolvido] Problemas ao criar campos automaticamente

[JackDenio 0]

O lance é o seguinte num sistema onde a pessoa cadastra um ou vários horários pra uso de um estúdio .. so fica exibindo um horário, se ela quiser mais horários clica em mais horários e se add automáticamente outro campo ...esse é o código:

 

<script>
	function adicionar(){
		var mybody = document.getElementById('myBody');
		var tot = mybody.rows.length;
		var limite = 2;
		if (tot < limite) {	
			var row = mybody.insertRow(tot);	
			var col0 = row.insertCell(0);
			var nr = document.createTextNode(tot);			
			var col1 = row.insertCell(1);
			<?php echo "<select name=hora"?>+tot<?php ">"; 
			  for ($i=00;$i<=23;$i++) { $e=''; if ($i==date('H')) $e='selected'; echo "<option ".$e." value=\"".$i."\">".$i."</option>" ; } "</select> :"; 
	 "<select name=minutos>";
	  for ($i=00;$i<=60;$i++) { $e=""; if ($i==date("i")) $e="selected"; echo "<option ".$e." value=\"".$i."\">".$i."</option>"; } "</select>" ?>  
			col1.appendChild(se);
		}
		else {
			document.getElementById('Aviso').innerHTML = "Máximo de especialidades já foi atingido";
		}
	}
</script>

E no form eu uso isso:

 

<table width="260" border="0" cellpadding="0" cellspacing="5" id="myBody">
		<thead>
		</thead>
		<tbody>
		</tbody>
		</table>
			 <a href="#" onClick="adicionar();" >Mais horários ? Clique aqui.</a></div>
			 <div id="Aviso" name="Aviso"></div>

[Eduardo Penna 0]

Bom dia amigo.

 

Faça o seguinte. Rode a página e exiba o código-fonte. Note que existe um erro de sintaxe onde o php escreve dentro da função.

 

(...)
			var col1 = row.insertCell(1);
			<?php echo "<select name=hora"?>+tot<?php ">"; 
(...)

Esse echo irá escrever um select dentro da função javascript.

 

Abraço

[JackDenio 0]

E aê ... se resolveu quando eu fiz assim :

<script type="text/javascript">
	function adicionar(){
		var mybody = document.getElementById('myBody');
		var tot = mybody.rows.length;
		var limite = 2;
		if (tot < limite) {	
			var row = mybody.insertRow(tot);	
			var col0 = row.insertCell(0);
			var nr = document.createTextNode(tot);			
			var col1 = row.insertCell(1);
			var se = document.createElement("select");
			se.name = "hora"+tot;
			 <?php
			for ($i=00;$i<=23;$i++) { $e=''; if ($i==date('H')) $e='selected'; 
			 echo "se.options[" . $i . "] = new Option(\"" . zero($i,2) . "\",\"" . zero($i,2) . "\");";
			
			} 
			?>
			col1.appendChild(se);
			
			var row = mybody.insertRow(tot);	
			var col0 = row.insertCell(0);
			var nr = document.createTextNode(tot);			
			var col1 = row.insertCell(1);
			var se = document.createElement("select");
			se.name = "minutos"+tot;
			
			
			<?php
	  for ($i=00;$i<=60;$i++) { $e=""; if ($i==date("i")) $e="selected";
	  echo "se.options[" . $i . "] = new Option(\"" . zero($i,2) . "\",\"" . zero($i,2) . "\");"; 
	 
	 
	 }
	 ?> 
	 
	  
	   col1.appendChild(se);
		}
		else {
			document.getElementById('Aviso').innerHTML = "Máximo de especialidades já foi atingido";
		}
	}
</script>

Funcionou ..meu problema agora é como colocar o atributo "selected" , tentei de algumas maneiras com o setAtributte, mais foi sem resultado ...

[JackDenio 0]

E aê ...to postando aqui o un código que o GuttoSP me passou, que resolve esse problema citado acima sem usar php, se alguém precisar fazer algo do tipo ai vai:

 

<script type="text/javascript">		
	function adicionar(tipo, maxx) {
		var data = new Date();
		var mybody = document.getElementById('myBody');
		var tot = mybody.rows.length;
		var limite = 13;
		if (tot < limite) {  
			var row = mybody.insertRow(tot);
			var col0 = document.getElementById('myBody').getElementsByTagName('tr')[0].getElementsByTagName('td')[0];
			// var col0 = row.getElementsByTagName('td');
			var col1 = document.getElementById('myBody').getElementsByTagName('tr')[0].getElementsByTagName('td')[0];
		   // var col1 = row.getElementsByTagName('td');
			var se = document.createElement("select");
			se.name = tipo+tot;
			for (i = 0; i <= maxx; i++) {
				se.options[i] = new Option(zero(i,2),zero(i,2));
				if (tipo == 'hora') {
					if (i == data.getHours()) {
						se.options[i].selected = "selected";
					}
				}
				else {
					if (i == data.getMinutes()) {
						se.options[i].selected = "selected";
					}			
				}	  
			}
			if (tipo == 'hora') {
				col0.appendChild(se);
				adicionar('minuto', 59, 'getMinutes();');
			}
			else {
				col1.appendChild(se);
			}	   
		}
		else {
			document.getElementById('Aviso').innerHTML = "Máximo de especialidades já foi atingido";
		}
	}
	
	function zero(numero, casas) {
		numero < 10 ?  numero = "0" + numero : numero = numero;
		return numero;
	}
	
	window.onload = function() {
		adicionar('hora', 23);
		document.getElementById('add').onclick = function() {
			adicionar('hora', 23);
		}
	}
	
	
</script>

E no html coloca isso:

<div id="Aviso"></div>
<table width="75%" border="1">
  <tbody id="myBody">
	<tr>
	  <td> </td>
	  <td> </td>
	</tr>
  </tbody>
</table>
<form name="form1" method="post" action="">
  <input type="button" name="add" id="add" value="Adicionar">
</form>

Espero que ajude alguém ;)