Django搜索栏跳转带动态查询参数URL功能异常求助

现有代码的核心问题 #

• urls.py 中usearch_query路由缺少闭合括号，且未加路径末尾斜杠，不符合Django默认路由规范
• views.py 中usearch_query视图的render函数语法错误，末尾用了}代替)
• usearch.html 表单存在3个问题：action指向的usearch_query路由需要传参但未传、input未加name属性无法提交内容、标签未闭合
• 原生HTML表单GET提交默认会生成?参数=值的查询字符串格式，无法直接生成路径参数格式的URL

具体修改步骤 #

1. 修正urls.py语法与路由规则 #

urlpatterns = [
    path('', views.index, name='index'),
    path('register/', views.register, name='register'),
    path('usearch/', views.usearch, name='usearch'),
    # 补全括号，添加末尾斜杠
    path('usearch/<str:query>/', views.usearch_query, name='usearch_query'),
]

2. 修正views.py语法与逻辑 #

from django.shortcuts import render, redirect

def usearch(request):
    # 接收表单提交的搜索参数，重定向到路径参数格式的结果页
    if request.method == "GET" and "q" in request.GET:
        query = request.GET.get("q", "").strip()
        if query:
            return redirect("usearch_query", query=query)
    return render(request, 'myapp/usearch.html')

def usearch_query(request, query):
    context = {'query': query}
    print(query) # 测试搜索结果
    # 修正语法错误，补全render参数括号
    return render(request, 'myapp/usearch_query.html', context)

3. 修正usearch.html表单配置 #

<!-- action指向usearch路由，input添加name属性，补全标签闭合 -->
<form method="GET" action="{% url 'usearch' %}">
   <input type="search" name="q" placeholder="Search here..." required>
   <button type="submit"> Search </button>
</form>

4. usearch_query.html无需修改，可正常渲染{{ query }}参数 #

可选无重定向实现方案（前端JS处理） #

如果不需要后端重定向的中间过程，可以直接用JS拦截表单提交拼接路径：

<form id="searchForm">
   <input type="search" id="searchInput" placeholder="Search here..." required>
   <button type="submit"> Search </button>
</form>

<script>
document.getElementById('searchForm').addEventListener('submit', function(e) {
    e.preventDefault();
    const query = document.getElementById('searchInput').value.trim();
    if (query) {
        window.location.href = `/usearch/${encodeURIComponent(query)}/`;
    }
});
</script>

内容的提问来源于stack exchange，提问作者user16751857