HtmlGenericControl OnInit() Client ID RSS

• • Reply
  

  mhbrown

  Member

  48 Points

  66 Posts

  HtmlGenericControl OnInit() Client ID

  Apr 22, 2010 09:19 AM|LINK

  Hi guys,

  I have created an Asp.Net Ajax Server Control that will be dropped on several aspx pages.  I have created an HTMLGenericControl within the OnInit method of the control.  This control is a div.  Within the code I also need to add an onclick event to a button so that this div is shown.

  However, when I call divName.ClientID within the control to pass it to the javascript it doesn't include the part of the ID before the "divName" section of the rendered control id - ct01_ct01_divName.

  Why is this?

  Here is part of the OnInit() method within the ASP.Net Ajax Server Control

  protected override void OnInit(EventArgs e)
          {
              base.OnInit(e);
  
  
              divPopup = new HtmlGenericControl("div");
  
  
              divPopup.Attributes.Add("runat", "server");
              divPopup.ID = "divPopup";
              divPopup.Attributes.Add("style", "display:none;border:#5177b8 2px solid;left:200px;top:200px;position:absolute;background-color:white;");
  
  
              btnGenerateReport = new Button();
              btnGenerateReport.Text = "Generate Report";
              btnGenerateReport.ID = "btnGenerateReport";
              btnGenerateReport.Attributes.Add("onclick", "showPopup('" + divPopup.ClientID + "', '400','400', '50');return false;");

  
  
  

  Thanks,

  Mark

• • Reply
  

  CruzerB

  Contributor

  5399 Points

  1098 Posts

  Re: HtmlGenericControl OnInit() Client ID

  Apr 22, 2010 02:27 PM|LINK

  Dear mhbrown,

  mhbrown

  However, when I call divName.ClientID within the control to pass it to the javascript it doesn't include the part of the ID before the "divName" section of the rendered control id - ct01_ct01_divName.

  
  

  If I'm not wrong, it because the HtmlGenericControl control is not a server control. It is a html control.
  

  No matter how much time you spend on coding. Wish you happy coding.
  My Technical Blog
• • Reply
  

  mhbrown

  Member

  48 Points

  66 Posts

  Re: HtmlGenericControl OnInit() Client ID

  Apr 22, 2010 03:41 PM|LINK

  No I don't think this is the problem.  As when it renders on the page, its ID has the random prefix of ctl01_ctl02 etc before the actual ID that was assigned to it in code ie divName.

  When I use .ClientID it only returns "divName" and does not contain the prefix that it appears with in the source of the page.

  Any other suggestions?

  
  

• • Reply
  

  CruzerB

  Contributor

  5399 Points

  1098 Posts

  Re: HtmlGenericControl OnInit() Client ID

  Apr 22, 2010 04:02 PM|LINK

  Dear mhbrown,

  I think this is a good link for u.
  

  http://msdn.microsoft.com/en-us/library/1d04y8ss.aspx

  No matter how much time you spend on coding. Wish you happy coding.
  My Technical Blog
• • Reply
  

  mhbrown

  Member

  48 Points

  66 Posts

  Re: HtmlGenericControl OnInit() Client ID

  Apr 22, 2010 07:12 PM|LINK

  Very helpful, I will give it a shot when I am back in the office tomorrow.  There is a property that I can try and set that will hopefully return the ID that I require.

  Thanks

   

  CruzerB

  Dear mhbrown,

  I think this is a good link for u.
  

  http://msdn.microsoft.com/en-us/library/1d04y8ss.aspx

  
  

  
  

  • Edited by mhbrown on Apr 22, 2010 07:14 PM
• • Reply
  

  mhbrown

  Member

  48 Points

  66 Posts

  Re: HtmlGenericControl OnInit() Client ID

  Apr 22, 2010 09:04 PM|LINK

  Actually, what I thought was going to solve the problem has only just been introduced into .Net 4.  No wonder I didn't recognise the property.  ClientIDMode.  

  Back to the drawing board I suppose. 

• • Reply
  

  MetalAsp.Net

  All-Star

  112754 Points

  18375 Posts

  Moderator

  Re: HtmlGenericControl OnInit() Client ID

  Apr 22, 2010 09:14 PM|LINK

  Your code looks OK.  You're passing divPopup.ClientID, so it should work.  What's the problem?  Is the problem in showPopup()?  If so, show the code. 

  C# <--> VB.Net Translator  |  jQuery Widgets
  • Edited by MetalAsp.Net on Apr 22, 2010 09:40 PM
• • Reply
  

  mhbrown

  Member

  48 Points

  66 Posts

  Re: HtmlGenericControl OnInit() Client ID

  Apr 22, 2010 09:30 PM|LINK

  I will explain the setup and the problem in full.

  Basically, I have created a ASP.Net Ajax Custom Control Project (inherits ScriptControl).  This is to be registered within a usercontrol which is then loaded in an aspx page.

  Within the Custom Control I also have a javascript file which contains the showPopup function.  I need to pass the full clientID of the HtmlGenericControl (div) that I created in the Custom Control to the onclick event of the button that I created in the custom control. 

  However, when I use ClientID on the div, to pass to the javascript function it does not give me the full nested Control ID.  

  So what I am wanting is to be able to get the full nested control ID from within the Custom Control as it is displayed in the view source of the page, for example:

  ctl00$ContentPlaceHolder1$CustomUserControl1$NestedExampleLabel

  Really, not sure where I have gone wrong or as to why it is not working.  I will post the full C# code tomorrow morning when I get into the office.

  Again, thanks for your help - much appreciated!

• • Reply
  

  mhbrown

  Member

  48 Points

  66 Posts

  Re: HtmlGenericControl OnInit() Client ID

  Apr 23, 2010 08:55 AM|LINK

  Here is the control code:

  public class GenerateReport : ScriptControl
      {
          //Report Controls
          private Button btnGenerateReport;
          private Label lblInjectScript;
  
  
          //Popup Controls
          private HtmlGenericControl divReportPopup;
          private HtmlGenericControl divReportPopupHead;
          private HtmlGenericControl divReportPopupHeadContainer;
          private HtmlGenericControl spanReportPopupHeadContainerClose;
          private Button btnStartReportGeneration;
  
  
          private List<string> _usernames = new List<string>();
          public List<string> Usernames { get { return this._usernames; } set { _usernames = value; } }
  
  
          public delegate void AsyncTaskDelegate();
          AsyncTaskDelegate _runnerDelegate = null;
  
  
          public delegate void ReportGeneratedEventHandler(Document report);
          public event ReportGeneratedEventHandler ReportGenerated;
          
  
          private Guid _placementID;
          public Guid PlacementID
          {
              get { return this._placementID; }
              set { _placementID = value; }
          }
  
  
          public GenerateReport()
          {
              //
              // TODO: Add constructor logic here
              //
          }
          protected override IEnumerable<ScriptDescriptor>
                  GetScriptDescriptors()
          {
              ScriptControlDescriptor descriptor = new ScriptControlDescriptor("HospitalAttachmentReport.GenerateReport", this.ClientID);
              yield return descriptor;
          }
  
  
          // Generate the script reference
          protected override IEnumerable<ScriptReference>
                  GetScriptReferences()
          {
              yield return new ScriptReference("HospitalAttachmentReport.GenerateReport.js", this.GetType().Assembly.FullName);
          }
  
  
          IAsyncResult OnBegin(Object sender, EventArgs e, AsyncCallback cb, object state)
          {
              _runnerDelegate = new AsyncTaskDelegate(this.GenerateTheReport);
              IAsyncResult result = _runnerDelegate.BeginInvoke(cb, state);
  
  
              return result;
          }
  
  
          void OnEnd(IAsyncResult asyncResult)
          {
              btnStartReportGeneration.Text = "Download Report";
              btnStartReportGeneration.Enabled = true;
              _runnerDelegate.EndInvoke(asyncResult);
  
  
              //lblInjectScript.Text = "<script>showPopup('" + this.ID + "_" + divPopup.ClientID + "', '400','400', '50'); return false;</script>";
          }
  
  
          void OnTimeOut(IAsyncResult asyncResult)
          {
          }
  
  
          protected override void OnPreRender(EventArgs e)
          {
             base.OnPreRender(e);
          }
  
  
          protected override void EnsureChildControls()
          {
              base.EnsureChildControls();
          }
  
  
          public void GenerateTheReport()
          {
              Report rep = new Report();
              rep.IncludeFirstPage = true;
            
  
              Document report = new Document();
              report = rep.Start(report);
  
  
              ReportGenerated.Invoke(report);
          }
  
  
          protected override void OnInit(EventArgs e)
          {
              base.OnInit(e);
  
  
              divReportPopup = new HtmlGenericControl("div");
  
  
              divReportPopup.Attributes.Add("runat", "server");
              divReportPopup.ID = this.ID + "divReportPopup";
              divReportPopup.Attributes.Add("style", "display:none;border:#5177b8 2px solid;left:200px;top:200px;position:absolute;background-color:white;");
  
  
              btnGenerateReport = new Button();
              btnGenerateReport.Text = "Generate Report";
              btnGenerateReport.ID = "btnGenerateReport";
              btnGenerateReport.Attributes.Add("onclick", "showPopup('" + divReportPopup.UniqueID + "', '400','400', '50');return false;");
  
  
              divReportPopupHead = new HtmlGenericControl("div");
              divReportPopupHead.Attributes.Add("style", "display:block; width:100%; background-color:#5177b8;");
  
  
              divReportPopupHeadContainer = new HtmlGenericControl("div");
              divReportPopupHeadContainer.Attributes.Add("style", "text-align:right; padding-right:10px;");
  
  
              spanReportPopupHeadContainerClose = new HtmlGenericControl("span");
              spanReportPopupHeadContainerClose.InnerText = "Cancel";
              spanReportPopupHeadContainerClose.Attributes.Add("style", "cursor:pointer;");
              spanReportPopupHeadContainerClose.Attributes.Add("onclick", "hidePopup('" + divReportPopup.UniqueID + "');");
  
  
              divReportPopupHeadContainer.Controls.Add(spanReportPopupHeadContainerClose);
              divReportPopupHead.Controls.Add(divReportPopupHeadContainer);
  
  
              btnStartReportGeneration = new Button();
              btnStartReportGeneration.ID = "btnStartReportGeneration";
              btnStartReportGeneration.Text = "Start";
              btnStartReportGeneration.Click += new EventHandler(btnStartReportGeneration_Click);
  
  
              divReportPopup.Controls.Add(divReportPopupHead);
              divReportPopup.Controls.Add(btnStartReportGeneration);
  
  
              lblInjectScript = new Label();
              lblInjectScript.ID = "lblInjectScript";
  
  
  
  
              Controls.Add(lblInjectScript);
              Controls.Add(btnGenerateReport);
              Controls.Add(divReportPopup);
          }
  
  
  
  
          void btnStartReportGeneration_Click(object sender, EventArgs e)
          {
              Page.RegisterAsyncTask(new PageAsyncTask(new BeginEventHandler(OnBegin), new EndEventHandler(OnEnd), new EndEventHandler(OnTimeOut), sender));
          }
  
  
      }

  
  Here is the javascript code:

  function showPopup(popupID, width, height, top) {
      //calculate the negative left margin
      var varMarginLeft = ((width / 2) * -1);
      var varSuffix = "px";
      var varMarginTop = ((top / 2) * -1);
  
      document.getElementById(popupID).style.display = "block";
      document.getElementById(popupID).style.height = height + varSuffix;
      document.getElementById(popupID).style.width = width + varSuffix;
      document.getElementById(popupID).style.top = top + varSuffix;
      document.getElementById(popupID).style.left = "50%";
      document.getElementById(popupID).style.marginLeft = varMarginLeft + varSuffix;
  }
  
  function hidePopup(popupID) {
      document.getElementById(popupID).style.display = "none";
  }

  
  
  

  
  

  • Edited by mhbrown on Apr 23, 2010 09:08 AM
  • Edited by mhbrown on Apr 23, 2010 09:09 AM
  • Edited by mhbrown on Apr 23, 2010 09:10 AM
  • Edited by mhbrown on Apr 23, 2010 09:11 AM
• • Reply
  

  CruzerB

  Contributor

  5399 Points

  1098 Posts

  Re: HtmlGenericControl OnInit() Client ID

  Apr 23, 2010 10:21 AM|LINK

  Dear mhbrown,

  1. btnGenerateReport = new Button();  
  2.             btnGenerateReport.Text = "Generate Report";  
  3.             btnGenerateReport.ID = "btnGenerateReport";  
  4.             btnGenerateReport.Attributes.Add("onclick", "showPopup('" + divReportPopup.UniqueID + "', '400','400', '50');return false;");  
  5.   
  6.             divReportPopupHead = new HtmlGenericControl("div");  
  7.             divReportPopupHead.Attributes.Add("style", "display:block; width:100%; background-color:#5177b8;"); 
     
     
     

  Just change divReportPopup.UniqueID to divReportPopup.ClientID. It should able to work.
  

  Only server control will hv then id like u mention :
  

  mhbrown

  So what I am wanting is to be able to get the full nested control ID from within the Custom Control as it is displayed in the view source of the page, for example:

  
  

  U can try to draw a <table>, <div> .... in ur aspx file, then asssign an id to it...

  View source from browser after it render out...
  U will realize that, these kind of html control id will remain the same as u defined.
  

  No matter how much time you spend on coding. Wish you happy coding.
  My Technical Blog