title: Display datepicker instead of list in JQueryUI's autocomplete's pop-widget
body: <p>For the search functionality of my webapp, instead of multiple input fields I'm giving my users a single field to enter their query, and they can use special syntax to make their queries more specific. To ease the process of writing these queries, I'm using the <a href="http://jqueryui.com/autocomplete" rel="nofollow">JQueryUI's autocomplete widget</a>. As the user type, I'm parsing their query, determine the context of what they are currently typing, and give them relevnat autocomplete. For example - if the user is using the syntax for filtering by client, I give them a list of all the clients(filtered by the partial client name they have already written ofcourse).</p>
  
  <p>That part I implemented and it works great. Now, some of the fields I'm filtering by are date fields. There is sense in giving a suggestion list for these, but I do want to allow my users to enter those dates using <a href="http://jqueryui.com/datepicker" rel="nofollow">JQueryUI's datepicker widget</a>. I've considered using <a href="http://api.jqueryui.com/autocomplete/#method-_renderMenu" rel="nofollow">_renderMenu</a>, but as far as I understand I need to use widget factory for this(which seems like a overkill), and I can't tell how to call the normal behavior for regular list completions if I override <code>_renderMenu</code>.</p>
  
  <p>I've managed to work out a hacky solution - open the pop-widget with a blank array and use the <a href="http://api.jqueryui.com/autocomplete/#event-open" rel="nofollow"><code>open</code> event</a> to add the datepicker. This works, but I have to pass the instruction to create a datepicker instead of using the regular widget via <a href="http://api.jquery.com/category/miscellaneous/data-storage/" rel="nofollow">JQuery's in-DOM data storage</a>, which just feels hacky...</p>
  
  <p>Is there any proper way to do what I want?</p>
  
  <p><strong>UPDATE(a bit off-topic)</strong><br>
  Zee Tee wanted to know in the comments how exactly I determine when to regular autocomplete list and when to open datepicker, since I'm using a single field for both. Well, the text in a field is actually a query, which I parse on client-side and therefore have full access to it's abstract sytnax tree in my JavaScript code. I made the syntax very relaxed, so I can parse half-queries and still get valid ASTs. When I do an autocomplete, I take the part of the query <strong>before</strong> the caret and parse it. Then I down-right in the syntax tree until I find something I can autocomplete.</p>
  
  <p>For example - lets say I have a query <code>client=jack date&lt;</code>, and the caret is at the end. I parse it to something like:</p>
  
  <pre><code>and:
    - equals:
      - field: client
      - text: jack
    - less-than:
      - field: date
      - text:
  </code></pre>
  
  <p>I can't provide autocompletion for <code>and</code>, so I have to go down-right in the AST, to <code>less-than</code>. This is a pattern that I recognize as datepicker pattern, so I display a datepicker. If the caret was at the middle of the word "jack", I would get this AST:</p>
  
  <pre><code>- equals:
    - field: client
    - text: ja
  </code></pre>
  
  <p>Which I would recognize as a pattern for displaying the list of clients, filtered by "ja".</p>
  
  <p>So - determining <strong>what</strong> to display is easy - the problem is <strong>how</strong>.</p>