Enable textboxes in a specific row with javascript Without Ajax/Jquery

Question

So I have this table getting filled with information from database, The insert and delete functions are working but I need to be able to enable the text boxes in the specific row that the edit button is pressed. Unfortunatly I can not use Jquery or Ajax as this is a school project and we're not allowed to use it.

At the moment it gets the unique row ID from the database.

    <?php
    include("db.php");
    ?>

   <div class="ukeContainer"> <!-- Legger inn i ukecontainer -->
   <input type="button" value="Legg til ny bruker" onclick="nytt();">
   <table class="sortable">  
   <!-- gjør tabellen mulig å sortere -->
  <tr>
  <th>Epost</th>
  <th>Brukernavn</th>
  <th>Etternavn</th>
  <th>Fornavn</th>
  <th>Brukertype</th>
  <th></th></tr>


  <?php
  $sql = "select A.*, Br.Type from  Brukere A INNER JOIN Brukertyper Br    ON A.Brukertype=Br.Brukertype"; 
  if ($db) {
    $res = $db->query($sql);
     while ($rad = $res->fetch_assoc()) {
      echo("<tr><td><input type='text' name='epost'      value='".$rad['Epost']."' disabled></td>");
  echo("<td><input type='text' name='bnavn' value='".$rad['Brukernavn']."' disabled></td>");
  echo("<td><input type='text' name='enavn' value='".$rad['Etternavn']."' disabled></td>");
  echo("<td><input type='text' name='fnavn' value='".$rad['Fornavn']."' disabled></td>");
  echo("<td><input type='text' name='type' value='".$rad['Type']."' disabled></td>");
  echo("<td>");
  echo("<input id='Slett".$rad['idBrukere']."' ");
  echo("type='submit' value='Slett' onclick='slett(".$rad['idBrukere'].")';>");
  echo("<input id='Rediger".$rad['idBrukere']."' ");
  echo("type='submit' value='Rediger' onclick='endre(".$rad['idBrukere'].")';></td></tr>");
  echo("</td></tr>");
}
   } else {die("Får ikke forbindelse med database.");}
 ?>
    </table>
 </div>

 </body>

What's the "edit button"? Could you please be a bit more specific? — Alexander, Mar 20 '15 at 11:36
Are you in practical examination hall ? Ask the examiner to not allow internet — Sachink, Mar 20 '15 at 11:42
The edit button is atm a submit added in each row with the echo; echo(""); echo(""); So what i need is the onclick function Onclick='functionhere' to enable all the text boxes in that desired row, if that possible? — user3004920, Mar 20 '15 at 12:07

score 0 · Accepted Answer · edited May 23 '17 at 11:43

0

Just out of the head, I'd do it like this:

Give every an unique id. Then, at your edit-function, pass the ID of the row.

Ok, so now we are in the editfunction and we know which row we want to enable.. We can now use the following JS code to achieve what you want:

function enableRow(rowId)
{
    // Get the container element
    container = document.getElementById(rowId);

    // Find its child `input` elements
    var inputs = container.getElementsByTagName('input');
    for (var index = 0; index < inputs.length; ++index) {
        inputs[index].disabled = false;
    }
}

I recovered part of the code from here: Get list of all `input` objects using JavaScript, without accessing a `form` object

Hope that helps. :)

edited May 23 '17 at 11:43

Community

1
1

answered Mar 20 '15 at 11:39

Jordumus

2,763
2
21
38

Every row gets a unique ID from the database, called "IdUsers" I get the script to retrieve it now, same as I did in the delete function, but I can not get it to enable the text boxes. – user3004920 Mar 20 '15 at 12:10
In your code your -elements don't have an id. Are you sure you give them an id? – Jordumus Mar 20 '15 at 12:12
I added a ID equal to the table row number in the database, so its working now! Thank alot! – user3004920 Mar 20 '15 at 12:21
@user3004920 No problem, please select my answer as the right one. :) Good luck with future code. – Jordumus Mar 20 '15 at 12:22

Enable textboxes in a specific row with javascript Without Ajax/Jquery

1 Answers1