Create New Item
Item Type
File
Folder
Item Name
Search file in folder and subfolders...
Are you sure want to rename?
File Manager
/
Outlook
/
Fusion
/
Table
:
table02.php
Advanced Search
Upload
New Item
Settings
Back
Back Up
Advanced Editor
Save
<!DOCTYPE html> <html> <style> table, th, td { border:1px solid black; } </style> <script> // 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(); function getXhr() { var xhr = null; if(window.XMLHttpRequest) // Firefox et autres xhr = new XMLHttpRequest(); else if(window.ActiveXObject) { // Internet Explorer try { xhr = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } } else { // XMLHttpRequest non supporté par le navigateur alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); xhr = false; } return xhr; } function traitement() { var xhr = getXhr(); xhr.onreadystatechange = function() { // le serveur est ok if(xhr.readyState == 4 && xhr.status == 200) { response = xhr.responseText; document.getElementById('message').innerHTML = response; } } xhr.open("POST","ajax_request.php",true); xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); joueur = document.getElementById('myInput').value; //alert(" ---- " + joueur); //joueur = "ririavectoto"; //sel.options[sel.selectedIndex].value; xhr.send("joueur="+joueur); //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"; //var currentElement = document.activeElement.value; //document.getElementById("div_message").innerHTML = " on the road again ... " + val; //alert(" === " + val ); } function blurFunction() { document.getElementById("myInput").style.background = "red"; //document.getElementById("div_message").innerHTML = "zoulou"; //document.getElementById("div_message").innerHTML = document.getElementById("myInput").value; traitement(); } </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() " /></td> <td><input type="text" id="aaa" name="col2" onfocus="focusFunction(this.id)" onblur="blurFunction() " /></td> <td><input type="text" id="zzz" name="col3" onfocus="focusFunction(this.id)" onblur="blurFunction() " /></td> </tr> </table> <!-- <p>To understand the example better, we have added borders to the table.</p> --> <div id="message" style="background-color: green;"> </br></br> <div id="div_message" > </div> </body> </html>