javascript - 使用 Javascript 或 Jquery 将参数传递给 url

Question

我的 Django 代码为

views.py

def compare(request):
    import ipdb;ipdb.set_trace()
    ids = request.GET.getlist('ids', '')
    products = []
    product_matrix = []
    for uuid in ids:
        try:
            product = LoanProduct.objects.get(uuid=uuid)
            products.append(product)
        except LoanProduct.DoesNotExist:
            pass
    if products:
        product_matrix = make_product_matrix(products)


    print product_matrix
    return TemplateResponse(request, "products/compare.html", {'product_matrix': product_matrix})

page1.html

<div class="row">
    <div class="col-md-4 col-lg-3 col-sm-6">
      <form action="" method="post">{% csrf_token %}
        {{ form.as_p }}
        <button type="submit" class="btn btn-primary">Search</button>
      </form>
    </div>
    <form action="/products/compare/" method="get">
    <div class="col-md-8 col-lg-9 col-sm-6">
      {% if products %}
      <table class="table table-hover">
          <thead>
              <tr>
                  <th> Check to Compare </th>
                  <th> Product Name</th>
                  <th> Quantum of finance </th>
                  <th> Interest Rate </th>
                  <th> Nature of Security</th>
                  <th> Margin </th>
              </tr>
          </thead>
          <tbody>
            {% for product in products %}
            <tr data-uuid="{{ product.uuid }}" id="uuid">
                  <th><input type="checkbox" name="ids" id="checkbox" value= {{ product.uuid }} /></th>
                  <td>{{ product.name }}</td>
                  <td>{{ product.get_finance_quantum }}</td>
                  <td>{{ product.get_interest_rate }}</td>
                  <td>{{ product.security }}</td>
                  <td>{{ product.get_margin }}</td>
              </tr>
            {% endfor %}
          </tbody>
      </table>
      {% endif %}
    </div>
    <button type="submit" id="compare" class="btn pull-right btn-success"> Compare </button>
</form>
</div>

我的一个复选框有唯一的 uuid。通过使用它，我可以使用 Django View 获取与该 UUID 相关的项目。通过此，我的 url 将是 https://localhost:8000/page1?ids=asdf-a972j-aswer&ids=asdf6-asdfewq-asdfwq-dfasfd&ids =asdf0-asdfasdf-asdf

但我需要这样的URL https://localhost:8000/page1?ids=sdf-asdf23-as2q3r,sdfqwe-232sasdf-23rwdefr,wqerqr-3qwq2r-23rq23r

如何使用 JavaScript 来做到这一点？

感谢您的回答

Answer 1

我尝试了一下，成功了。

工作代码:

$(document).ready(function() {
    $('#compare').click(function() {
        var uuids = '';
        var length = $("input[type='checkbox']:checked").length;
        console.log(length);
        $("input[type='checkbox']:checked").each(function(index){
            uuids = uuids + $(this).val();
            if (index < length-1) {
                uuids = uuids + ',';
            }
        });
        url = '/products/compare/?ids=' + uuids;
        window.location.replace(url);
    });
});

最后，这给了我带有 uuid 并用逗号分隔的 url

https://localhost:8000/page1?ids=sdf-asdf23-as2q3r,sdfqwe-232sasdf-23rwdefr,wqerqr-3qwq2r-23rq23r