Question

I have a jQuery code:

$('.team-leader-id').delegate('button', 'click', function() {
    var parent_object = $(this);
    var admin_id = $(this).parents('.team_data').find('.leader-id').val();
    var team_id = $(this).parents('.team_data').find('.team-hidden-id').val();
    $(this).parents('.team_data').find('.team-leader-mod-button').attr('disabled', 'disabled');
    $(this).parents('.team_data').find('.team-leader-modify').html('Mégse');
    $(this).parents('.team_data').find('.ajax-json-response').fadeOut(1).html('');
    $(this).parents('.team_data').find('.ajax-json-loading').html('<img src="images/progress-dots.gif" />').fadeIn('slow');

    $.ajax({
        type: 'POST',
        url: 'json.php',
        dataType: 'json',
        cache: false,
        timeout: 20000,
        data: { a: 'change_team_admin', admin_id: admin_id, team_id: team_id },
        success: function(data) {
            $(parent_object).parents('.team_data').find('.ajax-json-loading').fadeOut(1).html('');
            $(parent_object).parents('.team_data').find('.ajax-json-response').html(data.message).fadeIn(400).delay(2000).slideUp(400);
            if (!data.error) {
                $(parent_object).parents('.team_data').find('.team-leader-id').html('<a href="http://lanseries.hu/index.php?oldal=profile&p_id='+admin_id+'" target="_blank">'+admin_id+'</a>');
                PROBLEM -->$(parent_object).parents('.team_data').find('.team-leader-modify').text('OKÉ');<--
            } else {
                $(parent_object).parents('.team_data').find('.team-leader-mod-button').removeAttr('disabled');
                $(parent_object).parents('.team_data').find('.team-leader-modify').html('<a href="javascript:void(0)">Mégse</a>');
            }
        },
        error: function(jqXHR, textStatus, errorThrown) {
            $(parent_object).parents('.team_data').find('.ajax-json-loading').fadeOut(1).html('');
            //$(parent_object).parents('.team_data').find('#ajax-json-response').html('Probléma történt! Kérlek próbáld újra később! (HTTP Error: '+errorThrown+' | Error Message: '+textStatus+')').fadeIn('slow');
            $(parent_object).parents('.team_data').find('#ajax-json-response').html('Probléma történt! Kérlek próbáld újra később, és ellenőrizd az internetkapcsolatod!').fadeIn('slow');
        }
    });
});

Everything is working well, it’s ok, but one row not run! You can find it in the code.

PROBLEM -->$(parent_object).parents('.team_data').find('.team-leader-modify').text('OKÉ');<--

HTML: (There are some thousands of this code part, so I can’t use ids everywhere.

<div class="dnone team_data" id="team_<?php echo $allnum; ?>" style="padding: 10px; margin: 2px 0 2px 0; border: 1px solid <?php echo $site_color; ?>;">
<div class="ajax-json-loading"></div>
<div class="ajax-json-response"></div>
<table cellspacing="5">
    <tr>
        <td valign="top" style="width: 100px;">
            <b>Csapat vezető:</b>
        </td>
        <td class="team-leader-area">
            <input type="hidden" class="team-leader-hidden-id" value="<?php echo $value['leader']; ?>" />
            <input type="hidden" class="team-hidden-id" value="<?php echo $value['id']; ?>" />
            <div class="team-leader-id"><a href="http://lanseries.hu/index.php?oldal=profile&p_id=<?php echo $value['leader']; ?>" target="_blank"><?php echo $value['leader']; ?></a></div>
            <div class="team-leader-modify"><a href="javascript:void(0)">Módosít</a></div>
        </td>
    </tr>
    <tr>
        <td valign="top" style="width: 100px;">
            <b>Befizető címe:</b>
        </td>
        <td>
            <?php echo $value['p_address']; ?>
        </td>
    </tr>
</table>

Could you tell me why?

Thanks in advance!

Answer 1

Break it down. I would put the following above the problem line and check the console in Chrome the entries exist:

console.dir($(parent_object).parents('.team_data'));
console.dir($(parent_object).parents('.team_data').find('.team-leader-modify'));
$(parent_object).parents('.team_data').find('.team-leader-modify').text('OKÉ');
console.dir($(parent_object).parents('.team_data').find('.team-leader-modify').text());

Also, I wouldn’t make so many calls to $(parent_object).parents('.team_data'). It’s a somewhat costly operation.

Instead, at the beginning of the response functions do something like:

var $teamData = $(parent_object).parents('.team_data');

Then reference $teamData for your remaining jQuery calls.