Question

I have the following ajax success function. How can I act on the result with jquery before appending it? The following code is my attempt, however, the second console statement never writes.

See the current .filter line. I base that as my latest attempt after reading and trying the different methods from here: Use Jquery Selectors on $.AJAX loaded HTML?

$(function ()
{
    $('#myactionlink').click(function (result)
    {
        $.ajax(this.href, {
            success: function (result)
            {
                console.log((new Date()).getTime() + ' - ' + 'result returned.');
                $(result).filter('input[name="RowId"]').each(function (i)
                {
                    var x = (i + 1).toString();
                    console.log((new Date()).getTime() + ' - ' + 'RowId: ' + x);
                    $(this).val(x);
                });
                $('#mypartial').append(result);
            }
        });
        return false;
    });
});

Html Partial being returned.

<div>
    <input id="RowId" name="RowId" type="text" value="">
</div>

Current Inprogress Solution

$(function ()
{
    $('#myactionlink').click(function (result)
    {
        $.ajax(this.href, {
            success: function (result)
            {
                console.log((new Date()).getTime() + ' - ' + 'result returned.');
                var outResult = $(result);
                outResult.filter('[name="RowId"]').each(function (i)
                {
                    var x = (i + 1).toString();
                    console.log((new Date()).getTime() + ' - ' + 'RowId: ' + x);
                    $(this).val(x);
                }).end().appendTo('#mypartial');
            }
        });
        return false;
    });
});

Answer 1

Store a reference to result, modify it, then append it.

var outResult = $(result);
outResult.find('[name="RowId"]').each(...).end().appendTo("#mypartial");

You were actually appending the original html and not doing anything with the one you created using $(result).