CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Chad Priddle
Chad Priddle

Reputation: 672

jQuery - Click link based on css class and name of link

Is it possible to have jQuery find the text of an object and then find the link before it and then click it? I have this example where I want jQuery to click on either of the 2 links below:

<tr>
    <td nowrap="true" width="170" valign="top">
         <div class="float-left">
<b><a href="javascript:GoToETURL('/url-example-1.html','business');">1234 Account</a></b>
<br>
<span style="display:none" class="fullaccnum">1234</span>
         </div>
    </td>
</tr>

<tr>
    <td nowrap="true" width="170" valign="top">
        <div class="float-left">
<b><a href="javascript:GoToETURL('/url-example-2.html','business');">5678 Account</a></b>
<br>
<span style="display:none" class="fullaccnum">5678</span>
        </div>
    </td>
</tr>

Here is my jQuery that I'm using currently and it works but what happens if the order of the accounts above gets sorted differently then it will click on the wrong link for the wrong account:

if(account_id == '1234'){
    jQuery(".float-left b a")[0].click(); //click on first href
} else {
    jQuery(".float-left b a")[1].click(); //click on second href
}

So is it possible for jQuery to do something like this:

if(account_id == '1234'){
    //find span class='fullaccnum' where span equals 1234
    //found match, go back up the tree and click href
    jQuery(".float-left b a").click();
    //goes to 'url-example-1.html'
} else {
    //find span class='fullaccnum' where span equals 5678
    //found match, go back up the tree and click href
    jQuery(".float-left b a").click();
    //goes to '/url-example-2.html'
}

Upvotes: 2

Views: 463

Answers (5)

VJP
VJP

Reputation: 34

$(document).on('click','.float-left',function(){
    var account_id = $(this).find('a').text();
    if(account_id == '1234'){
   $(this).find('a').trigger('click'); 
 } else {
   $(this).parents('tr').next('tr').find('a').trigger('click');
 }
})

try this.

Upvotes: 0

Norlihazmey Ghazali
Norlihazmey Ghazali

Reputation: 9060

I'm assume that account_id is automatically generated or came from database or something else. Here is the solutions :

var account_id  = 1234;
$('.fullaccnum:contains("'+account_id+'")').closest('.float-left').find('a').click();

No matter what number account_id was generated, then it will find out the matched element using :contains selector.

Upvotes: 0

meOn
meOn

Reputation: 332

try to play with jquery closest() api you will get the desired results. Below is a small snippet of it:

$('.fullaccnum').closest('b a').click()

Upvotes: 0

Guruprasad J Rao
Guruprasad J Rao

Reputation: 29683

You can do this if the text inside span doesn't change and will be what you have given!!

function checkclick(accNo) //Call this function wherever you want and pass Account_ID
{
     $('div.float-left span.fullaccnum').each(function(){
           if(accNo==$(this).html())
           {
               $(this).siblings('b').children('a').trigger('click')
           }
     });
}

Upvotes: 0

Mohamed-Yousef
Mohamed-Yousef

Reputation: 24001

try to use this function

 function clickonanchor(text){
       $('tr').each(function(){
          var spantext = $(this).find('.fullaccnum').text();
          if (spantext == text){
               $(this).find('.float-left > b > a').click();
          }
       });    
    }

and use it

clickonanchor('1234');

Upvotes: 1

Related Questions