Jquery/Javascript：動的に生成されるコントロールのClientIDを取得する方法

Question

javascript/jqueryを使用して動的に作成されたコントロールのクライアントIDを取得する方法を教えてください。

私はdatepickerを持っており、値が変更された場合、textchangedイベントをトリガーしていくつかの機能を実行する必要があります。以下は、日付ピッカーテストのために

protected void Page_Init(object sender, EventArgs e) 
{ 
     LoadControls(reportDefId); 
} 

protected void LoadControls(int reportDefId) 
{ 
    HtmlTableCell cellDate = new HtmlTableCell(); 
    TextBox dte = new TextBox(); 
    dte.ToolTip = "If you need to filter for blank dates, please select date range 1/1/1753-1/1/1753"; 
    dte.Attributes.Add("type", "text"); 
    dte.Attributes.Add("class", "datepicker"); 
    if (rfl.fieldDisplayName.Contains("Start") || rfl.fieldDisplayName.Contains("End")) 
     dte.ID = "dte" + id.ToString(); 
    else 
     dte.ID = "dteFr" + id.ToString(); 
    dte.Style["Width"] = "85px"; 
    dte.Style["Height"] = "24px"; 
    dte.TextChanged += new EventHandler(dte_TextChanged); 
    cellDate.Controls.Add(dte); 
} 

が、私はハードそれがtextchnagedイベントを発生かどうかを確認するためのClientID「MainContent_dteFr1002」のコード化されている動的に生成されたテキストボックスのため

function BindControlEvents() { 
    $(".datepicker").datepicker({ 
     format: 'mm/dd/yyyy', 
     autoclose: true, 
     todayBtn: 'linked' 
    }).on('changeDate', function (ev) { 
     __doPostBack('MainContent_dteFr1002', ''); 
    }).on('clearDate', function (ev) { 
     //to do 
    }); 
} 

//Initial bind 
    $(document).ready(function() { 
     BindControlEvents(); 
    }); 

//Re-bind for callbacks 
    var prm = Sys.WebForms.PageRequestManager.getInstance(); 
    prm.add_endRequest(function() { 
     BindControlEvents(); 
    }); 

コードビハインド私のスクリプトです。します。ですから、cliendid値を動的に渡す必要があります。これは、cliendIDにdteが含まれています。

私は検索しましたが、適切な答えが見つかりませんでした。

助けてください！ ありがとう

Answer 1

オン変更機能は、それをトリガしたダイナミックコントロールへの参照を自動的に持つ必要があります。

alert(ev.target.id); 

が一方向の場合は、idが表示されます。

$(this).attr("id"); 

又は

this.id 

動的IDがそれぞれ含まれているべきです。 CliendIDの定義が、イベントでトリガーされたコントロールのほかに何かを意味する場合、それが何であるか、そしてそれがchangeイベントでこれと一意に結びつく方法を指定する必要があります。

Answer 2

ボタンをコンテナに置いていると仮定できます。

<div class='ButtonContainer'> 
<button value="textChanges" id="MainContent_dteFr1002" /> 
</div> 
<input type="text" class='datepicker' value='2017-05-01' /> 

その後イベントは、あなたがどこかに後で使用するために、各コントロールのClientIDを保存することができ、この

$(".datepicker").datepicker({ 
    format: 'mm/dd/yyyy', 
    autoclose: true, 
    todayBtn: 'linked' 
}).on('changeDate', function (ev) { 
    $(".ButtonContainer").find("button").click(); 
}).on('clearDate', function (ev) { 
    //to do 
}); 

//OR text changed on the same controller 

$(".datepicker").datepicker({ 
format: 'mm/dd/yyyy', 
autoclose: true, 
todayBtn: 'linked' 
}).on('changeDate', function (ev) { 
// (this) is the changes textbox 
var id = $(this).attr("id"); 
__doPostBack(id, ''); 
}).on('clearDate', function (ev) { 
       //to do 
}); 

Answer 3

ようになります。

List<string> dynamicID = new List<string>(); 
dynamicID.Add(dte.ClientID); 

または自己のIDを作り、彼らはMainContent_ID_5

dte.ID = "ID_" + index; 
dte.ClientIDMode = ClientIDMode.Static; 

または制御パスを下に移動し、正しいIDを見つけるにASPNETで名前を変更されないように、静的にのClientIDモードを設定し、あなたのコントロールを与え、この例では、TextBoxが最初のコントロールとしてPlaceHolder1に追加されています。

<%= PlaceHolder1.Controls[0].ClientID %>