ボタンを押したときにユーザーコントロールを動的に追加する

Question

私の問題は、ボタンをクリックした後にユーザーコントロールをページに動的に追加しようとしていることです。かなりまっすぐに聞こえる。基本的に、追加ボタンの横に追加ボタンがあるテキストフィールドがあります。クリックしてテキストボックスを読み取り専用に設定し、テキストを保持し、追加ボタンを削除に変更して新しいテキストフィールドを追加し、下にボタンを追加します。本質的に、複数の項目をリストに追加する機能を提供します。

私が思いついた解決策は、追加ボタンをクリックすることです。ユーザーが既に入力したすべての単語を含むテキストボックスに単語を追加し、そのリストをセッションに追加します。ポストバックが発生すると、私は単にセッションからリストを取得し、すでに追加されているテキストボックスを再作成します。問題は、ASP .NETページのライフサイクルでボタンクリックイベントが実際にページロードイベントの後に発生しているためです。セッションにリストを取得してテキストボックスを追加しようとすると、読み込まれません。逆に、ページロード完了イベントでテキストボックスを追加しようとすると、ボタンイベントがクリックされたときにボタンイベントが発生しません（これはどういうわけかはっきりしませんが、イベントはこれら2つのイベントの間のボタンにバインドされている可能性が高いため） 。

ちょっとポーズした後、これはASP.NETとC＃だけでは不可能だと思われますが、JavaScriptでこれを行う方法があるかもしれません。誰にどのようにこれを行うにはいくつかの洞察力を持っていますか？私はC＃とjavascriptでよく慣れていますが、ASP .NETにはかなり新しいので、どんな助けもありがたいです。

Answer 1

あなたはこのjsFiddle

HTMLのようにjQueryを使ってあなたの機能を実現することができます

<div id="myDiv"> 
    <div id="item1"> 
     <input id="txt1" name="txt1" type="text"></input><input id="cmdAdd1" type="button" value="Add"></input> 
    </div> 
</div> 

Javascriptのフォームがサーバーにポストバックされた後

var itemCount = 1; 
$('#cmdAdd1').click(function(){addNewItem();}); 

function addNewItem(){ 
    var thisItem = itemCount; 
    // Make last text box readonly 
    $('#txt' + itemCount).attr('readonly', 'readonly'); 
    // Change button to Remove button 
    $('#cmdAdd' + itemCount).attr('value', 'Remove'); 
    $('#cmdAdd' + itemCount).unbind(); 
    $('#cmdAdd' + itemCount).click(function(){removeItem(thisItem);}); 

    // Add new line with text field and button 
    itemCount++; 
    var newItem = '<div id="item' + itemCount + '">' 
    newItem += '<input id="txt' + itemCount + '" name="txt' + itemCount + '" type="text"></input>'; 
    newItem += '<input id="cmdAdd' + itemCount + '" type="button" value="Add"></input>'; 
    newItem += "</div>"; 

    $('#myDiv').append(newItem); 
    $('#cmdAdd' + itemCount).click(function(){addNewItem();});  
} 

function removeItem(i){ 
    $('#item' + i).remove(); 
} 

、あなたをFoを歩いてフィールドを反復することができますRMコントロール。

C＃

int n=1; 
while (Request["txt" + n] != null) 
{ 
    Console.WriteLine(Request["txt" + n]); 
    n++; 
}