如何更改程序-->从"Submit Button" 到"onchange javascript seleced" 下拉列表？

Question

我正在 JSP 创建一个页面，其中有一个三个相关的下拉列表一旦用户 select 从第一个下拉列表中调用一个值 "prefecture" 然后他必须点击 'next' 按钮然后相关值被发送到名为 "line" 的第二个下拉列表，然后他必须再次单击 'next' 按钮，然后发送相关值到名为 "station" 的第三个下拉列表，最后单击保存按钮然后相关公司列表将出现在最近的 selected 车站。我的编码在下面：

<body style="overflow: hidden;padding:5px;border-radius:5px;border:1px solid #777">
    <div>
        <div>
        <span id="wishtxt" style="color:#dd0000;font-size: 150%;display:none"></span>
        <form action="<?php echo REQUEST_PATH?>" id="form_eki">
    <?php if($h->is_action('index'))://------------------------------------------------------------------------------------------------------------------------?>
        <input type="hidden" name="wish">


        <div>
            <div style="margin-top: 3px;">
            <select name="pref" tabindex="6" style="width: auto;">
            <option value="">-- select prefecture name --</option>
            <?php $h->pr_ops_pref($h->get_target_pref())?>
            </select>
            <button name="action" value="line" type="submit" tabindex="7">Next</button>
        </div>

    <?php elseif($h->is_action('line'))://------------------------------------------------------------------------------------------------------------------------?>
            <input type="hidden" name="wish">
            <input type="hidden" name="pref">

            <div>
                 <div style="margin-top: 3px;">
                <select name="pref" tabindex="6" style="width: auto;">
                <option value="">-- select prefecture name --</option>
                <?php $h->pr_ops_pref($h->get_target_pref())?>
                </select>
                <button name="action" value="line" type="submit" tabindex="7">Change</button>
                </div>
            </div>

        <?php if($h->d('list_station')):?>


            <div style="margin-top: 3px;">
                <select name="line" tabindex="8" style="width: auto;max-width: 350px;">
                    <?php $h->pr_ops_db($h->d('list_line'),'line_cd',"line_name") ?>
                </select>
                <span>
                    <button name="action" val2ue="line" type="submit" tabindex="9">Change</button>
                </span>
            </div>

            <?php
                $imax = count($h->d('list_station'));
            ?>
            <div style="margin-top: 5px;">
                <select id="station_cd" name="station_cd" style="width: auto;max-width: 350px;">
                <option value="" selected>-- Select the nearest station--</option>
                <?php for ($i=0;$i<$imax;$i++):?>
                <option value="<?php $h->pr_d("list_station/$i/station_cd");?>"><?php $h->pr_d("list_station/$i/station_name")?></option>
                <?php endfor;?>
                </select>
            </div>
            <div style="margin-top: 5px;">
                <button type="submit" name="action" value="clear" tabindex="4">back</button>　
                <button id="btn_eki" type="button" tabindex="4" style="color:red">save</button>
            </div>

        <?php elseif($h->d('list_line')):?>
            <h3 style="margin-top: 5px;">Select a railway line</h3>
            <?php
                $company_name = '';
                $imax = count($h->d('list_line'));
            ?>
            <div style="margin-top: 3px;">
            <select name="line" style="width: auto;max-width: 250px;">
                <optgroup label="">
                    <option value="" selected>-- Select nearest railway line --</option>
            <?php for ($i = 0; $i<$imax; $i++):?>
            <?php if($h->d("list_line/$i/company_name") != $company_name):?>
                <?php $company_name = $h->d("list_line/$i/company_name");?>
                </optgroup>
                <optgroup label="<?php echo $company_name;?>">
            <?php endif;?>
                    <option value="<?php $h->pr_d("list_line/$i/line_cd")?>"><?php $h->pr_d("list_line/$i/line_name")?></option>
            <?php endfor;?>
                </optgroup>
            </select>
            </div>
            <div style="margin-top: 3px;">
                <button type="submit" name="action" value="clear" tabindex="4">back</button>　
                <button type="submit" name="action" value="line">Next</button>
            </div>
        <?php endif;?>
    <?php endif;//------------------------------------------------------------------------------------------------------------------------?>
        </form>
        </div>
    </div>
</body>

但是现在我只想让它只有三个下拉列表和“onChange select" 并且 "Next" "Back" 或 "Save" 将没有按钮。当 i select "Prefecture" 来自第一个下拉列表，automitacaly 将更新为 "Line" 第二个下拉列表，当我 select 第二个下拉列表然后 automitacaly 将更新为 "Station" 第三下拉列表，最后自动保存在后端和相关公司列表将从 select 最近的车站显示。

Thanks for your information.I have changed in following way but when i select "prefecture" from first dropdown list then the second dropdown list called "line" will not appear... Can anybody help me to sort it out?

my javascript:

$(document).ready(function(){
    $('#pref_cd').on('change',function(){
        $('#line_cd').val('');
        $('#station_cd').val('');
        $('#form_eki').submit();
        return true;
    });
    $('#line_cd').on('change',function(){
        $('#station_cd').val('');
        $('#form_eki').submit();
        return true;
    });
    $('#btn_eki').click(function(){
        var $option = $('#station_cd option:selected');
        var station_cd = $option.val();
        window.parent.add_tag(station_cd, "", $('#wishtxt').html(),1);
        window.parent.$('#nearStForm' + $('input[name="wish"]').val()).slideUp();
    });
    $('.close').click(function() {
        window.parent.$('#nearStForm' + $('input[name="wish"]').val()).slideUp();
    });
    $('#btn_clear').click(function(){

    });
    $('#wishtxt').html($('#form_eki [name="wish"]').val());
});

and i have deleted all buttons & changes programs are in First dropdownlist:

<select name="pref" id="pref" onChange="this.form.submit()" tabindex="6" style="width: auto;">
    <option value="">-- select prefecture name --</option>
    <?php $h->pr_ops_pref($h->get_target_pref())?>
</select>

in Second dropdownlist:

<select name="line" id="line" onChange="this.form.submit()" tabindex="8" style="width: auto;max-width: 350px;">
    <?php $h->pr_ops_db($h->d('list_line'),'line_cd',"line_name") ?>
</select>

in third dropdownlist:

<select id="station_cd" onChange="this.form.submit()" name="station_cd" style="width: auto;max-width: 350px;">
    <option value="" selected>-- Select the nearest station--</option>
    <?php for ($i=0;$i<$imax;$i++):?>
        <option value="<?php $h->pr_d("list_station/$i/station_cd");?>"><?php $h->pr_d("list_station/$i/station_name")?></option>
    <?php endfor;?>
</select>

Answer 1

在更改 "prefecture" 时调用 javascript 函数，其中调用 ajax functionality.In 此 ajax 调用执行与您在内部执行的操作相同的操作表单提交（）。在 ajax 调用成功后填充第二个下拉列表并对第二个下拉列表执行相同的操作。

如何更改程序-->从"Submit Button" 到"onchange javascript seleced" 下拉列表？

How to change the program-->From "Submit Button" to "onchange javascript seleced" dropdown list?

javascript

php

select

onchange

drop-down-menu