window.parent.location.href not working with ajaxcontroltoolkit in asp.net

Question

I am using iframe to open new .aspx page from parent page. child page is using ajaxcontroltoolkit(ajax CalendarExtender). Now on form submit, I want to close iframe and return to parent page. For that I am using following code.

ClientScript.RegisterStartupScript(this.GetType(), "scriptid", window.parent.location.href='ViewVendors.aspx'", true);

This works file if I remove ajax control from child page but does not work with ajax control. I want to use calenderExtender and iframe both. How can I use it and what is the problem for such so called abnormal behavior.

This is the code for my submit button event handler.

protected void btnUpdate_Click(object sender, EventArgs e)
{
    try
    {
        objVendor.VendorID = Convert.ToInt64(Request.QueryString["Id"]);
        objVendor.Name = txtName.Text;
        objVendor.BillingAddress = txtBillingAddress.Text;
        objVendor.ShippingAddress = txtShippingAddress.Text;
        objVendor.ContactPersonName = txtContactPerson.Text;
        objVendor.ContactNumber = txtContactNumber.Text;
        objVendor.EmailID = txtEmailID.Text;
        objVendor.VendorSinceDate = Convert.ToDateTime(txtVendorDate.Text);
        objVendor.IsActive = Convert.ToBoolean(rdblStatus.SelectedValue);
        objVendor.Logo = FileUpload();
        int intResult = objVendor.UpdateVendor();
        if (intResult > 0)
        {
            ScriptManager.RegisterStartupScript(this.Page, this.GetType(), "window.parent.location.href='ViewVendors.aspx'", "scriptid", true);
            //ClientScript.RegisterStartupScript(this.GetType(), "scriptid", "window.parent.location.href='ViewVendors.aspx'", true);
        }
    }
    catch (Exception ex)
    {
        lblMessage.Text = ex.Message;
        lblMessage.CssClass = "ERROR";
    }
}

//Edit Now my code works fine as long as I am not adding calender extender to the child page. When I add calender extender in child page it shows error "The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>)". If I remove calender extender, again it works well. By doing some googling, I found that <% %> in Javascript tag is creating problem. How can I solve it and why calender control is creating problem in such cases?

Here is the code for my script.

<script type="text/javascript">
    function uploadStarted() {
        $get("imgDisplay").style.display = "none";
    }
    function uploadComplete(sender, args) {
        var imgDisplay = $get("imgDisplay");
        //  var imgPhoto = $get("#imgPhoto");
        var imgPhoto = document.getElementById('<%=imgPhoto.ClientID %>');
        imgDisplay.src = "images/loader.gif";
        imgPhoto.style.display = "none";
        imgDisplay.style.cssText = "";
        var img = new Image();
        img.onload = function () {
            imgDisplay.style.cssText = "height:100px;width:100px";
            imgDisplay.src = img.src;
        };
        img.src = "<%=ResolveUrl(UploadFolderPath) %>" + args.get_fileName();

    }
</script>

Answer 1

You need to register your JavaScript using the ScriptManager instance on your page - which you should already have if you're using AJAX. It has its own RegisterStartupScript method that you can use.