c# - Get clicked image id on dynamic div -

in here able display university images on dynamically created div. want id of university image user selected, use id display courses selected university offer. there way that?

  protected void fetchuniversities()      {         list<university> unilist = new list<university>();         using (var dd = new universitycontext())     {       unilist = universitycontroller.fetchuniversitiesoffercourses(dd);     }           literal header = new literal();         header.text = "<div class=\"container\"><div class=\"row\"><h2>apply university</h2><p>select prefferd university</p></div></div>";          companypanel.controls.add(header);          foreach (var item in unilist)         {                  literal label1 = new literal();                 label1.text = "<div class=\"container\"><div class=\"row\" >";                  literal lbltwo = new literal();                 lable2.text = "<img src=\"/template/images/" + item.imagename + "\" height=\"100%\"/>";                  literal lbllast = new literal();                 label3.text = "</div></div>";                  panel1.controls.add(label1);                 panel1.controls.add(label2);                 panel1.controls.add(label3);             }     } 

you achieve in better way moving different framework , return data (e.g. json) in response ajax query (have @ asp.net mvc).

here way achieve using example, bit cumbersome , haven't tested should right direction

add method follows:

[webmethod] public static string getuniversitycourses(int universityid) {     list<universitycourses> courses = ...     stringbuilder courseshtml = new stringbuilder();     foreach(var course in courses) {         //generate html here         courseshtml.append("<div>" + course.name + "</div>";     }     return courseshtml.tostring(); } 

then add javascript code aspx file:

function getuniversitycourses(id) {  $.ajax({     type: "post",     url: "default.aspx/getuniversitycourses",     data: {"id": id,     error: function (xmlhttprequest, textstatus, errorthrown) {         alert("request: " + xmlhttprequest.tostring() + "\n\nstatus: " + textstatus + "\n\nerror: " + errorthrown);     },     complete: function (jqxhr, status) {         $("#coursescontainer_" + id).html(jqxhr.responsetext);     } }); 

}

then in server side code:

lable2.text = "<a href="javascript:void(0);" data-getcourseid=\"" + item.id + "\"><img src=\"/template/images/" + item.imagename + "\" height=\"100%\"/></a><div id=\"coursescontainer_\"" + item.id + "</div><script>$('a[data-getcourseid=\"" + item.id + "\"]').on('click', function() { getuniversitycourses(" + item.id + ")}</script>";