Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Displaying Arrow Images dynamically....

Posted on 2004-04-15
13
Medium Priority
?
464 Views
Last Modified: 2012-06-21
Hi,
 
   I have a Asp.net Page, which contains a UserControl and that UserControl loads some employee names as link buttons from the database, and attaching one eventhandler to all the LinkButtons which will do some stuff according to the selected employee ID and displays some information on that Asp.net Page....

Now the problem is when Iam displaying all the employees names Iam also displaying a blackarrow before each employee name, now when user clicks on one particular employee name I want to display the red arrow, instead of blackarrow only for that particular employee name, rest all must display black arrow... I tried some ways, but I failed to achieve the result... AnyIdeas and if possible sample code would be greatly appreciable....
Please let me know if Iam too vague in explaining...
0
Comment
Question by:steve_mick972
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 5
  • 2
13 Comments
 
LVL 4

Expert Comment

by:caner_elci
ID: 10837871
You can do that in client-side.. using Javascript.. if this is what you want, let me know so I give you an example...
0
 
LVL 37

Expert Comment

by:gregoryyoung
ID: 10838561
is this causing a postback which shows the details ?

If so its very easy on either side (javascript or codebehind)
0
 
LVL 37

Expert Comment

by:gregoryyoung
ID: 10838563
is this causing a postback which shows the details ?

If so its very easy on either side (javascript or codebehind)
0
NFR key for Veeam Backup for Microsoft Office 365

Veeam is happy to provide a free NFR license (for 1 year, up to 10 users). This license allows for the non‑production use of Veeam Backup for Microsoft Office 365 in your home lab without any feature limitations.

 
LVL 1

Author Comment

by:steve_mick972
ID: 10842756
Hi,
  caner_elci, Iam ready to use some javascript, but Iam writing displaying those employeenames using linkbuttons in codebehind, and I know I can append JavaScript in Codebehind, can you please provide me some javascript code which will do that for me, if possible please provide me the javascript code so that I can easily embed that into codebehind..

 gregoryyoung, Iam really not sure which one your asking whether it is causing postback r not??, but I'll explain you wht exactly going on (sorry for being so dumb)... Iam writing a database query which will get me all the employee names and looping through the Reader and creating a linkbutton and the tex of the linkbutton is the employee name and attaching all the link buttons to one eventhandler function, before attaching this link button to a table cell (to place the linkbutton at appropriate place on the page) Iam also attaching a black arrow Image to the table cell... and all this is done in PageLoad() event of the page. this is wat happening in the page, I want a mechanism to check which linkbutton is clicked and accordingly I want to place a red arrow instead of black arrow...


Thank You,
Steve
0
 
LVL 4

Expert Comment

by:caner_elci
ID: 10842858
Hi Steve,

Of course, I can write a sample code for you.. But I need to see your code.. can you please paste some code from your aspx file? Especially, the parts those you create buttons.. So I can write a few Javascript functions to enable/disable them...

Caner
0
 
LVL 1

Author Comment

by:steve_mick972
ID: 10843052

public void Page_Load()
{
  //after opening the database connection and getting the data into the Reader Object
 // this is how my code looks like....
  while(Reader.Read())
  {
   //create a link button for each employee
    LinkButton lnkEmp = new LinkButton();
   // set linkbutton properties
    lnkEmp.ID = Reader["EmpID"].ToString();
    lnkEmp.Text = Reader["EmpName"].ToString() + "<br>";
  //set linkbutton clickevent handler
    lnkEmp.Click += new EventHandler(this.ProcessClick);

   // create a row and cell to attach Image and linkbutton to the page
    HtmlTableRow tblRowEmp = new HtmlTableRow();
    HtmlTableCell tblCellEmp = new HtmlTableCell();
    HtmlTableCell tblCellBarrow = new HtmlTableCell();
   
   //create a HtmlImage and add source as BlackArrow Image and set some prop
    HtmlImage imgBarrow = new HtmlImage();
    HtmlTableCell tblCellBarrow = new HtmlTableCell();
    imgBarrow.Src = "/images/Barrow.gif";
    tblCellEmp.Align = "left";

   //attach link button and image to appropriate cells
    tblCellBarrow.Controls.Add(imgBarrow);
    tblCellEmp.Controls.Add(lnkEmp);
   //attach cells to the row...
    tblRowEmp.Cells.Add(tblCellBarrow);
    tblRowEmp.Cells.Add(tblCellEmp);
  //above row is already attached to a table....
  }
}

that is what happening in my Page_Load() event of the page, Please let me know if you dont understand anything...

Thank You,
Steve
0
 
LVL 4

Expert Comment

by:caner_elci
ID: 10843091
This is fine, but I need to know when and where you are going to disable buttons?
0
 
LVL 1

Author Comment

by:steve_mick972
ID: 10843171
when the user clicks on the link button, instead of BlackArrow Image I want to put  Red Arrow Image before the linkbutton (the code I wrote to put black arrow image I want to replace with it similar code to put red arrow image)..

Steve
0
 
LVL 4

Accepted Solution

by:
caner_elci earned 2000 total points
ID: 10843621
Okay, here we go:

in your C# code, add an attribute to your linkButton which is actually an javaScript event handler for click event of that LinkButton.. That will include a simple javascript code that changes your image.. For example:

HtmlImage imgArrow = new HtmlImage();
imgArrow.ID = "image_to_change";
imgArrow.Src = "Barrow.jpg";
this.Controls.Add( imgArrow );

LinkButton1.Attributes.Add( "onClick", "image_to_change.src='images/RArrow.jpg';" );

Above, you should generate a unique ID for your HtmlImage control, and add that ID to generated JavaScript code in Attributes.Add() method.. such as:

imgArrow.ID = "ArrowImage" + someCounter;
LinkButton1.Attributes.Add( "onClick", imgArrow.ID + ".src='images/RArrow.jpg';" );

This code will add an event handler to your LinkButton and it will be on client-side..

But if your LinkButtons does postback, you should add another attribute for its href property.. if you know any other way to stop it causing postback, you can do that too.. In my example, you can do this:

LinkButton1.Attributes.Add( "href", "#" );

I tried this with a simple project and works fine.. if there is anything you don't understand, please let me know..

Caner ELCI
0
 
LVL 1

Author Comment

by:steve_mick972
ID: 10850256
I am sorry for the late reply, But your code is not working, can you please look into where I am doing wrong... here is what I am doing in my case with your example...

public void Page_Load()
{
  //after opening the database connection and getting the data into the Reader Object
 // this is how my code looks like....
  while(Reader.Read())
  {
   //create a link button for each employee
    LinkButton lnkEmp = new LinkButton();
   // set linkbutton properties
    lnkEmp.ID = Reader["EmpID"].ToString();
    lnkEmp.Text = Reader["EmpName"].ToString() + "<br>";
  //set linkbutton clickevent handler
    lnkEmp.Click += new EventHandler(this.ProcessClick);

   // create a row and cell to attach Image and linkbutton to the page
    HtmlTableRow tblRowEmp = new HtmlTableRow();
    HtmlTableCell tblCellEmp = new HtmlTableCell();
    HtmlTableCell tblCellBarrow = new HtmlTableCell();
   
   //create a HtmlImage and add source as BlackArrow Image and set some prop
    HtmlImage imgBarrow = new HtmlImage();
    HtmlTableCell tblCellBarrow = new HtmlTableCell();
    imgBarrow.Src = "/images/Barrow.gif";
   
// code added..
    imgBarrow.ID = "arrow" + counter // Iam incrementing the counter every call..
    lnkEmp.Attributes.Add("onClick",imgBarrow.ID+".src='/images/Rarrow.gif';");
    lnkEmp.Attributes.Add("href","#");

   //attach link button and image to appropriate cells
    tblCellBarrow.Controls.Add(imgBarrow);
    tblCellEmp.Controls.Add(lnkEmp);
   //attach cells to the row...
    tblRowEmp.Cells.Add(tblCellBarrow);
    tblRowEmp.Cells.Add(tblCellEmp);
  //above row is already attached to a table....
  }
}

in the above code "//code added part "is the one I am changing rest everything I am keeping the same... can you please help me out what's wrong with one Iam doing...
0
 
LVL 4

Expert Comment

by:caner_elci
ID: 10852623
First of all, I have a question.. what are you going to do when users clicks on your lnkEmp? I ask this, because I see that you are adding an event handler to that button, which causes postback (refreshing page and running your server-side code - this.ProcessClick)... So next time the page is loaded, your client-side changes, such as changing image source, will not be seen..
0
 
LVL 1

Author Comment

by:steve_mick972
ID: 10854059
Actually in my case I definitely need to have the post back and the link buttons has to be created dynamically in PageLoad event anyways... I have got the way around in c# without using javascript I have got the solution... but I dont know for some reason your way is not working, I tried to do it in normal way not using my code just sample example, still it was not working... I guess Im doing some thing very wrong...

But still I really appreciate ur help and ofcourse Im accepting ur answer....
I have another Question, I have posted that in ASP.NET section, If you could I would really appreciate your looking at that question.... ..

Thank You,
Steve...
0
 
LVL 4

Expert Comment

by:caner_elci
ID: 10854124
Thank you, I'll check it out..

Caner
0

Featured Post

On Demand Webinar: Networking for the Cloud Era

Ready to improve network connectivity? Watch this webinar to learn how SD-WANs and a one-click instant connect tool can boost provisions, deployment, and management of your cloud connection.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Flash (http://en.wikipedia.org/wiki/Adobe_Flash) has evolved over the years to where it has become a masterful tool for displaying content screen.  It has excellent layout placement, UI precision as well as rendering capabilities. This, along with t…
Real-time is more about the business, not the technology. In day-to-day life, to make real-time decisions like buying or investing, business needs the latest information(e.g. Gold Rate/Stock Rate). Unlike traditional days, you need not wait for a fe…
This course is ideal for IT System Administrators working with VMware vSphere and its associated products in their company infrastructure. This course teaches you how to install and maintain this virtualization technology to store data, prevent vuln…
Sometimes it takes a new vantage point, apart from our everyday security practices, to truly see our Active Directory (AD) vulnerabilities. We get used to implementing the same techniques and checking the same areas for a breach. This pattern can re…

721 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question