CODEWITHSUNDEEP
phpjquery
DNeb
DNeb

Reputation: 33

get tag id from foreach loop to jquery

i have invoice link for every customer that has been fetched from database.

foreach ($customerTables as $value) {
 <td><a id='show' href='invoice.php?invoice=$value->id'>Invoice</a></td>
}

so when the user click on the Invoice link, i want to show loading page as follow

<p><i class="fa fa-cog fa-spin fa-3x fa-fw"></i>
<span class="sr-only">Loading...</span></p>

and the javascript i use is:

$(document).ready(function(){
    $("p").hide();
 });
$("#show").click(function(){
    $("p").show();
 });

but it only works for the first row of invoice link. how can i make this to work for every string of invoice? Thanks for your help!

Upvotes: 1

Views: 665

Answers (2)

Dhanesh
Dhanesh

Reputation: 324

You cant use same id multiple time in single page so replace it with class like following,

foreach ($customerTables as $value) {
 <td><a class='show' href='invoice.php?invoice=$value->id'>Invoice</a></td>
}

Also need to give class or id for the p tag that you need to show/hide at the time of clicking the link. Because if you directly hide/show p tag it will effect all other p tag inside that page.So you can use something like below,

<p class="loader"><i class="fa fa-cog fa-spin fa-3x fa-fw"></i>
<span class="sr-only">Loading...</span></p>

Then you can write your js code like this,

$(document).ready(function(){
    $("p.loader").hide();
 });
$(".show").click(function(){
    $("p.loader").show();
 });

Upvotes: 0

jiboulex
jiboulex

Reputation: 3031

That's because you use id instead of a class. Id's are supposed to be unique so jquery focuses on the first occurence.

try to replace

id='show'

by

class='show'

and 

$("#show").click(function(){

by

$(".show").click(function(){

Upvotes: 1

Related Questions