title: Changing an Image When Selecting an Option in a Radio Button List
body: <p><strong><em>NOTE: THIS IS A RE-PURPOSED QUESTION, WHICH AIMS TO MORE CLEARLY STATE THE ISSUE AND INFORMATION</em></strong>.</p>
  
  <p>Ok... I am working on a project for a site of mine that has a form, and uses the RadioButtonList control for item categories. On one particular category, my radio list control has 4 vaules like so:</p>
  
  <pre><code>&lt;td&gt;
  &lt;asp:RadioButtonList ID="radCPUType" RepeatDirection="Horizontal" runat="server"&gt;
    &lt;asp:ListItem Value="AMD"&gt;AMD&lt;/asp:ListItem&gt;
    &lt;asp:ListItem Value="Intel"&gt;Intel&lt;/asp:ListItem&gt;
    &lt;asp:ListItem Value="AMD Dual (Server)"&gt;AMD Dual (Server)&lt;/asp:ListItem&gt;
    &lt;asp:ListItem Value="Intel Dual (Server)"&gt;Intel Dual (Server)&lt;/asp:ListItem&gt;
  &lt;/asp:RadioButtonList&gt;
  &lt;/td&gt;
  
  &lt;td&gt;
  &lt;asp:Image ID="Image6" runat="server" ImageUrl="~/Images/Icon_CPU.jpg" /&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>And next to the list control, I have a default image control named <code>Image6</code>. I'm having a great deal of difficulty getting this image to change when I select a radio button list option. The code doesn't blow up, but nothing happens and the image remains unchanged on a radio option selection. I've tried various methods from similar examples, and none of them have been helpful.</p>
  
  <p>I've tried JQuery for my script, and plain old JavaScript, all to no avail. I know I need to make the script reference the images I have in the Images directory of the solution, but I can't figure it out. The default image is <code>Icon_CPU.jpg</code> and for each choice, say... the 1st two, it will change to the following:</p>
  
  <ol>
  <li>AMD selection = <code>AMD_CPU_1.jpg</code></li>
  <li>Intel selection = <code>Intel_CPU_2.jpg</code></li>
  </ol>
  
  <p>... and so on. The images will align properly if hard coded - I just can't get the code to work on selection. Can some help me with the script to actually make this work? Also, can you tell me if I need to rename my controls, or add anything in the <code>PageLoad</code> of the server-side control? Currently, I have nothing in it as below will show.</p>
  
  <pre><code>public partial class Controls_CPUBuilderForm : System.Web.UI.UserControl
  {
      protected void Page_Load(object sender, EventArgs e)
      {
  
      }
      protected void btnResetBuild_Click(object sender, EventArgs e)
      {
          // Clear radio button selections on the form
  
          radFormSelect.ClearSelection();
          radDriveType.ClearSelection();
          radDriveSpace.ClearSelection();
          radPSUSelect.ClearSelection();
  
          radRAMSelect.ClearSelection();
          radCPUType.ClearSelection();
          radOpticalCount.ClearSelection();
          radScreenCount.ClearSelection();
  
          // Reset drop down lists to original selection
  
          ddlDriveCount.SelectedIndex = -1;
          ddlScreenOrient.SelectedIndex = -1;
      }
  }
  </code></pre>
  
  <p>Thank you all for your patience &amp; knowledge in helping me gain better understanding for future purposes!</p>