Failed To Select Row After Update The Grid

Yii 1.1 General Discussion
1

I am using gridview in yii and a form on top of grid view so that when update button is clicked it will show the value on the form. I can highlight the row after update button is clicked using this javascript




function updateDetail(url) {

    $.getJSON(url,

            function(data) {

                $('#TransactionDetail_id').val(data.id);

                $('#TransactionDetail_transactionFk').val(data.transactionFk);

                $('#TransactionDetail_itemName').val(data.itemName);

                $('#TransactionDetail_itemFk').val(data.itemFk);

                $('#item-name-saved').val(data.itemName);

                $('#TransactionDetail_quantity').val(data.quantity);

                $('#TransactionDetail_itemUnit').val(data.unit);

                $('#TransactionDetail_unitPrice').val(data.unitPrice);


                $('#mySubmitButton').html('<i class="icon-ok icon-white"></i> Simpan');


                $('html,body').scrollTop(0);


                var rowId = "#row-" + $('#TransactionDetail_id').val();

                var curRow = $(rowId).get(0);

                $(curRow).trigger('click');

            });

}

The last row can make the row is selected (highlighted). However, when I am finish with updating, I have difficulty to highlight the last updated row. Using code below,




function formDetailSaved(data) {

    if (data.status == "success") {

        $.fn.yiiGridView.update('detail-grid');

        $('#TransactionDetail_itemName').val("");

        $('#TransactionDetail_itemFk').val("");

        $('#item-name-saved').val("");

        $('#TransactionDetail_quantity').val("");

        $('#TransactionDetail_itemUnit').val("");

        $('#TransactionDetail_unitPrice').val("");


        $('#mySubmitButton').html('<i class="icon-plus icon-white"></i> Tambah');


        var rowId = "#row-" + $('#TransactionDetail_id').val();

        $('html,body').animate({scrollTop: ($(rowId).offset().top - 100)}, 500);


        // delete id to reset update

        $('#TransactionDetail_id').val("");


        toastr.success(data.message, data.title);


        var curRow = $(rowId).get(0);

        $(curRow).trigger('click');

    } else {

        toastr.error(data.message, data.title);

    }


    $('input:visible:enabled:first').focus();

}

From Firebug I can see that the row is selected but somehow it is being refresh again. Hence, the selected is removed. Any one can help on this? The idea is to show which row has been updated since I am not using pagination and the row can be 100-200.

Thank you in advance.