0

このjspページがあります。ラジオボタンをクリックすると、1つのサブセクションが非表示になり、選択リストのオプションが変更されます。

<center>
  <span class="ReportSubsectionTitle">Report Type</span>
                                    <br />
 <html:radio  styleId="detail" property="reportOutputStyleID" onclick="doSummary();" value="1" />Pending Funding
                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 <html:radio  styleId="summary" property="reportOutputStyleID" onclick="doDetail();" value="2" />Previously Funded
 </center>
 <script>
 function doDetail(){   
    document.getElementById("narrowByDateRangeTop").checked = false;        
    document.getElementById("narrowByDateRangeBottom").checked = false;
    document.getElementById("narrowByDateRangeTop").disabled = true;    
    document.getElementById("narrowByDateRangeBottom").disabled = true;
    document.getElementById("dateRangeTypeID").disabled = true;
    document.getElementById("dateRangeLabel").disabled = true;
    document.getElementById("startDateStr").disabled = true;
    document.getElementById("startDateLabel").disabled = true;
    document.getElementById("startDateCalendarTrigger").disabled = true;
    document.getElementById("endDateStr").disabled = true;
    document.getElementById("endDateLabel").disabled = true;
    document.getElementById("endDateCalendarTrigger").disabled = true;
    document.getElementById("startDateTime").disabled = true;
    document.getElementById("endDateTime").disabled = true;

    document.getElementById("narrowByDateRangeTop").style.visibility = "hidden";    
    document.getElementById("narrowByDateRangeBottom").style.visibility = "hidden";
    document.getElementById("dateRangeTypeID").style.visibility = "hidden";
    document.getElementById("dateRangeLabel").style.visibility = "hidden";
    document.getElementById("startDateStr").style.visibility = "hidden";
    document.getElementById("startDateLabel").style.visibility = "hidden";
    document.getElementById("startDateCalendarTrigger").style.visibility = "hidden";
    document.getElementById("endDateStr").style.visibility = "hidden";
    document.getElementById("endDateLabel").style.visibility = "hidden";
    document.getElementById("endDateCalendarTrigger").style.visibility = "hidden";
    document.getElementById("startDateTime").style.visibility = "hidden";
    document.getElementById("endDateTime").style.visibility = "hidden";

    document.getElementById("DateSelection").style.visibility = "hidden";

 }
 function doSummary(){  

    document.getElementById("narrowByDateRangeTop").checked = true;     
    document.getElementById("narrowByDateRangeBottom").checked = false;
    document.getElementById("narrowByDateRangeTop").disabled = false;   
    document.getElementById("narrowByDateRangeBottom").disabled = false;
    document.getElementById("dateRangeTypeID").disabled = false;
    document.getElementById("dateRangeLabel").disabled = false;
    document.getElementById("startDateStr").disabled = false;
    document.getElementById("startDateLabel").disabled = false;
    document.getElementById("startDateCalendarTrigger").disabled = false;
    document.getElementById("endDateStr").disabled = false;
    document.getElementById("endDateLabel").disabled = false;
    document.getElementById("endDateCalendarTrigger").disabled = false;
    document.getElementById("startDateTime").disabled = false;
    document.getElementById("endDateTime").disabled = false;

    document.getElementById("narrowByDateRangeTop").style.visibility = "visible";   
    document.getElementById("narrowByDateRangeBottom").style.visibility = "visible";
    document.getElementById("dateRangeTypeID").style.visibility = "visible";
    document.getElementById("dateRangeLabel").style.visibility = "visible";
    document.getElementById("startDateStr").style.visibility = "visible";
    document.getElementById("startDateLabel").style.visibility = "visible";
    document.getElementById("startDateCalendarTrigger").style.visibility = "visible";
    document.getElementById("endDateStr").style.visibility = "visible";
    document.getElementById("endDateLabel").style.visibility = "visible";
    document.getElementById("endDateCalendarTrigger").style.visibility = "visible";
    document.getElementById("startDateTime").style.visibility = "visible";
    document.getElementById("endDateTime").style.visibility = "visible";
    document.getElementById("DateSelection").style.visibility = "visible";

 }
 </script>

次に、「日付の選択」というラベルの付いたこのサブセクションがあります。これを非表示にします。

 <tr>
    <td align="center" style="padding-bottom: 5px;">
        <span id = "DateSelection" class="ReportSubsectionTitle">Date Selection</span>
    </td>
    <td align="center" style="padding-bottom: 5px;">
        <span class="ReportSubsectionTitle">Save Generated Report?</span>
    </td>
</tr>
<tr>
    <td valign="top" nowrap="nowrap">
        <%@ include file="dateSelectionSection1.jsp" %>
    </td>
    <td valign="top" nowrap="nowrap" style="padding-left: 10px;">
        <%@ include file="savedReportNameField.jsp" %>
    </td>
</tr>

そして、私は選択リストを持っています

  <span style="padding-left: 5px;">
                                    Date Type:
                                    <html:select property="dateTypeID">
                                        <html:options collection="dateTypes" property="id" labelProperty="name"/>
                                    </html:select>
                                </span>

選択にidを追加しようとしましたが、タグが見つからないというエラーが表示されます。ドロップダウンの下の選択を変更して、選択をロックしたい。

document.getElementById（ "dateTypeID"）。options [0] .selected = 1を試しましたが、その後は何も変わりません。

私はJSPを初めて使用しますが、これをどのように処理するかについてはよくわかりません。

4

1 に答える 1

2

これがあなたの選択したステートメントだと言ってください：

<select name="master" size="1">
  <option value="newsvalue">News</option>
  <option value="webmastervalue">Webmaster</option>
  <option value="techvalue">Tech</option>
</select>

ユーザーがラジオボタンをチェックした後に呼び出されるjavascript関数では、最初に次のようにselectListからすべてのオプションを削除します。

document.myform.master.options.length=0;

次に、次のようにしてselectListを再入力します。

document.myform.master.options[0]=new Option("Sports", "sportsvalue", true, false);  
document.myform.master.options[1]=new Option("Music", "musicvalue", false, false);
document.myform.master.options[2]=new Option("Movies", "moviesvalue", false, false);

「newOption（）」関数のデータ型は次のとおりです。

new Option(text, value, defaultSelected, selected);

したがって、これは、JSPではHTMLページの場合とは異なる方法で処理されません。これがお役に立てば幸いです:-)

于 2012-06-02T08:00:03.867 に答える