• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 417
  • Last Modified:

pass an attribute of server control to javascript

private void Calendar1_SelectionChanged(object sender, System.EventArgs e)
            {
                  string chosenDate=Calendar1.SelectedDate.ToShortDateString();
                  SelectedDateLabel.Text="DATE SELECTED: "
                        +Calendar1.SelectedDate.ToShortDateString()+
                        " (MM/DD/YYYY)";
                  Session["chosenDate"]=chosenDate;
                  dBC = new DataBaseConnection();
                  results = dBC.ShowWorkoutForChosenDate(chosenDate,"usman700");
                  for(int i=0;i<results.Count;i++)
                  {
                        HtmlAnchor htmlAnchor = new HtmlAnchor();
                        htmlAnchor.InnerText=results[i].ToString();
                        htmlAnchor.Style.Add("font-size","10");
                        htmlAnchor.Style.Add("font-face","garamond");
                        htmlAnchor.Style.Add("color","orange");
                        htmlAnchor.ID="htmlAnchor"+i.ToString();
                        htmlAnchor.HRef="javascript:showWindow("+ <%=results[i].ToString()%>;+")";
                        ExercisePanel.Controls.Add(htmlAnchor);
                        ExercisePanel.Controls.Add(new LiteralControl("<br/>"));
                  }
            }// end of method

<script type="text/javascript">
      <!--
            function showWindow(obj)
                  {
                        
                        var x = document.all. ?????? -----> CANT FIGURE THIS OUT !
                        alert(x);
                  }      
      -->      

I am trying to pass the results[i].tostring to the javascript function and then show that value in alert.
How can I pass some value of the HtmlAnchor Control to the javascript function.
Till now alert shows either [object] or i get an error warning from javascript.
0
deersuper
Asked:
deersuper
  • 5
  • 3
  • 2
2 Solutions
 
doobdaveCommented:
One possible workaround is the following:

In your ASP code, set the value of a hidden control (<INPUT TYPE=HIDDEN ... >) to be the value you want.

Your js function can then access the hidden control by its ID and display the info you want.

Let me know if this works.

Regards,

David
0
 
deersuperAuthor Commented:
thanks David for the response ! this is going to osund like a stupid question but I want to be sure where exactly am I adding this hidden field in the code snippet I have provided above !

Thanks David !
0
 
b1xml2Commented:
Solution #1 pass in item
==================
htmlAnchor.HRef = string.Format(@"javascript:showWindow({0},document.getElementById('{1}'));",results[i],htmlAnchor.ID);

function showWindow(obj,el)
{
      alert(el.tagName);
}    


Solution #2 using this (cross browser)
========
htmlAnchor.HRef = "#";
htmlAnchor.Attributes["onclick"] = string.Format(@"javascript:showWindow({0},this);",results[i]);


function showWindow(obj, el)
{
  alert(el.tagName)
}

Solution #3 using MSIE only
==================

htmlAnchor.HRef = "#";
htmlAnchor.Attributes["onclick"] = string.Format(@"javascript:showWindow({0});",results[i]);

function showWindow(obj)
{
  alert(event.srcElement.tagName);
}
0
Restore individual SQL databases with ease

Veeam Explorer for Microsoft SQL Server delivers an easy-to-use, wizard-driven interface for restoring your databases from a backup. No expert SQL background required. Web interface provides a complete view of all available SQL databases to simplify the recovery of lost database

 
doobdaveCommented:
Hi again,

it seems you are adding controls dynamically (in code,at runtime) to your aspx page using the code snippet above, correct?

You just need to add code to create one more HTML control of type INPUT=HIDDEN.
This is like a text HTML control, except a web user will not see it.
However, it still has a .text property, which you can set dynamically (in your code, as you create the control).
Give the control an ID too.

Your javascript function shuold then be able to access it as it will appear on the page.

A useful trick to ensure that the control is getting generated is to browse to the page in IE and click View...Source. This will show the actual HTML which will (hopefully) contain the hidden control and your javascript function.

Let me know if you need more guidance,

good luck,

David
0
 
b1xml2Commented:
1. there's no need to use the Hidden Input tag.
2. He has already been giving the control the appropriate ID value
    htmlAnchor.ID="htmlAnchor"+i.ToString();
3. This problem is 25% ASP.NET, 75% javascript.
0
 
b1xml2Commented:
i mean really, can you imagine hime having to output numerous HIDDEN input tags (as many as the anchor tags that he is generating). I think not! Not a good idea to unnecessarily store the control names in a hidden input, that's just plain dumb. Not when you can either send them through the javascript function (if using href, you;d have to pass in the actual reference to the control via the document.getElementById) or if in the onclick event, the this keyword is sufficient.

0
 
deersuperAuthor Commented:
Dave, as per your recommendation I added hidden fields and set their values.

for(int i=0;i<results.Count;i++)
                  {
                        HtmlAnchor htmlAnchor = new HtmlAnchor();
                        htmlAnchor.InnerText=results[i].ToString();
                        htmlAnchor.Style.Add("font-size","10");
                        htmlAnchor.Style.Add("font-face","garamond");
                        htmlAnchor.Style.Add("color","orange");
                        htmlAnchor.ID="htmlAnchor"+i.ToString();
                        htmlAnchor.HRef="javascript:showWindow()";
                        HtmlInputHidden x= new HtmlInputHidden ();
                        x.ID="x"+i.ToString();
                        x.Value=results[i].ToString();
                        ExercisePanel.Controls.Add(htmlAnchor);
                        ExercisePanel.Controls.Add(new LiteralControl("<br/>"));

                  }

in javascript:

function showWindow()
{
var x = document.?? ?????
}

I still dont understand how to retrieve the value of a dynamically created anchor tag.
I am sorry for presenting such kiddy questions to you but I cant seem to get it.
Have searched MSDN and the web but couldnt get a reasonable answer.

b1XML2 : thanks for ur answers. I tried them but the alert box keeps giving me "null" or I get the typical ERROR warning in the lower left brower corner.

Please help guys ! I need to get this done before Friday !

thanks
0
 
b1xml2Commented:
first solution
========
private void Calendar1_SelectionChanged(object sender, System.EventArgs e)
  {
       string chosenDate=Calendar1.SelectedDate.ToShortDateString();
       SelectedDateLabel.Text="DATE SELECTED: " 
          +Calendar1.SelectedDate.ToShortDateString()+
          " (MM/DD/YYYY)";
       Session["chosenDate"]=chosenDate;
       dBC = new DataBaseConnection();
       results = dBC.ShowWorkoutForChosenDate(chosenDate,"usman700");
       for(int i=0;i<results.Count;i++)
       {
          HtmlAnchor htmlAnchor = new HtmlAnchor();
          htmlAnchor.InnerText=results[i].ToString();
          htmlAnchor.Style.Add("font-size","10");
          htmlAnchor.Style.Add("font-face","garamond");
          htmlAnchor.Style.Add("color","orange");
          htmlAnchor.ID="htmlAnchor"+i.ToString();
          htmlAnchor.HRef = string.Format(@"javascript:showWindow({0},document.getElementById('{1}'));",results[i],htmlAnchor.ID);
          ExercisePanel.Controls.Add(htmlAnchor);
          ExercisePanel.Controls.Add(new LiteralControl("<br/>"));
       }
}

javascript
=======
function showWindow(obj,el)
{
     alert(el.tagName);
}    
0
 
b1xml2Commented:
second solution
===========
 private void Calendar1_SelectionChanged(object sender, System.EventArgs e)
  {
      string chosenDate=Calendar1.SelectedDate.ToShortDateString();
      SelectedDateLabel.Text="DATE SELECTED: " 
          +Calendar1.SelectedDate.ToShortDateString()+
          " (MM/DD/YYYY)";
      Session["chosenDate"]=chosenDate;
      dBC = new DataBaseConnection();
      results = dBC.ShowWorkoutForChosenDate(chosenDate,"usman700");
      for(int i=0;i<results.Count;i++)
      {
            HtmlAnchor htmlAnchor = new HtmlAnchor();
            htmlAnchor.InnerText=results[i].ToString();
            htmlAnchor.Style.Add("font-size","10");
            htmlAnchor.Style.Add("font-face","garamond");
            htmlAnchor.Style.Add("color","orange");
            htmlAnchor.ID="htmlAnchor"+i.ToString();
            htmlAnchor.HRef = "#";
            htmlAnchor.Attributes["onclick"] = string.Format(@"javascript:showWindow({0},this);",results[i]);
            ExercisePanel.Controls.Add(htmlAnchor);
            ExercisePanel.Controls.Add(new LiteralControl("<br/>"));
      }
}

javascript
======
function showWindow(obj,el)
{
     alert(el.tagName);
}    
0
 
deersuperAuthor Commented:
THank you gentlemen ! I was able to use tips from both of you to get the answer to this problem !
0

Featured Post

Efficient way to get backups off site to Azure

This user guide provides instructions on how to deploy and configure both a StoneFly Scale Out NAS Enterprise Cloud Drive virtual machine and Veeam Cloud Connect in the Microsoft Azure Cloud.

  • 5
  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now