Jquery Id Is Matched But Won't Work At All

- 1 answer

I have python/django app, need search engine and for search engine I'm using the power of jquery. I'm still very new to Jquery(actually whole Javascript) but I think this seems right to, I'm not sure why this won't work.

so I have this code:

 <li class="nav-header">search for community</li>
      {% csrf_token %}
      <input type="text" id="search" name="search" />

      <ul id="search-results">


I have input id search. and another id search-results. then I have this javascript file.


    $('#search').keyup(function() {

            type: "POST",
            url: "/search/",
            data: { 
                'search_text' : $('#search').val(),
                'csrfmiddlewaretoken' : $("input[name=csrfmiddlewaretoken]").val()
            success: searchSuccess,
            dataType: 'html'



function searchSuccess(data, textStatus, jqXHR)

I'm matching id search here. using keyup function. Is it because the function is wrong?It's very unlikely because the whole thing works fine. by whole thing , I mean the functionality of searching works here which has search.html

{% extends 'base.html' %}

{% block content %}

    <form method="get" action=".">
            {{ form.as_table }}
                    <input type="submit" value="Search">

        {% if query %}

            {% for result in page.object_list %}
                    <a target="_blank" rel="nofollow noreferrer" href="{{ result.object.get_absolute_url }}">{{ }}</a>
            {% empty %}
                <p>No results found.</p>
            {% endfor %}

            {% if page.has_previous or page.has_next %}
                    {% if page.has_previous %}<a target="_blank" rel="nofollow noreferrer" href="?q={{ query }}&amp;page={{ page.previous_page_number }}">{% endif %}&laquo; Previous{% if page.has_previous %}</a>{% endif %}
                    {% if page.has_next %}<a target="_blank" rel="nofollow noreferrer" href="?q={{ query }}&amp;page={{ page.next_page_number }}">{% endif %}Next &raquo;{% if page.has_next %}</a>{% endif %}
            {% endif %}
        {% else %}
            {# Show some example queries to run, maybe query syntax, something else? #}
        {% endif %}


I'm trying to use what works in search.html to work in a search bar in index.html and with Jquery keyup function. can you please tell why I can't use jquery function that has matched id?

For detail: this is how my code works Inside I have url(r'^search/$',include('haystack.urls')), and other haystack settings. then inside

def search_titles(request):
    categories = SearchQuerySet().autocomplete(content_auto=request.POST.get('search_text', ''))            

    return render_to_response('ajax_search.html', {'categories' : categories

for ajax_search.html

{% if categories.count > 0 %}

{% for category in categories %}
    <li><a target="_blank" rel="nofollow noreferrer" href="/category/{{post.category}}">{{ category.title }}</a></li>
{% endfor %}

{% else %}

<li>None to show!</li>

{% endif %}

The problem is occuring from ajax I'm almost sure



If you're just practicing AJAX, your approach is ok, but jQuery has a neat method to do this..

    $('#search').keyup(function() {
            $('#search-results').load("/search/", { 
                'search_text' : $('#search').val(),
                'csrfmiddlewaretoken' : $("input[name=csrfmiddlewaretoken]").val()