如何在回发后维护动态生成的文本框

Question

我在aspx页面中生成动态html文本框。我添加了一个用于执行某些功能的按钮。现在每当我点击我的按钮时，它都会回发，所有动态生成的文本框都会从我的表单中找到，我必须再次添加它。但我希望在回发后维护这些文本框。以下是我如何生成文本框的代码

<script type="text/javascript">
    var textid = null;
    var textid1 = null;
    $(document).ready(function () {

        setupAutoComplete(textid);
        setupAutoComplete1(textid1);
        var counter = 2;

        $("#addButton").click(function () {

            if (counter > 5) {
                alert("Limit Exceeds");
                return false;
            }

            var newTextBoxDiv = $(document.createElement('div'))
         .attr("id", 'TextBoxDiv' + counter);
            textid = "textbox" + counter;
            textid1 = "textbox" + counter+1;

            //            newTextBoxDiv.after().html('<label>Textbox #' + counter + ' : </label>' +
            //        '<input type="text" name="textbox' + counter +
            //        '" id="textbox' + counter + '" value=""  class="auto">');

            newTextBoxDiv.after().html('<div class="fields-left"><label> Leaving from</label><input type="text" name="textbox' + counter + '" id="textbox' + counter + '" class="auto"/>  </div><div class="fields-right"> <label> Going to</label>  <input type="text" name="textbox' + counter + '" id="textbox' + counter + 1 + '" class="auto"/> </div>');
            newTextBoxDiv.appendTo("#TextBoxesGroup");

            setupAutoComplete(textid);
            setupAutoComplete1(textid1);
            counter++;
        });

        $("#removeButton").click(function () {
            if (counter == 1) {
                alert("No more textbox to remove");
                return false;
            }

            counter--;

            $("#TextBoxDiv" + counter).remove();

        });


    });


     var setupAutoComplete= function SearchText2(textid) {
         $('.auto').autocomplete({
            source: function (request, response) {
                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: "Home.aspx/GetAutoCompleteData",
                    data: "{'code':'" + document.getElementById(textid).value + "'}",
                    dataType: "json",
                    success: function (data) {
                                           response(data.d);

                    },
                    error: function (result) {
                        alert("Error");
                    }
                });
            }
        });
    }
    var setupAutoComplete1 = function SearchText3(textid1) {
        $('.auto').autocomplete({
            source: function (request, response) {
                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: "Home.aspx/GetAutoCompleteData",
                    data: "{'code':'" + document.getElementById(textid1).value + "'}",
                    dataType: "json",
                    success: function (data) {
                        response(data.d);

                    },
                    error: function (result) {
                        alert("Error");
                    }
                });
            }
        });
    }

</script>

现在在这段代码中我生成了每行两个最大10个文本框，之后我为每个动态生成的文本框编写了一些json自动完成代码。现在问题是，当我点击我的按钮后，它的回发和所有文本框及其值消失了。我无法维护这些文本框。任何人都可以告诉我如何在回发后维护动态生成的文本框？

谢谢