javascript - 用 javascript/jquery 替换选择输入

Question

我有一个带有表单的页面，其中有 2 个选择，当您在第一个选择上选择值 X 时，它将更改第二个选择。
我尝试这样做:

<script language="JavaScript" type="text/JavaScript">
function makeRequestObject() {
    var xmlhttp = false;
    try {
        xmlhttp = new ActiveXObject('Msxml2.XMLHTTP');
    } catch (e) {
        try {
            xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
        } catch (E) {
            xmlhttp = false;
        }
    }
    if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
        xmlhttp = new XMLHttpRequest();
    }
    return xmlhttp;
}

function replace2(id) {
    var xmlhttp = makeRequestObject();
    var file = 'http://example.com/index.php/result/new_select/'
    xmlhttp.open('GET', file + id, true);
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            var content = xmlhttp.responseText;
            if (content) {
                document.getElementById('replace').innerHTML = content;
                //$( "div.test" ).replaceWith(content);
            }
        }
    }
    xmlhttp.send(null)
}
</script>

我的形式是这样的:

<th id="replace">
    <?php
    $fruit_options = array();
    $fruit_options[-1] = 'Select ALL';
    foreach ($tests as $fruit) {
        $fruit_options[$fruit->ID] = $fruit->Nume;
    }
    echo form_dropdown('test', $fruit_options, $fruit->ID, $fruit->Nume);
    ?>
</th>

一切正常，当我选择第一个下拉菜单时，第二个选择将被修改(我用以下方式调用它:echo form_dropdown('test1', $fruit_options, -1, 'onchange="replace2(this.value) )"');)

但是当我按“提交”时， Controller 将看不到 post test 的值。

在 result/new_select/id 中，我有这样的内容:

<?php
$fruit_options = array();
$fruit_options[-1] = 'Select ALL';
foreach ($tests as $fruit) {
    $fruit_options[$fruit->ID] = $fruit->Nume;
}
echo form_dropdown('test', $fruit_options, $fruit->ID, $fruit->Nume);
?>

有人知道为什么我的代码不起作用，或者更好的方法是什么？

LE

        <form action="http://example.com/index.php/test/query" method="post" accept-charset="utf-8">    
<table>                    
        <th>
            <select name="test1" onchange="replace2(this.value)">
                <option value="-1" selected="selected">Select ALL</option>
                <option value="515">515</option>
                <option value="252">252</option>
                <option value="327">327</option>
                <option value="409">409</option>
            </select>                        
        </th>
        <th id="replace">
            <select name="test" 315>
                <option value="-1">Select ALL</option>
                <option value="1">1</option>
                <option value="3">3</option>
                <option value="4">4</option>
                <option value="5">5</option>
                <option value="6">6</option>
                <option value="315" selected="selected">315</option>
            </select>                        
        </th>
        <th>
            <input type="submit" name="mysubmit" value="Search!"  />                            
        </th>
</table>
    </form>  

在 Controller 中，我看到 test1 的值，但看不到 test 的值。

Answer 1

这里的问题似乎是你的表结构。您忘记了表需要行 <tr>和列<td> ，因此当 JS 附加任何 HTML 时，它将它们放置在 form 之外因此您的表单请求未发送正确的 POST 信息。

像这样重构你的表:

<form method="post">
    <table>
        <tr>
            <td>
                <?php
                $fruit_options = array();
                $fruit_options[-1] = 'Select ALL';
                foreach ($tests as $fruit) {
                    $fruit_options[$fruit->ID] = $fruit->Nume;
                }
                echo form_dropdown('test1', $fruit_options, -1, 'onchange="replace2(this.value)"');
                ?>
            </td>
        </tr>
        <tr>
            <td id="replace">
            </td>
        </tr>
        <tr>
            <td>
                <input type="submit"/>
            </td>
        </tr>
    </table>
</form>