Question

this is what my controller action looks like –

public void GetResizedImage(int height, int width, int GroupingId)
{
    //Generate image here
    image.RenderToStream();
    //here i need to execute "$("#modalDialog").dialog("option", "position", 'center');" to center my dialog after image is rendered.
}

In my client side, i am assigning the image src like this –

var imgsrc = "Group/GetResizedImage/?height=" + height + "&width=" + width + "&GroupingId=" + GroupingId;
$("#ImageDiv").find("#MyImage").attr("src", imgsrc);

And the image is rendered on jquery dialog, so the dialog resizes and it gets hidden in the right side of browser, which creates horizontal scroll bar, and i dont want the scroll bar on my screen

Is there anyway to center my jquery modal dialog after the image is rendered?
I know i used to use ScriptManager.RegisterClientScriptBlock in webforms but since this is MVC i cannot use it.
Any help would be appreciated.
Thanks

Answer 1

You can bind to the load event of the image. Here is some example code since you haven’t included all your javascript (I haven’t tested this but the load event is the general idea):

var imgsrc = "Group/GetResizedImage/?height=" + height + "&width=" + width + "&GroupingId=" + GroupingId;
var img = $("#ImageDiv").find("#MyImage")
img.load(function() {
    // call your resize here
});
img.attr("src", imgsrc);