Q:

Ajax issue with input, textarea blur

Have problem with submiting information via ajax.
Have for example 20 rows. Click on row and it opens all information about services.
    $('tr').click(function() {
       var servicesUpdateId = $(this).attr('data'); 
       $("#"+servicesUpdateId).css({"display":"block", 'opacity':'0'}).animate({left: '0',opacity: '1',});
       // save form class for ajax submit
       localStorage.setItem("formId", servicesUpdateId); 
    });

Here html:
<tbody>
<?php
    $allServices = Services::where('user_id', $mainUser->id);
    foreach($allServices as $oneServices) {
?>
<tr class="services-table-hover" data="services_<?php echo $oneServices->id; ?>">
    <td> <div class="services-color"></div> <img src="/assets/images/provider_img2.png" alt=""> </td>
    <td class="title-name"> <?php echo $oneServices->name; ?> </td>
    <td> <?php echo $oneServices->description; ?> </td>
    <td> <?php echo $oneServices->duration; ?> mins </td>
    <td> <?php echo $oneServices->currency; ?> <?php echo $oneServices->price; ?> </td>
    <td style="line-height: 50px;"> <i class="icon-arrow-right"></i> </td>
</tr>
<?php } ?>

Then its div with info
<?php foreach($allServices as $onesServices) { ?>
<div id="services_<?php echo $onesServices->id; ?>">
<div class="portlet light minHeigh staff-hover">
    <form action="" method="post" class="services_<?php echo $onesServices->id; ?>">
        <div class="portlet-title tabbable-line">
            <a class="goBackOne"><i class="icon-arrow-left"></i></a><h3 style="display: inline-block;"><?php echo $lang['SERVICES_LEFT_MENU_ALL']; ?></h3>
        </div>
        <div class="col-sm-7">
            <div class="portlet-body">
            <div class="tab-content">
                <div class="tab-pane active" id="portlet_tab1">
                    <div class="form-body input-smaller">
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="form_control_1"><img class="imgs" src="/assets/images/provider_img2.png" alt=""></label>
                            <div class="col-md-9">
                                <input type="text" class="form-control" name="update_service_name" style="margin-bottom:10px; font-size: 26px; font-weight: 600;" value="<?php echo $onesServices->name; ?>">
                                <textarea name="update_service_description" id="" cols="30" rows="10" class="form-control" style="margin-bottom:10px;" placeholder="Description"><?php echo $onesServices->description; ?></textarea>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="form_control_1"><?php echo $lang['SERVICES_INSIDE_COST']; ?></label>
                            <div class="col-md-9">
                                <input type="text" class="form-control" name="update_service_price" value="<?php echo $onesServices->price; ?>">
                            </div>
                        </div>
                        <div class="clearfix"></div>
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="form_control_1"><?php echo $lang['SERVICES_INSIDE_TIME']; ?></label>
                            <div class="col-md-9">
                                <input type="text" class="form-control" name="update_service_duration" value="<?php echo $onesServices->duration; ?>">
                            </div>
                        </div>
                        <div class="clearfix"></div>
                        <div class="form-group">
                            <?php 
                                $servicesCat = $onesServices->service_categories_id;
                                $servicesCat = json_decode($servicesCat);
                            ?>
                            <label class="col-md-3 control-label" for="form_control_1"><?php echo $lang['SERVICES_INSIDE_LIST']; ?></label>
                            <div class="col-md-9">
                                <select id="multiple2" name="update_services_category" class="form-control select2-multiple" multiple placeholder="Select categories">
                                    <?php foreach($servicesCategories as $onCategory) { ?>
                                        <?php if(in_array($onCategory->id, $servicesCat)) { ?>
                                            <option value="<?php echo $onCategory->id; ?>" selected><?php echo $onCategory->name; ?></option>
                                        <?php } else { ?>
                                            <option value="<?php echo $onCategory->id; ?>"><?php echo $onCategory->name; ?></option>
                                        <?php } ?>
                                    <?php } ?>
                                </select>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>
          </div>
        </div>
        <div class="col-sm-5">
            <h4><?php echo $lang['SERVICES_INSIDE_PROVIDE']; ?></h4>
            <?php
                $staffs_eupdate = Staffs::where('id_users', $mainUser->id);
                $serviceStaff = ServiceStaffs::find_by_query("SELECT staff_id FROM service_staffs WHERE user_id = '$mainUser->id' AND services_id = '$onesServices->id' ");
                $newStaffId = array();

                foreach($serviceStaff as $index => $sStaff) {
                    $newStaffId[$index] = $sStaff->staff_id;
                }

                foreach($staffs_eupdate as $staff_update) {
            ?>
            <div class="full-services">
                <div class="all-services">
                    <?php if(in_array($staff_update->id, $newStaffId)) { ?>
                    <div class="all-around all-around-on">
                        <div class="float-on-left">
                            <div class="ignore_img"><input type="hidden" name="update_staffs_id[]" value="<?php echo $staff_update->id; ?>"></div>
                            <?php echo $staff_update->name; ?>
                        </div>
                    </div>
                    <?php } else { ?>
                    <div class="all-around all-around-non">
                        <div class="float-on-left">
                            <div class="ignore_img"><input type="hidden" name="update_staffs_id[]" value="<?php echo $staff_update->id; ?>"></div>
                            <?php echo $staff_update->name; ?>
                        </div>
                    </div>
                    <?php } ?>
                </div>
            </div>
            <?php } ?>
        </div>
    </form>
</div>

I'm saving class in localStorage. And then user edits value in field and hes out off that field, I update that information with ajax
    $('.'+localStorage.getItem("formId")+' input, .'+localStorage.getItem("formId")+' textarea').blur(function(event) {

    var updateStaffId = $("."+localStorage.getItem("formId")+" .all-around-on input[name='update_staffs_id[]']").map(function(){return $(this).val();}).get();
    var updateCategoriesId = $("."+localStorage.getItem("formId")+" select[name=update_services_category] option:selected").map(function(){return $(this).val();}).get();

    var formData = {
        'from'                          : 'serviceUpdate',
        'user_id'                       : '<?php echo $mainUser->id; ?>',
        'services_id'                   : localStorage.getItem("formId"),
        'update_services_name'          : $('.'+localStorage.getItem("formId")+' input[name=update_service_name]').val(),
        'update_services_description'   : $('.'+localStorage.getItem("formId")+' textarea[name=update_service_description]').val(),
        'update_services_price'         : $('.'+localStorage.getItem("formId")+' input[name=update_service_price]').val(),
        'update_services_duration'      : $('.'+localStorage.getItem("formId")+' input[name=update_service_duration]').val(),
        'update_services_category'      : updateCategoriesId,
        'update_services_staff'         : updateStaffId
    };

    $.ajax({
        type        : 'POST',
        url         : 'ajax/ServicesAjax.php',
        data        : formData,
        dataType    : 'json',
        encode      : true
    })
        // using the done promise callback
        .done(function(data) {
            if(data['success'] == true) {
                toastr.success("Information updated successfuly!", "Services");
            }
        })

        // using the fail promise callback
        .fail(function(data) {
            // show any errors
            // best to remove for production
            console.log(data);
        });

    // stop the form from submitting the normal way and refreshing the page
    event.preventDefault();
});

The problem is that it's only works with last row. First row, second, 5 , 10 then opens information and edit field value, on blur it don't work. But last row works perfectly. Where can the problem be ?
UPDATED
PROBLEM SOLVE, I add my ajax in $('tr').click and change localStore with var servicesUpdateId = $(this).attr('data');. Maybe the problem was localStore. But in console, it always shows true value. 

A:

PROBLEM SOLVE, I add my ajax in $('tr').click and change localStore with var servicesUpdateId = $(this).attr('data');. Maybe the problem was localStore. But in console, it always shows true value

