使用Javascript或Jquery将参数传递到url

Passing parameters to url using Javascript or Jquery

本文关键字:参数传递 url Jquery Javascript 使用      更新时间:2024-01-29

我有作为的Django代码

视图.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视图获得与该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实现这一点?

感谢

的回答

我试过了,并成功了。

工作代码:

$(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