Question

我有以下代码

<form method="get">
<fieldset> <!-- Set class to "column-left" or "column-right" on fieldsets to divide the form into columns -->
    <label>Datum Filter</label>
    <p>
        Vanaf
        <br>
        <select class="date1small-input" type="text" name="fd" />
            <option value="1">1</option>
            <option value="31">31</option>                                      
        </select>

        <select class="date1small-input" type="text" name="fm" />
            <option value="1">1</option>
            <option value="12">12</option>
        </select>

        </select>
            <select class="date2small-input" type="text" name="fy" />
            <option value="2012">2012</option>
            <option value="2013">2013</option>
        </select>
    </p>
    <p>
        Tot en met
        <br>
        <select class="date1small-input" type="text" name="ud" />
            <option value="1">1</option>                
            <option value="31">31</option>                                      
        </select>

        <select class="date1small-input" type="text" name="um" />
            <option value="1">1</option>
            <option value="12">12</option>
        </select>

        </select>
            <select class="date2small-input" type="text" name="uy" />
            <option value="2012">2012</option>
            <option value="2013">2013</option>
        </select>
    </p>
    <p>
        <button class="button" type="submit">Filter</button>
    </p>
</fieldset> 
</form>

它工作正常但是当我点击“过滤器”按钮时，它会将这样的日期发送到浏览器：

URL?fd=1&fm=1&fy=2012&ud=1&um=1&uy=2012

我知道这是正常的，但是可以让它创建如下链接：

URL?fd=1/1/2012&ud=1/1/2012

Answer 1

使用纯HTML，这是不可能的。

您可以使用Javascript函数，该函数以所需格式提交表单数据。

另一种方法可能是在服务器端进行URL重写。

Answer 2

如果你在表单的onsubmit上放了一个简单的js函数，你可以组合你喜欢的任何url。例如（获取URL?fdate=1/1/2012&udate=1/1/2012）：

function set_date(e) {
    e.fdate.value = e.fd.value + "/" + e.fm.value + "/" + e.fy.value;
    e.udate.value = e.ud.value + "/" + e.um.value + "/" + e.uy.value;
    return true;
}

<form action='...' onsubmit='return set_date(this);'>

日期过滤器 - 合并数据

2 个答案: