how can I assign a value from one field to another in javascript?

2

I have a code in javascript that takes the value of the quantity field with onkeypress however I would also need to get the value of the id field or that the value will be sent via ajax to another page for this one doing an update only that I am not being able to send also send the value of the field id someone has a suggestion, I would like this by sending the value of the field id and the field qtd to the function parameter by the onkeypress of the qtd field.

follow the code in ajax:

<script>
function update(str) {  
  //var codigo = document.getElementById('codigo').value;
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      document.getElementById("result").inner =
      this.responseText;
    }
  };
  xhttp.open("GET", "update.php?qtd="+str+"&unidade="+str+"&desc="+str+"&custo="+str, true);
  alert(str);
  xhttp.send();
}
</script> 

follow the code in php:

<table width="100%" class="table table-striped table-bordered table-hover" id="dataTables-example">

    <thead>
        <tr>
            <th>Código</th>
            <th>Quatidade</th>
            <th>Unidade</th>
            <th>Descrição</th>
            <th>Custo</th>
            <th>Data</th>
        </tr>
    </thead>
    <?php 
        while($result = @mysql_fetch_array($sql)){
            echo "<tbody>";
                echo "<tr class='odd gradeX' id='result'>";
                    echo "<td><input type='text' disabled='disabled' id='codigo' name='codigo' value='".$result[0]."'/></td>";
                    echo "<td><input type='text' onkeypress='update(this.value)' id='qtd' name='qtd' value='".$result[1]."'/></td>";
                    echo "<td><input type='text' onkeypress='update(this.value)' id='unidade' name='unidade' value='".$result[2]."'/></td>";
                    echo "<td><input type='text' onkeypress='update(this.value)' id='desc' name='desc' value='".$result[3]."'/></td>";
                    echo "<td><input type='text' onkeypress='update(this.value)' id='custo' name='custo' value='".$result[4]."'/></td>";
                    echo "<td><input type='text'  disabled='disabled' value='".$result[5]."'/></td>";
                echo "</tr>";
            echo "</tbody>";        
        }
    ?>
</table>
    
asked by anonymous 02.04.2017 / 21:05

1 answer

1
  

The onkeypress attribute occurs when the user presses a key (on the keyboard), and the value in the field is entered when the key is released, so the event is triggered before entering the data in the field.

     

If you change only one field you can use the onBlur attribute. The onblur attribute fires as the element loses its focus.

function update(str) {  
  var qtd = document.getElementById('qtd').value;  
  var codigo = document.getElementById('codigo').value;
  var unidade = document.getElementById('unidade').value;
  var desc = document.getElementById('desc').value;
  var custo = document.getElementById('custo').value;
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
   if (this.readyState == 4 && this.status == 200) {
    document.getElementById("result").inner =
    this.responseText;
   }
};
  //xhttp.open("GET", "update.php?qtd="+qtd+"&unidade="+unidade+"&desc="+desc+"&custo="+custo, true);
  //alert(str);
  alert("update.php?qtd="+qtd+"&unidade="+unidade+"&desc="+desc+"&custo="+custo);
  //xhttp.send();
}
<table width="100%" class="table table-striped table-bordered table-hover" id="dataTables-example">

<thead>
    <tr>
        <th>Código</th>
        <th>Quatidade</th>
        <th>Unidade</th>
        <th>Descrição</th>
        <th>Custo</th>
        <th>Data</th>
    </tr>
</thead>

<tbody>
<tr class='odd gradeX' id='result'>
  <td><input type='text' size="8" disabled='disabled' id='codigo' name='codigo' value='ABCD'/></td>
  <td><input type='text' size="8" onkeypress='update(this.value)' id='qtd' name='qtd' value='200'/></td>
  <td><input type='text' size="8" onkeypress='update(this.value)' id='unidade' name='unidade' value='metros'/></td>
  <td><input type='text' size="10" onkeypress='update(this.value)' id='desc' name='desc' value='pano p/ manga'/></td>
  <td><input type='text' size="8" onkeypress='update(this.value)' id='custo' name='custo' value='20.00'/></td>
  <td><input type='text' size="8" disabled='disabled' value='02/04/2017'/></td>
   </tr>
</tbody>        
</table>
  

The best way is through a button with the onClick event.

Script

function loadDoc() {

  var codigo = document.getElementById('codigo').value;
  var qtd = document.getElementById('qtd').value;  
  var codigo = document.getElementById('codigo').value;
  var unidade = document.getElementById('unidade').value;
  var desc = document.getElementById('desc').value;
  var custo = document.getElementById('custo').value;
  var data = document.getElementById('data').value;

  var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
         document.getElementById("result").innerHTML =
         this.responseText;
        }
  };
  xhttp.open("GET", "update.php?codigo="+codigo+"&qtd="+qtd+"&unidade="+unidade+"&desc="+desc+"&custo="+custo+"&data="+data, true);
  xhttp.send();
}

PHP

<table width="100%" class="table table-striped table-bordered table-hover" id="dataTables-example">

<thead>
  <tr>
    <th>Código</th>
    <th>Quatidade</th>
    <th>Unidade</th>
    <th>Descrição</th>
    <th>Custo</th>
    <th>Data</th>
   </tr>
</thead>

  <?php 
    while($result = @mysql_fetch_array($sql)){
        echo "<tbody>";
            echo "<tr class='odd gradeX' id='result'>";
                echo "<td><input type='text' id='codigo' name='codigo' value='".$result[0]."'/></td>";
                echo "<td><input type='text' id='qtd' name='qtd' value='".$result[1]."'/></td>";
                echo "<td><input type='text' id='unidade' name='unidade' value='".$result[2]."'/></td>";
                echo "<td><input type='text' id='desc' name='desc' value='".$result[3]."'/></td>";
                echo "<td><input type='text' id='custo' name='custo' value='".$result[4]."'/></td>";
                echo "<td><input type='text' id='cdata' name='data' value='".$result[5]."'/></td>";
                echo "<td><button type='button' onclick='loadDoc()'>Submit</button></td>";
            echo "</tr>";
        echo "</tbody>";        
    }
  ?>       
</table>
    
02.04.2017 / 21:50