Get id of my row table

Question

I need to get id of tr my tr . what's wrong with my jquery syntax, is adding jquery to onclick function is the problem. here is a snipet of my code, it says it's undefinned.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="myDIV1" style="display: inline">
	<form action="/banque" method="POST" enctype="multipart/form-data" id="personForm" data-tiers-url="/ajax/load-cities/"><input type="hidden" name="csrfmiddlewaretoken" value="hb4WLeqHCHVS5uanq8C0hQUhKoB8WFye3kvFLJvyUraLGn2dv3NEslm1AamSosdf">  

	<table align="center">	<!--	banque_rib <div class="row" style="padding-left:  24%; padding-top: 3%"></div> -->
		<tbody><tr>	
			
			<td><select name="banque_name" placeholder="N Facture" class="form-control" required="" id="id_banque_name">
  <option value="" selected="">---------</option>

  <option value="Attijari">Attijari</option>

  <option value="SGMB">SGMB</option>

  <option value="Ts part">Ts part</option>

</select> </td>
				
			
				<td width="2%"></td>
			<td><select name="banque_rib" placeholder="N Facture" class="form-control" required="" id="id_banque_rib">
  <option value="" selected="">---------</option>

  <option value="2142">2142</option>

  <option value="-23525">-23525</option>

  <option value="892375">892375</option>

  <option value="23">23</option>

</select> </td>
				
			
				<td width="2%"></td>
			<td><span><button class="btn btn-success form-control" id="myBtn"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></button></span></td>
			<td width="10%"></td>
			<td><input id="uploadFile" placeholder="Choose File" class="form-control" disabled="disabled"></td>
			<td><div class="btn btn-primary" id="divInput"><span>importer</span>
				<input type="file" name="myfile" style=" position: absolute;top: 0;right: 0;margin: 0; padding: 0;font-size: 20px;cursor: pointer;opacity: 0;filter: alpha(opacity=0);" id="uploadBtn" required="">
			</div></td>
		</tr>
		<tr></tr>
			
	</tbody></table>
			<input type="hidden" id="num" name="numpiece" value="1">
    		
	



<br>	

<!-- Formulaire d'ajout des liiigneee <td width="10%" colspan="2">Importer la piece Justificatif</td> -->
<p>form-0-row</p><table style="border-collapse: separate;border-spacing: 15px;" id="id_forms_table">
			
			<tbody><tr><td width="5%">N P</td><td width="8%">Date d'operation</td><td width="25%">Désignation</td><td width="10%">Type tiers</td><td width="10%">Tiers</td><td width="10%">Référence de Facture</td><td width="10%">Montant debit </td><td width="10%">Montant crédit</td></tr>
 			
 		 <tr style="border:1px solid black;" id="form-0-row" class="dynamic-form">
 		 	
    		<td><div class="col-xs-1"><b><p name="np1">1</p></b></div></td>
			<td>
				<input type="text" name="form-0-dateOperation" value="2018-04-12" class="form-control" id="id_form-0-dateOperation">
				
			</td>
			<td><input type="text" name="form-0-designation" class="form-control" id="id_form-0-designation">
			</td>
			<td>
				<select name="form-0-typeTiers" class="form-control" id="id_form-0-typeTiers">
  <option value="__">__</option>

  <option value="Client">Client</option>

  <option value="Fournisseur">Fournisseur</option>

  <option value="CNSS">CNSS</option>

  <option value="Etat">Etat</option>

  <option value="Personnels">Personnels</option>

</select>
			</td>
			<td>
				<select name="form-0-tiers" class="form-control" id="id_form-0-tiers">
  <option value="CFF">CFF</option>

  <option value="rgg">rgg</option>

  <option value="zrfkgf">zrfkgf</option>

  <option value="Ts part">Ts part</option>

  <option value="ACAM">ACAM</option>

  <option value="Ts partPP">Ts partPP</option>

  <option value="ACM">ACM</option>

  <option value="egz">egz</option>

  <option value="rer">rer</option>

  <option value="ACM">ACM</option>

  <option value="ACM">ACM</option>

  <option value="CNSS">CNSS</option>

  <option value="IS">IS</option>

  <option value="IR">IR</option>

  <option value="TVA">TVA</option>

  <option value="patente">patente</option>

  <option value="Salaires">Salaires</option>

  <option value="primes">primes</option>

</select>
			</td>
			<td><select name="form-0-numfacture" class="form-control" id="id_form-0-numfacture">
  <option value="" selected="">---------</option>

  <option value="1">facture object</option>

  <option value="2">facture object</option>

  <option value="3">facture object</option>

  <option value="4">facture object</option>

</select>
			</td>
			<td><input type="number" name="form-0-montantdeb" class="form-control" id="id_form-0-montantdeb"></td>
			<td><input type="number" name="form-0-montantcred" class="form-control" id="id_form-0-montantcred"></td>
			
	</tr>

<tr>
               
            </tr>
</tbody></table>
<input type="hidden" name="form-TOTAL_FORMS" value="1" id="id_form-TOTAL_FORMS"><input type="hidden" name="form-INITIAL_FORMS" value="0" id="id_form-INITIAL_FORMS"><input type="hidden" name="form-MIN_NUM_FORMS" value="0" id="id_form-MIN_NUM_FORMS"><input type="hidden" name="form-MAX_NUM_FORMS" value="1000" id="id_form-MAX_NUM_FORMS">

	<!-- BUTTONS <td colspan="4"><a href="javascript:void(0)" class="add-row">add property</a></td> -->
	<input type="submit" name="annuler" value="Annuler" class="btn btn-danger" style="float:right ;margin: 5px; margin-right: 35px">
	<button value="" class="btn btn-success" style="float:right;margin: 5px;" onclick="">enregistrer</button>    

</form>

<input type="submit" name="ajoutligne" value="Ajouter une ligne" class="btn btn-primary" id="add-row" style="background-color: #8C1944; border-color: #8C1944; float:right;margin: 5px;" onclick="test()">
	
</div>
<script>function test(){
var dat = $("#id_forms_table tr").attr('id')
alert(dat);
}</script>

Any help please I dont see what the problem is .

Answer 1

Include jQuery in your head.

Also if you don't call the function in a load event or after the object exists it will not going to execute your alert.

When you included jQuery library try this:

$( document ).ready(function() {
    var dat=$("#id_forms_table tr").attr('id')
        alert(dat);
});

Also when you try to have more tr select the right one for the specific id

var dat = $("#id_forms_table tr:nth-child(2)").attr('id')