ASP.NET Dynamic User Control with JQuery

Alright...this is a bit of a complex problem so hopefully I can explain it properly.

I have a user control which I am dynamically loading in my page_load event via a method (see below). The user control contains a gridview and a label. A key piece of information has to do with how to get around the convenient feature of gridviews not rendering when their datasource is empty. In my user control I add some hidden rows so that the grids will render and the user can see just the headers (if the situation calls for it).

The nomControl is an asp:Panel on the parent page which will hold the user controls. The dsRefinedProductsNomInfo is a strongly typed dataset.

private void LoadCycleControls()
    {
        var dsRefinedProductsNomInfo = Session[REFINED_PRODUCT_NOMINATION_INFO] as RefinedProductsNomInfo;

        if (dsRefinedProductsNomInfo == null)
        {
            return;
        }

        int permittedCycles = dsRefinedProductsNomInfo.NOS_MONTH.Count == 0 ? 0: dsRefinedProductsNomInfo.NOS_MONTH[0].PERMITTED_CYCLES;

        for (int cycle = 1; cycle <= permittedCycles; cycle++ )
        {
            var control = LoadControl("~/CustomControl/RefinedProductNominationCycleControl.ascx");
            nomContent.Controls.Add(control);

            var nomControl = control as RefinedProductNominationCycleControl;

            if (nomControl == null)
            {
                return;
            }

            nomControl.CycleNumber = cycle;
            nomControl.ID = "control_" + cycle;
            nomControl.CycleTitle = "Cycle " + cycle;

            nomControl.GridDataSource = dsRefinedProductsNomInfo.REFINED_PRODUCT_NOS_CYCLE_INFO;
        }
    }

Now when a user adds a row to the grid they click a plus button. In the button javascript click event I make an ajax call to a page method.

 var options = {
    type: "POST",
    url: "RefinedProductNomination.aspx/AddNomCycleLineItem",
    data: "{'id':'" + tableRow.attr("id") + "',\
            'isPlug':'" + isPlug + "',\
            'sequenceNbr':'" + sequenceNbr + "',\
            'receiptLocationId':'" + receiptLocationId + "',\
            'materialTypeId':'" + materialId + "',\
            'shipperId':'" + shipperId + "',\
            'tankId':'" + tankId + "',\
            'deliveryLocationId':'" + deliveryLocationId + "',\
            'volume':'" + volume + "',\
            'cycle':'" + cycle + "'}",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(response) {
        if (response.d != "") {
            if (response.d == "-1000") {

                var messageContainer = tableRow.parents("div").siblings("div #messageSummary");
                messageContainer.empty()
                var message = $("<span></span>").a开发者_StackOverflowppend("There has been an issue accepting the row please try again.");

                messageContainer.append(message);
                message.fadeOut(10000, "linear");

            }
            else {
                ConvertToReadOnlyRow(tableRow, response.d);
            }
        }
    }
};
//Call the PageMethods
$.ajax(options); 

The page method then retrieves the dataset from the cache and adds the new row the user created. This all works fine and I can save to the database via an asp:button and handling it's click event.

My issue is after the the user clicks the save button and everything is rendered my grid shows the rows I added to make sure just the headers show up. In my save button click event I am removing these added rows so they don't get persisted and then saving and then added again once we load the user control. Initially this seems like the right place to handle this but after figuring out the order of events it would appear I was wrong.

So my question. Can anyone suggest how I should be handling my events so that my rendered grid is up to date and not showing these hidden rows. I have a feeling I am just doing things in the wrong place/order but this is my first real swim in the deep end of the asp.net pool. If any more information would be helpful let me know.

Thank you in advance for any help.

Well I think I have solved my own problem. Essentially what I have done is this:

1. On parent page_load I reload controls so that they show up on the screen.

protected void Page_Load(object sender, EventArgs e)
    {
        if (IsPostBack)
        {
            LoadCycleControls();
            return;
        }

        RetrieveParameters();
        LoadRefinedNominationInfo();
        LoadLookupLists();
        LoadCycleControls();
    }

2. On control page_load I check IsPostBack. If it's true I just return.

protected void Page_Load(object sender, EventArgs e)
    {
        if(IsPostBack)
        {
            return;
        }

        BindData();
        cycleNumber.Value = _cycleNumber.ToString();
    }

3. On parent save button click, which caused the post back, I do my normal save logic. After that is complete I iterate over all the controls I created set their data source to the updated dataset. In my control I exposed a method called BindData() which I then call.

 protected void BtnSaveClick(object sender, EventArgs e)
    {
        SaveRefinedProductNosInfo();

        var dataSet = RefinedProductsNomInfoCache;

        if (dataSet == null)
        {
            return;
        }

        foreach (var nomControl in nomContent.Controls.OfType<RefinedProductNominationCycleControl>())
        {
            nomControl.GridDataSource = dataSet.REFINED_PRODUCT_NOS_CYCLE_INFO;
            nomControl.BindData();
        }
    }

Now even though I am slightly new at this, it feels a little dirty which probably means I am not doing things quite right still so if someone actually knows whether I am doing this right or not cares to comment that would be great :)