2

我在一个带有两个输入的页面上有一个表单。提交时,我希望将页面重定向到包含两个输入值的链接以及前面的字符串。html如下:

<form name="searchForm">
    <label for="property_type">Property Type</label>
    <select name="property_type" id="property_type_number">
        <option value>- All Property Types -</option>
        <option value="1432">Commercial</option>
        <option value="1433">Land</option>
        <option value="1434">MultiFamily</option>
        <option value="1435">Rental</option>
        <option value="1436">Residential</option>
        <option value="1988">Residential / Condo</option>
        <option value="1987">Residential / Single Family</option>
    </select>

    <label for="city">City</label>
    <select name="city" id="city_number">
        <option value>- All Property Types -</option>
        <option value>--</option>
        <option value="cambridge">Cambridge</option>
        <option value="zanesville">Zanesville</option>
    </select>

    <input type="submit" value="Search for Properties" onclick="searchform()">
</form>

Javascript如下:

function searchform() 
{
    var propertyType = document.getElementById("property_type_number").value;
    var city = document.getElementById("city_number").value;

    target = "/idx/?" + city + propertyType + "hi";

    document.searchForm.action = target;
}

当我提交表单时,它似乎只使用了目标变量的第一个字符串(“/idx/?”),而忽略了其余的。然后它会自动插入表单中的值。我希望它转到一个自定义目标,例如上面的目标。

如果你想在网上看到它,地址是: http: //lainegabriel.net/(它是左边的最后一个小部件)。

4

2 回答 2

0

改变这个:

var propertyType = document.getElementById("property_type_number").value;
var city = document.getElementById("city_number").value;

有了这个:

var select = document.getElementById("property_type_number");
var propertyType = select.options[ select.selectedIndex ].value;
select = document.getElementById("city_number");
var city= select.options[ select.selectedIndex ].value;

有什么区别吗?
我知道它的代码更大,但我从来没有遇到过问题(在我切换到jquery并忘记所有这些问题之前......)

于 2013-05-08T21:04:26.153 回答
0

好吧,我无法解释为什么表单会这样,或者为什么它不起作用,因为看起来网上的每一点信息都说完全按照你正在做的事情......但是我可以提供一份工作-大约:

首先,将您的 html 更改为此,从提交按钮中删除“onclick”,并替换表单标签:

<form name="searchForm" onsubmit="return searchform();">

其次,在您的searchform()功能中:

function searchform() {
    var propertyType = document.getElementById("property_type_number").value;
    var city = document.getElementById("city_number").value;


    target = "/idx/?" + city + propertyType + "hi";

    document.searchForm.action = target; // I just left this in here just in case you wanted it.
    window.location.href = target; // redirect the window to the new url/action
    return false; // prevent the default submit action from occurring
}

演示

于 2013-05-08T21:06:07.447 回答