JavaScript实现表单的分向提交

在一般情况下,同一个表单只能被提交给同一个地址。但在实际web应用中,我们希望同一个表单可以根据用户的选择来完成不同的操作,即表单的分向提交

比如说:在一个网站后台用户管理系统中,我需要对一些恶意的用户进行批量解锁,锁定用户或者删除的操作,当我选择删除会员时,我们希望表单会提交给能进行删除的处理程序,当我选择锁定会员时,我们希望表单会提交到锁定会员的处理程序,解锁会员也如此。我们极不愿意看到分别为这三个功能建立三个不同的页面,而其中仅仅是处理程序不同。

利用客户端JavaScript的功能,我们可以把三项功能简化一个界面就可以完成,一个select下拉框,其中放置要进行的操作,一个Submit按钮进行表单提交。

form表单如下:

<form action="actionPath" method="post" enctype="application/x-www-form-urlencoded" name="listform" id="listform">
    <label>
        <select name="operate" size="1" id="operate">
            <option value="delete">删除</option>
            <option value="lock">锁定</option>
            <option value="unlock">解锁</option>
        </select>
    </label>
    <input name="Submit" id="Submit" type="submit" value="确定" onclick="submitForm(this.form,'actionPath')" />
</form>

提交表单的submitForm()函数:

<!-- 其中传递的参数为表单对象的引用和表单的action文件地址 ,提交后的action为[*Action?menthod=?]-->

function submitForm(formObj,actionPath){

    var select = document.getElementById("operate");
    var str = [];
    for(i=0;i<select.length;i++){
        if(select.options[i].selected){
            str.push(select[i].value);
        }
    }
    if(confirm("确定要执行的操作吗?")){
        for(var j = 0;j < str.length;j++){
            formObj.action=actionPath + "?method=str[j]";
            formObj.submit();
        }       
        return true;
    }
    return false;
}

注意:

1、document.form.action和document.form.submit()的区别,action是属性,submit()是方法;

2、在表单中,不应有名字为action或submit这些特殊字符的标签(JavaScript区分大小写),否则IE中将会产生”对象不支持此属性和方法”的错误。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值