使用jQuery将查询字符串添加到URL

Question

大家好，我是新来的，我有一个带有表格的页面，可以搜索车辆并在表格中显示搜索结果，当我在搜索结果表中单击车辆时，我想使用jquery向网址中添加3个参数。 从表格中我需要startDate和and和EndDate，从结果表中我需要车辆许可证号。 谢谢大家，这是我的代码：

<script>
        $('table tbody tr').click(function () {
            var vehicleLicenseNumber = $(this).children('td').first().text();
            var startDate = $("#StartDate").val();
            var endDate = $("#EndDate").val();

            $.get('@Url.Action("OrderDetails","Guest")');
        });

    });
</script>


@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <div class="container">
        <div class="row">
            <p class="col-sm-2">
                @Html.LabelFor(s => s.Manufacturer)<br />
                @Html.DropDownListFor(s => s.Manufacturer, (IEnumerable<SelectListItem>)ViewBag.Manufacturers, "Select Manufacturer")
                @Html.ValidationMessageFor(s => s.Manufacturer)
            </p>
            <p class="col-sm-2">
                @Html.LabelFor(s => s.Model)<br />
                @Html.DropDownListFor(s => s.Model, (IEnumerable<SelectListItem>)ViewBag.Models, "Select Model")
                @Html.ValidationMessageFor(s => s.Model)
            </p>
            <p class="col-sm-2">
                @Html.LabelFor(s => s.Transmission)<br />
                @Html.DropDownListFor(s => s.Transmission, Enum.GetNames(typeof(Entities.Enums.TransmissionSearch)).Select(e => new SelectListItem { Text = e }), "Select Transmission")
                @Html.ValidationMessageFor(s => s.Transmission)
            </p>
            <p class="col-sm-2">
                @Html.LabelFor(s => s.StartDate)<br />
                @Html.TextBoxFor(s => s.StartDate, new { type = "date" })
                @Html.ValidationMessageFor(s => s.StartDate)
            </p>
            <p class="col-sm-2">
                @Html.LabelFor(s => s.EndDate)<br />
                @Html.TextBoxFor(s => s.EndDate, new { type = "date" })
                @Html.ValidationMessageFor(s => s.EndDate)
            </p>
            <p class="col-sm-2">
                <button class="btn btn-default btn-lg" type="submit">Search</button>
            </p>
        </div>
    </div>
}
<div>
    @if (ViewBag.list != null)
    {
            <table class="table table-hover">
                <thead>
                    <tr>
                        <th>LicenseNumber</th>
                        <th>Manufacturer</th>
                        <th>Model</th>
                        <th>DayCost</th>
                        <th>DelayDayCost</th>
                        <th>Transmission</th>
                        <th>Mileage</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach (var item in ViewBag.list)
                    {
                        <tr>
                            <td>@item.LicenseNumber</td>
                            <td>@item.VehicleTypeId.Manufacturer</td>
                            <td>@item.VehicleTypeId.Model</td>
                            <td>@item.VehicleTypeId.DayCost</td>
                            <td>@item.VehicleTypeId.DelayDayCost</td>
                            <td>@item.VehicleTypeId.Transmission</td>
                            <td>@item.Mileage</td>
                        </tr>
                    }
                </tbody>
            </table>
    }
    else
    {
        <span>No vehicle was found</span>
    }

</div>

Answer 1

根据$.get文档，您只需要一个数据对象。

var data={
    vehicleLicenseNumber : $(this).children('td').first().text(),
    startDate  : $("#StartDate").val(),
    endDate : $("#EndDate").val()
}

$.get('@Url.Action("OrderDetails","Guest")', data, function(serevrResponse){
  // do something with server response
});

jQuery将使用对象键作为查询参数名称在内部转换url