Sapui5 如何覆盖或更改OpenUI5面板分区id？

我正在openui5中添加/删除面板节容器。删除选定的面板容器时，我可以执行此操作。但是在删除容器并再次添加新容器之后，我得到了“添加具有重复id txn_1的元素”的错误。如何解决这个问题

我正在使用以下代码：

      var Iconadd = new sap.ui.commons.Button({  //add container code
        text : "ADD",
        width:"65px",
        icon : "sap-icon://add",
        press : function() {



            var len=$('#panelcontainer .sapUiPanel').length;
            //alert("len"+len);
            Createnewtransaction(len+1);

            //alert(""+len);
            //var content=$("#panelcontainer").html();

            //$("#panelcontainer").append(content);
            //var length=$('#panelcontainer').length;
          // alert(""+length);

        }
    });

    Createnewtransaction(1);//onload defaultly one conatiner should show

    function Createnewtransaction(len){  //panel code and delete container code
    //alert("in"+len);          

    var oPanel3 = new sap.ui.commons.Panel("txn_"+len,{width: "100%", showCollapseIcon: false});


    oPanel3.setAreaDesign(sap.ui.commons.enums.AreaDesign.Fill);
    oPanel3.setBorderDesign(sap.ui.commons.enums.BorderDesign.None);

    oPanel3.setTitle(new sap.ui.core.Title({text:"Transaction Details"}));
    //oPanel3.setTitle(new sap.ui.core.Title({text:"Transaction Details"}));

    var oMatrix3 = new sap.ui.commons.layout.MatrixLayout({ width: '600px', columns: 8,width:"auto"});
    //oMatrix3.setWidths('150px', '200px','200px','170px','200px');
    oMatrix3.setWidths('150px','200px','200px','170px','200px','210px');
    oMatrix3.setLayoutFixed(true);


var oLabelmaterial = new sap.ui.commons.Label({text: 'Material:*'});

var oCustomserachmaterial = new sap.ui.commons.TextField({value: '', width: '88%'},{
    enabled:true,
    change:function(){

    }

});
oLabelmaterial.setLabelFor(oCustomserachmaterial);

 var oLabelinvoice = new sap.ui.commons.Label({text: 'Invoice Number:'});


 var oLabelText = new sap.ui.commons.TextField({value: '', width: '100%'});

 oLabelinvoice.setLabelFor(oLabelText);
      var oLabelInvoicedate = new sap.ui.commons.Label({text: 'Invoice Date:*'});


    // create a simple DatePicker
      var oDatePicker1 = new sap.ui.commons.DatePicker('');
      oDatePicker1.setWidth("170px");
    //  oDatePicker1.setYyyymmdd("20100101");
      oDatePicker1.setLocale("en-US"); // Try with "de" or "fr" instead!
      oDatePicker1.attachChange(
            function(oEvent){
                if(oEvent.getParameter("invalidValue")){
                    oEvent.oSource.setValueState(sap.ui.core.ValueState.Error);
                }else{
                    oEvent.oSource.setValueState(sap.ui.core.ValueState.None);
                }
            }
      );

      // attach it to some element in the page
      //oDatePicker1.placeAt("sample1");




    //oMatrix3.createRow(oLabelmaterial,oCustomserachmaterial,oLabelinvoice,oLabelText,oLabelInvoicedate,oDatePicker1,oLabelcurrency,oCustomserachcurrency,oLabelinvoiceline,oLabelInvoicelinetext,oLabelShipmentdate,oDatePicker2,oLabelunits,oCustomserachunits,oLabelAgreement,oCustomserachagreementnumber);
    oMatrix3.createRow(oLabelmaterial,oCustomserachmaterial,oLabelinvoice,oLabelText,oLabelInvoicedate,oDatePicker1);

     var oLabelcurrency = new sap.ui.commons.Label({text: 'Currency:*'});

      var oCustomserachcurrency = new sap.ui.commons.TextField({value: '', width: '88%'});

      oLabelcurrency.setLabelFor(oCustomserachcurrency);



     var oLabelinvoiceline = new sap.ui.commons.Label({text: 'Invoice Line Number:'});


     var oLabelInvoicelinetext= new sap.ui.commons.TextField({value: '', width: '100%'});

     oLabelinvoiceline.setLabelFor(oLabelInvoicelinetext);
          var oLabelShipmentdate = new sap.ui.commons.Label({text: 'Shipment Date:'});


        // create a simple DatePicker
          var oDatePicker2 = new sap.ui.commons.DatePicker('');
          oDatePicker2.setWidth("170px");
        //  oDatePicker1.setYyyymmdd("20100101");
          oDatePicker2.setLocale("en-US"); // Try with "de" or "fr" instead!
          oDatePicker2.attachChange(
                function(oEvent){
                    if(oEvent.getParameter("invalidValue")){
                        oEvent.oSource.setValueState(sap.ui.core.ValueState.Error);
                    }else{
                        oEvent.oSource.setValueState(sap.ui.core.ValueState.None);
                    }
                }
          );


    oMatrix3.createRow(oLabelcurrency,oCustomserachcurrency,oLabelinvoiceline,oLabelInvoicelinetext,oLabelShipmentdate,oDatePicker2);

     var oImage = new sap.ui.commons.Image();
        oImage.setSrc("icon:image/required_field_icon.png");
        oImage.setAlt("alternative image text for image");


     var oLabelunits = new sap.ui.commons.Label({text: 'Units:*'});
     var oCustomserachunits= new sap.ui.commons.TextField({value: '', width: '88%'});

     oLabelunits.setLabelFor(oCustomserachunits);

          var oLabelAgreement = new sap.ui.commons.Label({text: 'Agreement Number:'});

          var oLabelagreement = new sap.ui.commons.TextField({value: '', width: '100%'});

          oLabelAgreement.setLabelFor(oLabelagreement);

            //Create Search Field for Custom column search
        /*  var oCustomserachagreementnumber = new sap.ui.commons.SearchField("s9",{
                enableListSuggest:false,
                placeholder:"Search",
                width:"170px",
                serach:function(oEvent){

                }

            });*/

           var oLabelnone = new sap.ui.commons.Label({text: ''});
           var oLabelnone1 = new sap.ui.commons.Label({text: ''});  

            var deletebton=new sap.ui.commons.Button({
                text:"Delete",
                width:"70px",
                icon:"sap-icon://delete",
                //lite:true,
                press:function(oEvent){


                    if(!oPanel3.getCollapsed()){
                         oPanel3.setCollapsed(false);
                    }else{
                         oPanel3.setCollapsed(false);
                    }

                       var len=$('#panelcontainer .sapUiPanel').length;
                      // var headlen=$('#panelcontainer .sapUiPanel .sapUiPanelHdr').length;
                      // alert(len);
                       var selected=oPanel3.getId();

                        //   $('#panelcontainer .sapUiPanel').not( "#txn_1" ).remove();

                       if(len==1){

                           $("#"+selected).not("#txn_1").remove();
                       }else{

                       $("#"+selected).remove();
                       }
                       var splitdata=selected.split('_');
                       var delposition=parseInt(splitdata[1]);
                      // alert(delposition);

                       $('#panelcontainer .sapUiPanel').each(function(i, obj) {
                           //alert("i22"+i);
                           var i=i+1;

                           if(delposition >= i  )
                           {
                               var newid=splitdata[0]+"_"+i;
                              $(this).attr("id", newid);
                              $(this).attr("data-sap-ui", newid);
                              $(this).attr("aria-labelledby",newid+"-title");
                              $(this).attr("aria-describedby",newid+"-acc");

                           }
                        });

                       $('#panelcontainer .sapUiPanel .sapUiPanelHdr').each(function(i, obj) {
                           //alert("i22"+i);
                           var i=i+1;

                           if(delposition >= i  )
                           {
                               var newid=splitdata[0]+"_"+i;
                               $(this).attr("id",newid+"-hdr");

                           }
                        });
                       $('#panelcontainer .sapUiPanel .sapUiPanelHdr .sapUiPanelTitle').each(function(i, obj) {
                           //alert("i22"+i);
                           var i=i+1;

                           if(delposition >= i  )
                           {
                               var newid=splitdata[0]+"_"+i;
                               $(this).attr("id",newid+"-title");

                           }
                        });

                       $('#panelcontainer .sapUiPanel .sapUiPanelHdr .sapUiPanelTb ').each(function(i, obj) {
                           //alert("i22"+i);
                           var i=i+1;

                           if(delposition >= i  )
                           {
                               var newid=splitdata[0]+"_"+i;
                               $(this).attr("id",newid+"-tb");

                           }
                        });

                       $('#panelcontainer .sapUiPanel .sapUiPanelCont').each(function(i, obj) {
                           //alert("i22"+i);
                           var i=i+1;

                           if(delposition >= i  )
                           {
                               var newid=splitdata[0]+"_"+i;
                               $(this).attr("id",newid+"-cont");

                           }
                        });


                       /*for(i;i<len;i++){

                           var newid=splitdata[0]+"_"+i;
                           var j = i+1;
                           var oldID = splitdata[0]+"_"+j;

                           $("#"+oldID).css({"border-color":"red","border-width":"1px","border-style":"solid"});

                           $("#"+selected).attr("id",newid);


                       }*/

                    //$(this).parent().remove();
                    // dispAlert() ;
                }
            }).addStyleClass("datacheck");
            //deletebton.addStyleClass("deletedata");
            //oPanel3.addButton(deletebton);

            oPanel3.onAfterRendering = function() {
          if (sap.ui.commons.Panel.prototype.onAfterRendering) {
            sap.ui.commons.Panel.prototype.onAfterRendering.apply(this, arguments);
          }
          var $this = this.$();
          var span = $this.find('.sapUiPanelIco');
          span.detach();
          $this.find('.sapUiPanelHdr').append(span);

        };

            oMatrix3.createRow(oLabelunits,oCustomserachunits,oLabelAgreement,oLabelagreement,oLabelnone,deletebton);





    oPanel3.addContent(oMatrix3);

    oPanel3.placeAt("panelcontainer");
    }

var Iconadd=new sap.ui.commons.Button（{//add container code
文本：“添加”，
宽度：“65px”，
图标：“sap-icon://add",
按：函数（）{
var len=$（'#panelcontainer.sapUiPanel'）.length；
//警报（“len”+len）；
Createnewtransaction（len+1）；
//警报（“+len”）；
//var content=$（“#panelcontainer”）.html（）；
//$（“#panelcontainer”）。追加（内容）；
//变量长度=$（'#panelcontainer'）。长度；
//警报（“+”长度）；
}
});
创建新事务（1）//onload默认情况下应显示一个conatiner
函数Createnewtransaction（len）{//面板代码和删除容器代码
//警报（“in”+len）；
var oPanel3=新的sap.ui.commons.Panel（“txn_”+len，{width:“100%”，showclappseicon:false}）；
oPanel3.setAreaDesign（sap.ui.commons.enums.AreaDesign.Fill）；
setBorderDesign（sap.ui.commons.enums.BorderDesign.None）；
setTitle（新的sap.ui.core.Title（{text:“Transaction Details”}））；
//setTitle（新的sap.ui.core.Title（{text:“Transaction Details”}））；
var oMatrix3=new sap.ui.commons.layout.MatrixLayout（{width:'600px'，columns:8，width:'auto}）；
//oMatrix3.设置宽度（'150px'，'200px'，'200px'，'170px'，'200px'）；
oMatrix3.设置宽度（'150px'、'200px'、'200px'、'170px'、'200px'、'210px'）；
oMatrix3.setLayoutFixed（真）；
var olabelmatterial=new sap.ui.commons.Label（{text:'Material:'}）；
var oCustomserachmaterial=new sap.ui.commons.TextField（{value:''，width:'88%'）{
启用：对，
更改：函数（）{
}
});
oLabelmaterial.setLabelFor（OcustomerachMaterial）；
var oLabelinvoice=new sap.ui.commons.Label（{text:'发票号：'}）；
var oLabelText=new sap.ui.commons.TextField（{value:''，width:'100%}）；
oLabelinvoice.setLabelFor（oLabelText）；
var oLabelInvoicedate=new sap.ui.commons.Label（{text:'发票日期：'}）；
//创建一个简单的日期选择器
var oDatePicker1=新的sap.ui.commons.DatePicker（“”）；
oDatePicker1.设定宽度（“170px”）；
//oDatePicker1.setYyyymmdd（“20100101”）；
oDatePicker1.setLocale（“en-US”）；//改为使用“de”或“fr”！
oDatePicker1.attachChange(
功能（oEvent）{
if（oEvent.getParameter（“invalidValue”））{
oEvent.oSource.setValueState（sap.ui.core.ValueState.Error）；
}否则{
oEvent.oSource.setValueState（sap.ui.core.ValueState.None）；
}
}
);
//将其附加到页面中的某个元素
//oDatePicker1.地点（“样本1”）；
//oMatrix3.createRow（OLABELMATERY、OCUSTOMSERACHTERY、oLabelText、oLabelInvoicedate、oDatePicker1、OLABELCURRENY、OCUSTOMSERACURENY、OLABELINVOICELINEXT、oLabelShipmentdate、oDatePicker2、oLabelunits、OCUSTOMSERACHARGENT、OCUSTOMSERACHARGENT编号）；
oMatrix3.createRow（OLABELMATERY、OCUSTOMSERACHMATERY、oLabelinvoice、oLabelText、oLabelInvoicedate、oDatePicker1）；
var oLabelcurrency=new sap.ui.commons.Label（{text:'Currency:'}）；
var oCustomserachcurrency=new sap.ui.commons.TextField（{value:''，width:'88%}）；
oLabelcurrency.setLabelFor（oCustomserachcurrency）；
var oLabelinvoiceline=new sap.ui.commons.Label（{text:'发票行号：'}）；
var oLabelInvoicelinetext=new sap.ui.commons.TextField（{value:''，width:'100%}）；
oLabelinvoiceline.setLabelFor（Olabelinvoicelineext）；
var oLabelShipmentdate=new sap.ui.commons.Label（{text:'装运日期：'}）；
//创建一个简单的日期选择器
var oDatePicker2=新的sap.ui.commons.DatePicker（“”）；
oDatePicker2.设定宽度（“170px”）；
//oDatePicker1.setYyyymmdd（“20100101”）；
oDatePicker2.setLocale（“en-US”）；//请改为使用“de”或“fr”！
oDatePicker2.attachChange(
功能（oEvent）{
if（oEvent.getParameter（“invalidValue”））{
oEvent.oSource.setValueState（sap.ui.core.ValueState.Error）；
}否则{
oEvent.oSource.setValueState（sap.ui.core.ValueState.None）；
}
}
);
oMatrix3.createRow（oLabelcurrency、oCustomserachcurrency、oLabelinvoiceline、oLabelInvoicelinetext、oLabelShipmentdate、oDatePicker2）；
var oImage=new sap.ui.commons.Image（）；
setSrc（“icon:image/required_field_icon.png”）；
setAlt（“图像的替代图像文本”）；
var oLabelunits=new sap.ui.commons.Label（{text:'Units:'}）；
var oCustomserachunits=new sap.ui.commons.TextField（{value:''，width:'88%}）；
oLabelunits.setLabelFor（OcustomerachUnits）；
var olabeagreement=new sap.ui.commons.Label（{text:'协议号：'}）；
var olabeagreement=new sap.ui.commons.TextField（{value:''，width:'100%}）；
oLabelAgreement.setLabelFor（oLabelAgreement）；
//为自定义列搜索创建搜索字段
/*var oCustomserachagreementnumber=new sap.ui.commons.SearchField（“s9”{
enableListSuggest:false，
占位符：“搜索”，
宽度：“170px”，
serach：功能（oEvent）{
}
});*/
var oLabelnone=new sap.ui.commons.Label（{text:'}）；
var oLabelnone1=新的sap.ui.commons.Label（{text:'}）；
var deletebton=new sap.ui.commons.Button({
文本：“删除”，
宽度：“70px”，
图标：“sap-icon://delete",
//l