1

すべてのドロップダウン メニューがデータベースから読み込まれるこの JSP ページを作成しました。この機能は、私がテストしたところ正常に動作します。しかし、関数を追加して、最初のメニューから「タイプ」である特定のフィールドを選択したときにのみ、3 番目のドロップダウン メニュー (Forecast ISC) が表示されるようにする必要があります。助けが必要なこと！提案やコメントは役に立ちます！

  <form:form action="/analysis/analysisSummary" modelAttribute="shipData"
    method="POST" onChange = 'checkType()'>
    <br>
    <table width="100%">
        <tr>
            <td width="20%"></td>
            <td width="20%">Type:<form:select id="type" path="type">
            <form:option value="All">------ All ------   </form:option>
        <form:options items="${analysisEvents}" itemLabel="description"
                        itemValue="code" />
                </form:select>
            </td>


            <td width="20%">Forecast ISC:<form:select id="iscCode"
                    path="iscCode">
                    <form:option value="All">ALL</form:option>
                    <form:options items="${iscCodes}" />
                </form:select>
            </td>

            <td width="30%"><div style="visibility: hidden">
                    Actual ISC: <form:select id="sctry"
                    path="iscCode">
                    <form:option value="All">ALL</form:option>
                    <form:options items="${iscCodes}" />
                </form:select>
                </div>
            </td>

HTML:

       <form id="shipData" onChange="checkType()" action="/analysis/analysisSummary" method="POST">
    <br>
    <table width="100%">
        <tr>
            <td width="20%"></td>
            <td width="20%">Type:<select id="type" name="type">
                    <option value="All">------ All ------</option>
                    <option value="U">Unanalyzed</option><option value="H">Pending</option><option value="F">True Hit</option><option value="C">Return Reason</option><option value="S">Parcel Returned</option><option value="T">Long Term Pending</option><option value="Z">Value &gt;2500</option>
                </select>
            </td>


            <td width="20%">Forecast ISC:<select id="iscCode" name="iscCode">
                    <option value="All">ALL</option>
                    <option value="JFK">JFK</option><option value="LAX">LAX</option><option value="MIA">MIA</option><option value="ORD">ORD</option><option value="SFO">SFO</option>
                </select>
            </td>

            <td width="30%"><div style="visibility: hidden">
                    Actual ISC: <select id="sctry" name="iscCode">
                    <option value="All">ALL</option>
                    <option value="JFK">JFK</option><option value="LAX">LAX</option><option value="MIA">MIA</option><option value="ORD">ORD</option><option value="SFO">SFO</option>
                </select>
                </div>
            </td>
            <td width="8%"></td>
        </tr>
    </table>
    <br>
    <table width="100%">
        <tr>

            <td width="20%"></td>
4

1 に答える 1

1 
  $(document).ready(function () {
        $('#shipData').find('#type').change(function () {
            if ($(this).val() == 'T') {
                $('#shipData').find('#divIscCode').show();  //To  show only drop down
                //$('#shipData').find('#sctry').val('All'); //To initial value if required.
            } else {
                $('#shipData').find('#divIscCode').hide();
            }
        }).trigger('change');
    });

デモ用

于 2013-02-11T18:31:18.847 に答える