在选择更改时提交 Ajax 表单答案

【问题标题】：Submit Ajax form on select change在选择更改时提交 Ajax 表单
【发布时间】：2011-10-31 03:41:43
【问题描述】：

我需要提交有关选择更改的表格。我有表格。

<form id="form" name="form" method="post" action="modules/submit.php">
<select name='category' id='category' size='12' onChange='this.form.submit();'>
<option value='1'>One</option>
<option value='2'>Two</option>
<option value='3'>Three</option>
</select>
<select name='subcategory' id='subcategory' size='12'>
</select>
</form>

JS：

$(document).ready(function(){
    $('#form').submit(function() {
        select();
        e.preventDefault();
    });

});


function select()
{
    error(0);

    $.ajax({
        type: "POST",
        url: "modules/submit.php",
        data: $('#form').serialize(),
        dataType: "json",
        success: function(msg){
            if(parseInt(msg.status)==1)
            {
                window.location=msg.txt;
            }
            else if(parseInt(msg.status)==0)
            {
                result(1,msg.txt);
            }
        }
    });

}

function result(act,txt)
{
    if(txt) $('#subcategory').html(txt);
}

提交.php：

if(isset($_POST['category'])){
die(msg(0,"<option value='0'>Trololo</option>"));
}
function msg($status,$txt)
{
    return '{"status":'.$status.',"txt":"'.$txt.'"}';
}

当我更改选择表单被提交并重定向到 submit.php 文件时。我需要获得子类别选择的结果。

【问题讨论】：

标签： jquery ajax forms select

【解决方案1】：

试试这个：

$('#category').change(function() {

    $('#form').submit();

});

此外，您的代码将无法阻止表单提交的默认操作，因为您没有将 event 参数传递给函数。

$('#form').submit(function(e) { //Note the e!!
    e.preventDefault();
    select();
});

【讨论】：

我这样做了，但没有任何反应： ('#category'').change(function() { $('#form').submit(); $('#form').submit (function() { select(); e.preventDefault(); });

【解决方案2】：

您的表单将始终提交，因为您没有将 e 作为参数传递给提交处理程序：

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

另外，我会将msg 函数更改为：

function msg($status,$txt)
{
    return array('status' => $status, 'text' => $text);
}

和电话：

if(isset($_POST['category'])){
    die(json_encode(msg(0,"<option value='0'>Trololo</option>")));
}

【讨论】：

没有任何改变。仍然重定向到 submit.php。我猜 onChange='this.form.submit();' 有问题。附言如果表单是通过提交按钮提交的，那么它就完美了。