如何更改已提交表单的查询字符串

时间:2019-01-24 12:30:54

标签: asp.net-mvc-5

我有一个包含许多下拉列表的表单,并且我希望在提交表单时排除没有选择的表单出现在查询字符串中。 因此,我可以使用某些模块或过滤器来更改此行为。

例如: 当我搜索测试时,URL将是 / someaction?q = test&select1 =&select2 = 所需的网址是: / someaction?q = test

<form action="/search" action="Get">
        <label>Search term <input name="q"></label>

<select id="select1" name="select1">
<option value="1">option 1</option>
</select>

<select id="select2" name="select2">
<option value="1">option 1</option>
</select>


        <input type="submit">
    </form>

1 个答案:

答案 0 :(得分:1)

由于您使用GET方法进行表单操作,因此可以使用带有正则表达式的replace()函数来处理Submit事件以防止正常提交并去除空值,然后使用location.href重定向到目标URL :

$('form').submit(function (e) {
    e.preventDefault(); 

    var queryString = $(this).serialize().replace(/&?[\w\-\d_]+=&|&?[\w\-\d_]+=$/gi, "");
    url = this.getAttribute('action') + (queryString.length > 0 ? "?" + queryString : "");

    // returns URL /search?q=something when both select elements are empty 
    location.href = url;
});

或者使用selectattr()禁用不带值的prop()元素,以防止它们在查询字符串中使用,使用正常形式的commit事件:

$('form').submit(function () {
    $('select').each(function () {
        if ($(this).val() == '') {
            $(this).prop('disabled', 'disabled'); // or prop('disabled', true)
    });
});