title: refresh Captcha image which is a response from a servlet
body: <p>I am using a servlet to generate the captcha image. My code works fine with google chrome but captcha is not reloading in FF/ IE.</p>
  
  <p>The code is</p>
  
  <p>public class CaptchaServlet extends HttpServlet {</p>
  
  <pre><code> protected void processRequest(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {
  
  
  response.setContentType("image/jpg");
  int iTotalChars = 6;
  int iHeight = 40;
  int iWidth = 150;
  Font fntStyle1 = new Font("Arial", Font.BOLD, 30);
  //Font fntStyle2 = new Font("Verdana", Font.BOLD, 20);
  Random randChars = new Random();
  String sImageCode = (Long.toString(Math.abs(randChars.nextLong()), 36)).substring(0, iTotalChars);
  BufferedImage biImage = new BufferedImage(iWidth, iHeight, BufferedImage.TYPE_INT_RGB);
  Graphics2D g2dImage = (Graphics2D) biImage.getGraphics();
  int iCircle = 15;
  for (int i = 0; i &lt; iCircle; i++) {
      g2dImage.setColor(new Color(randChars.nextInt(255), randChars.nextInt(255), randChars.nextInt(255)));
      int iRadius = (int) (Math.random() * iHeight / 2.0);
      int iX = (int) (Math.random() * iWidth - iRadius);
      int iY = (int) (Math.random() * iHeight - iRadius);
  }
  g2dImage.setFont(fntStyle1);
  for (int i = 0; i &lt; iTotalChars; i++) {
      g2dImage.setColor(new Color(randChars.nextInt(255), randChars.nextInt(255), randChars.nextInt(255)));
      if (i % 2 == 0) {
          g2dImage.drawString(sImageCode.substring(i, i + 1), 25 * i, 24);
      } else {
          g2dImage.drawString(sImageCode.substring(i, i + 1), 25 * i, 35);
      }
  }
  
  OutputStream osImage = response.getOutputStream();
  ImageIO.write(biImage, "jpeg", osImage);
  
  g2dImage.dispose();
  
  HttpSession session = request.getSession();
  session.setAttribute("dns_security_code", sImageCode);
  
  
  }
  
  protected void doGet(HttpServletRequest request, HttpServletResponse response)
          throws ServletException, IOException {
      processRequest(request, response);
  }
  
  
  }
  </code></pre>
  
  <p>web.xml code</p>
  
  <pre><code> &lt;servlet&gt;
      &lt;servlet-name&gt;CaptchaServlet&lt;/servlet-name&gt;
      &lt;servlet-class&gt;com.rush49.web.controllers.CaptchaServlet&lt;/servlet-class&gt;
  &lt;/servlet&gt;
  
  &lt;servlet-mapping&gt;
      &lt;servlet-name&gt;CaptchaServlet&lt;/servlet-name&gt;
      &lt;url-pattern&gt;/captcha-image.jpg&lt;/url-pattern&gt;
  &lt;/servlet-mapping&gt;
  </code></pre>
  
  <p>jsp code</p>
  
  <pre><code>&lt;div class="captcha" align="center"&gt;
   &lt;table&gt;
  
  &lt;tr&gt;
       &lt;td&gt;
    &lt;span&gt;&lt;img alt="" id="captchaImg" src="/captcha-image.jpg" width="150"/&gt;&lt;/span&gt;
         &lt;span&gt;&lt;a id="captchaRef"&gt;
     &lt;img id="refresh" src="../images/refresh.png" width="50" height="50"&gt;&lt;/img&gt;
         &lt;/a&gt;&lt;/span&gt;
      &lt;/td&gt;
  
  &lt;/tr&gt;
  &lt;tr&gt;
  &lt;td&gt;Enter the above code&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
   &lt;td&gt;&lt;input id="captchaText" name="captchaText" class="register_form_input_box" type="text" value=""/&gt;&lt;/td&gt;  
       &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>jquery to reload the captcha. It works fine in chrome but not FF/IE</p>
  
  <pre><code> $(document).ready(function() {
      $("#captchaRef").click(function() {
         document.getElementById('captchaImg').src="/captcha-image.jpg";
       });
   });
  </code></pre>
  
  <p>Please suggest a solution</p>