Tiny File Manager

Back Back Up Advanced Editor

<?php
 
	if (isset($_POST['form_submitted'])) 
	{
		echo "Submission ...";
		
		$indice = "col1" ."-" ."row1"; 
		
		echo "----> " .$indice  . '   ' .$_POST[$indice];
		
	}

<!DOCTYPE html>
<html>
<style>
table, th, td {
  border:1px solid black;
}
</style>

//  AJAX - XMLHttpRequest
// https://www.devenir-webmaster.com/V2/TUTO/CHAPITRE/JAVASCRIPT/63-XMLHttpRequest/
// https://www.xul.fr/xml-ajax.html
// https://itecnote.com/tecnote/javascript-passing-multiple-parameters-by-post-using-ajax-to-php/

// XMLHttpRequest post

// https://www.tutorialrepublic.com/codelab.php?topic=faq&file=jquery-get-the-value-of-an-input-text-box

// http://www.java2s.com/Tutorials/Javascript/Javascript_Form_How_to/Text_Input/Validate_input_text_field_value_on_blur_event.htm

//traitement();

xhr.open("POST","analyse_champ.php",true);
			xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
			//champ = document.getElementById('myInput').value;
			champ = document.getElementById(val).value;
			//alert(" ---- " + joueur);
			
			//joueur = "ririavectoto"; //sel.options[sel.selectedIndex].value;
			xhr.send("champ="+champ);
			
			
			//joueur = document.getElementById('myInput').value;
			
			//alert(" ---- " + joueur);
}

function myFunction() {
  //alert("Row index is: " + x.rowIndex);
  alert("Plouf...");
  
  // function getVal() {
  //const val = document.querySelector('input').value;
  //console.log(val);
}

function focusFunction(val) 
{
  //document.getElementById("myInput").style.background = "yellow";
  
  document.getElementById(val).style.background = "yellow";

//var currentElement = document.activeElement.value;
  
  //document.getElementById("div_message").innerHTML = " on the road again ... " + val;
  
  //alert("  ===   "  + val );
  
  
}

function blurFunction(val) 
{
	document.getElementById(val).style.background = "white";
	
  //document.getElementById("myInput").style.background = "red";
  
  //document.getElementById(val).style.background = "red";
  
  
  //document.getElementById("div_message").innerHTML = "zoulou";
  
  //document.getElementById("div_message").innerHTML =  document.getElementById("myInput").value;
  
  traitement(val);
  
}

</script>

<body>

<h2>A basic HTML table</h2>

<table>
  <tr>
    <th>Un</th>
    <th>Deux</th>
    <th>Trois</th>
  </tr>
  <tr>
    <td><input type="text" id="myInput" name="col1" onfocus="focusFunction(this.id)" onblur="blurFunction(this.id) " /></td>
    <td><input type="text" id="aaa" name="col2" onfocus="focusFunction(this.id)" onblur="blurFunction(this.id) " /></td>
    <td><input type="text" id="zzz" name="col3" onfocus="focusFunction(this.id)" onblur="blurFunction(this.id) " /></td>
  </tr>
  
</table>

</br></br>

<?php
	
	$array_val = array("A", "B", "C", "D", "E", "F" , "G", "H", "I" , "J" , "K");
	
	echo count($array_val);

for ($i = 0; $i <= count($array_val)-1; $i++) 
	{
		echo  "<th>" .$array_val[$i] ."</th>";
	}
?>	
	</tr>
	
	<tr>
<?php

for($row=0;$row<7;$row++)
	{
?>
		<tr>
<?php		
		for($col=0;$col <= count($array_val)-1;$col++)
		{
			$indice_row = $row+1;
			$indice_col = $col+1;

$indice = "col".$indice_col ."-" ."row".$indice_row ; 
?>			
			<td><input type="text" name = "<?php echo $indice; ?>"  id="<?php echo $indice; ?>" onblur="blabla(this.id)" /></td>
<?php
		}	
?>
		</tr>
<?php		
	}

/*
	for($i=0;$i<10;$i++)
	{
?>

</tr>
		
	
<?php
	}
*/	
?>
		
		</table>
		
		<input type="hidden" name="form_submitted" value="1" >

</br>
	</br>
	</br>

<?php

$array_val = array("A", "B", "C", "D", "E", "F" , "G", "H", "I" , "J" , "K");

for ($i = 0; $i < 10; $i++) 
	{
		echo  "<th>" .$array_val[$i] ."</th>";
	}
?>
      <th>Col1</th>
      <th>Col2</th>
      <th>Col3</th>
      <th>Col4</th>
      <th>Col5</th>
      <th>Col6</th>
      <th>Col7</th>
      <th>Col8</th>
      <th>Col9</th>
      <th>Col10</th>
	  <th>Col11</th>
      <th>Col12</th>
      <th>Col13</th>
      <th>Col14</th>
      <th>Col15</th>
      <th>Col16</th>
      <th>Col17</th>
      <th>Col18</th>
      <th>Col19</th>
      <th>Col20</th>
    </tr>
    <tr>
      <td><input id="indice" type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
	  <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
	  <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>
      <td><input type="string" size=5></td>

</tr>
    <tr>
      <td>xxx</td>
      <td>aaa </td>
      <td>bbb </td>
      <td>ccc </td>
      <td>ddd </td>
      <td>eee </td>
      <td>fff </td>
      <td>ggg </td>
      <td>hhh </td>
      <td>iii </td>
	  <td>xxx</td>
      <td>aaa </td>
      <td>bbb </td>
      <td>ccc </td>
      <td>ddd </td>
      <td>eee </td>
      <td>fff </td>
      <td>ggg </td>
      <td>hhh </td>
      <td>iii </td>
    </tr>
    <tr>
      <td>xxx</td>
      <td>aaa </td>
      <td>bbb </td>
      <td>ccc </td>
      <td>ddd </td>
      <td>eee </td>
      <td>fff </td>
      <td>ggg </td>
      <td>hhh </td>
      <td>iii </td>
	  <td>xxx</td>
      <td>aaa </td>
      <td>bbb </td>
      <td>ccc </td>
      <td>ddd </td>
      <td>eee </td>
      <td>fff </td>
      <td>ggg </td>
      <td>hhh </td>
      <td>iii </td>
    </tr>
  </table>
</div>

<form action="javascript:void(0);" id="frmdata" onsubmit="submitFormData(this)">
	<input type="text" id="name" name="name" placeholder="Enter name">
	<input type="email" id="email" name="email" placeholder="Enter email">
	<button type="submit">Submit</button>
	</form>
				
<script>
			
function submitFormData(event) 
{
			alert("plouf");
			
			
			var indice = "col1-row1"; 
			
			champ = document.getElementById(name).value;
			
			alert("++++ " + champ);
	
			// form values
            var name = event.name.value;
            var email = event.email.value;

var http = new XMLHttpRequest();

var url = 'server.php';
            var params = 'name=' + name + '&email=' + email;
            http.open('POST', url, true);

//Send the header information
            http.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

http.onreadystatechange = function() 
			{
                if (http.readyState == 4 && http.status == 200) 
				{
                    alert("Form submitted successfully");
                    document.getElementById("frmdata").reset();
                    console.log(http.responseText);
                }
            }

// Send params with request
            http.send(params);
}

function blabla(val) 
{
	alert(val);
}
				
				</script>

</body>
</html>