2011-02-25 55 views
1

以下模板正在按用戶進行輸入搜索。它只搜索按下輸入或按搜索按鈕。所以每次用戶進入搜索領域的搜索情況(不必等待用戶按Enter鍵或按搜索按鈕)如何向模板添加新的事件處理?

<script type="text/javascript"> 
Ext.onReady(function(){ 

{% autoescape off %} 
    var submitForm = function() { 
     Ext.query('#search_form form')[0].submit(); 
    }; 
    var searchButton = new Ext.Button({renderTo: 'submit_search', text: '{% trans "Search" %}', 
            handler: submitForm}); 
    var searchInput = new Ext.form.TextField({applyTo: 'search_query', width: 350}); 
{% endautoescape %} 

}); 

</script> 


{% endblock %} 

{% block nav %} 
{% navbar maps %} 
{% endblock %} 

{% block main %} 
<div class="twocol"> 

    <div id="search_form" class="block"> 
    <h2>{% trans "Search" %} <span class="subtitle">{% trans "for maps" %}</span></h2> 

    <form action="{% url maps_search %}" method="POST"> 
     {% csrf_token %} 
     <table> 
     <tr> 
      <td> 
      <input type="text" id="search_query" name="q" /> 
      </td> 
      <td> 
      <div id="submit_search"></div> 
      </td> 
     </tr> 
     </table> 
     <p> 
     <a href="{% url maps_search %}">{% trans "All Maps" %}</a> | 
     <a href="{% url maps_search %}?sort=last_modified&dir=DESC">{% trans "New Maps" %}</a> 
     </p> 
    </form> 
    </div> 

    <div id="create" class="block"> 
    <h2>{% trans "Create Maps" %}</h2> 
    <p>{% trans "Use GeoNode's Map Composer application to create your own maps. Add layers from this GeoNode or remote services, and style them." %} 
    </p> 
    <p> 
     <a href="{%url geonode.maps.views.newmap %}">{% trans "Create your own map" %}</a> 
    </p> 
    </div> 

    <!-- "Your Maps" button goes here --> 
    <!-- create map button goes here --> 

</div> 
{% endblock %}`enter code here` 

回答

0

ExtJS的TextField在一個字母(字符)我如何改變它初始化,您需要將配置選項enableKeyEvents設置爲true。字段初始化後,您需要將偵聽器附加到其keypress事件。例如,您可以使用addListener方法執行此操作。偵聽器的處理程序應該是執行搜索的函數。

Ext.form.TextField等的更多詳細信息可以從ExtJS API documentation找到。

相關問題