title: show dropdownlist items by Image click event?
body: <p>I have one Image and Dropdownlist controls in my page. I am trying to show the dropdownlist items  by click event of the image control.</p>
  
  <p>Is this possible to in JQuery? or give me an alternate way to do this?</p>
  
  <p>this is my HTML </p>
  
  <pre><code>@Html.DropDownListFor(model =&gt; model.Subjects.Name, (IEnumerable&lt;SelectListItem&gt;)ViewBag.Subject, "--")
  @Html.TextBoxFor(model =&gt; model.Subjects.Name, new { @data_otf_autocomplete = @Url.Action("Autocomplete_Subject"), @class = "Text_Subject_Name" }) &lt;img src="~/Images/arrow-down.gif" alt="click to choose Subjects" id="arrow" /&gt;
  </code></pre>
  
  <p>by clicking on <code>Image[id='arrow']</code> should open the <code>dropdownlist[id=Subject_Name"]</code> items ?</p>
  
  <p>I got a same example @ <a href="http://jsfiddle.net/an3ZT/" rel="nofollow">http://jsfiddle.net/an3ZT/</a> based on this example i created below code was not working?</p>
  
  <pre><code>&lt;script src="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"&gt;&lt;/script&gt;
  &lt;script src="http://code.jquery.com/jquery-1.9.1.js"&gt;&lt;/script&gt;
  &lt;script src="http://code.jquery.com/jquery-1.10.2.min.js"&gt;&lt;/script&gt;
  &lt;script src="Scripts/jquery.simulate.js"&gt;&lt;/script&gt;    
  
  
  &lt;script type="text/ecmascript"&gt;
      $(document).ready(function () {
  
          $("img").click(function () {
              //alert("Hellow world");
              //alert($("select").val());
              $("select").simulate('mousedown');
  
          });
  
      });
  &lt;/script&gt;
  
   &lt;select&gt;
      &lt;option&gt;1&lt;/option&gt;
       &lt;option&gt;2&lt;/option&gt;
       &lt;option&gt;3&lt;/option&gt;
       &lt;option&gt;4&lt;/option&gt;    
  &lt;/select&gt;
  
  &lt;img src="https://www.google.com/images/srpr/logo11w.png"/&gt;
  </code></pre>
  
  <p>Please let me know where i did mistake?</p>