如何停止在 .jsp 中的第一个下拉列表中提交？

Question

我有一个名为 add.jsp 的文件，我使用 Java 将数据添加到数据库中。

在这个文件中，我从数据库中的第一个下拉列表中提取联赛，该联赛的球队显示在 selected 联赛的第二和第三下拉列表中。

表格开头如下

自从 onchange="this.form.submit();"位于第一个下拉列表部分，当 selection 生成时，表单提交并转到 addemp servlet。

当我从第一个下拉列表中 select 联盟时，如何阻止提交表单？以及如何在 select 输入所有数据并登录后单击底部提交按钮时才将其转到 addemp servlet？

我的代码在正文标签之间如下..

Screenshot is here

Without onchange event screenshot is here

<div class="row justify-content-center">
    <div class="col-sm-4">


        <form class="form-group" action="addemp" method="post">


            <label class="form-label" for="name">Choose a League </label> <select
                name="leagues" id="leagues" class="form-control mb-3"
                style="width: 200px;" onchange="this.form.submit();">
                <option value="0">Select League</option>
                <%
        Connection conn;
        Statement stm;
        ResultSet rs;

        try {
            Class.forName("com.mysql.cj.jdbc.Driver");
            conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/teams", "root", "Fener2013");
            String query = "select * from leagues";
            stm = conn.createStatement();
            rs = stm.executeQuery(query);
            while (rs.next()) {
        %>
                <option value="<%=rs.getInt("league_id")%>"
                    <%
            if(request.getParameter("leagues")!= null) 
            {
                if(rs.getInt("league_id")==Integer.parseInt(request.getParameter("leagues"))) 
                {
                    out.print("selected");
                }
            }
            %>><%=rs.getString("league_name")%></option>
                <%
            }
        } 
        catch (Exception ex) {
        ex.printStackTrace();
        }
            %>
            </select> <label class="form-label" for="name">Home Team</label> <select
                name="home_team" class="form-control mb-3" style="width: 200px;">
                <option value="0">Select Home Team</option>
                <%
        try {
            Class.forName("com.mysql.cj.jdbc.Driver");
            Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/teams", "root", "Fener2013");
            String query = "select * from teams where league_id=?";
            PreparedStatement psmt = con.prepareStatement(query);
            psmt.setString(1, request.getParameter("leagues"));
            ResultSet rset = psmt.executeQuery();
            while(rset.next()) 
            {
            %>
                <option value="<%=rset.getInt("team_id")%>">
                    <%=rset.getString("team_name")%></option>
                <%
            }
        } 
        catch (Exception ex) {
        ex.printStackTrace();
        }
            %>
            </select> <label class="form-label" for="name">Away Team</label> <select
                name="home_team" class="form-control mb-3" style="width: 200px;">
                <option value="0">Select Away Team</option>
                <%
        try {
            Class.forName("com.mysql.cj.jdbc.Driver");
            Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/teams", "root", "Fener2013");
            String query = "select * from teams where league_id=?";
            PreparedStatement psmt = con.prepareStatement(query);
            psmt.setString(1, request.getParameter("leagues"));
            ResultSet rset = psmt.executeQuery();
            while(rset.next()) 
            {
            %>
                <option value="<%=rset.getInt("team_id")%>">
                    <%=rset.getString("team_name")%></option>
                <%
            }
        } 
        catch (Exception ex) {
        ex.printStackTrace();
        }
            %>
            </select> <label class="form-label" for="name">Enter Match Date
                (YYYY-MM-DD)</label> <input name="match_date" type="text"
                class="form-control mb-3" style="width: 200px"> <label
                class="form-label" for="name">Home Score</label> <input
                name="home_score" type="text" class="form-control mb-3"
                style="width: 200px;"> <label class="form-label"
                for="name">Away Score</label> <input name="away_score" type="text"
                class="form-control mb-3" style="width: 200px;"> <label
                class="form-label" for="name">Home Team HT Score</label> <input
                name="home_ht_score" type="text" class="form-control mb-3"
                style="width: 200px;"> <label class="form-label"
                for="name">Away Team HT Score</label> <input name="away_ht_score"
                type="text" class="form-control mb-3" style="width: 200px;">

            <label class="form-label" for="name">Week</label> <input
                name="week" type="text" class="form-control mb-3"
                style="width: 200px;">

            <div class="d-md-flex justify-content-md-end">
                <button class="btn btn-primary mb-4" type="submit">Save
                    Match Result</button>
            </div>
        </form>
    </div>
</div>

此致，

Answer 1

首先我想知道为什么要在select上添加onChange？你想对 onchange 事件做些什么吗？如果我考虑当前给定的信息，那么只需从 select 中删除 onChange。提交按钮已经可以使用了。它的类型是提交它应该工作。

如果还是不行，请告诉我更多细节，我会尽力解决你的问题。

从这里更新：

您需要创建一个 javascript 函数并调用它 onChange of first select。此函数将重新加载当前页面 selected selection 在当前 url.

中的值

funtion onLeagueChange(){
  var leagueValue = document.getElementById("leagues").value;
  window.location.href = your_url + "?leagues="+leagueValue;
}

这是在不使用其他文件的情况下解决您的问题。

您更新的代码

<div class="row justify-content-center">
<div class="col-sm-4">


    <form class="form-group" action="addemp" method="post">


        <label class="form-label" for="name">Choose a League </label> <select
            name="leagues" id="leagues" class="form-control mb-3"
            style="width: 200px;" onchange="onLeagueChange()">
            <option value="0">Select League</option>
            <%
    Connection conn;
    Statement stm;
    ResultSet rs;

    try {
        Class.forName("com.mysql.cj.jdbc.Driver");
        conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/teams", "root", "Fener2013");
        String query = "select * from leagues";
        stm = conn.createStatement();
        rs = stm.executeQuery(query);
        while (rs.next()) {
    %>
            <option value="<%=rs.getInt("league_id")%>"
                <%
        if(request.getParameter("leagues")!= null) 
        {
            if(rs.getInt("league_id")==Integer.parseInt(request.getParameter("leagues"))) 
            {
                out.print("selected");
            }
        }
        %>><%=rs.getString("league_name")%></option>
            <%
        }
    } 
    catch (Exception ex) {
    ex.printStackTrace();
    }
        %>
        </select> <label class="form-label" for="name">Home Team</label> <select
            name="home_team" class="form-control mb-3" style="width: 200px;">
            <option value="0">Select Home Team</option>
            <%
    try {
        Class.forName("com.mysql.cj.jdbc.Driver");
        Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/teams", "root", "Fener2013");
        String query = "select * from teams where league_id=?";
        PreparedStatement psmt = con.prepareStatement(query);
        psmt.setString(1, request.getParameter("leagues"));
        ResultSet rset = psmt.executeQuery();
        while(rset.next()) 
        {
        %>
            <option value="<%=rset.getInt("team_id")%>">
                <%=rset.getString("team_name")%></option>
            <%
        }
    } 
    catch (Exception ex) {
    ex.printStackTrace();
    }
        %>
        </select> <label class="form-label" for="name">Away Team</label> <select
            name="home_team" class="form-control mb-3" style="width: 200px;">
            <option value="0">Select Away Team</option>
            <%
    try {
        Class.forName("com.mysql.cj.jdbc.Driver");
        Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/teams", "root", "Fener2013");
        String query = "select * from teams where league_id=?";
        PreparedStatement psmt = con.prepareStatement(query);
        psmt.setString(1, request.getParameter("leagues"));
        ResultSet rset = psmt.executeQuery();
        while(rset.next()) 
        {
        %>
            <option value="<%=rset.getInt("team_id")%>">
                <%=rset.getString("team_name")%></option>
            <%
        }
    } 
    catch (Exception ex) {
    ex.printStackTrace();
    }
        %>
        </select> <label class="form-label" for="name">Enter Match Date
            (YYYY-MM-DD)</label> <input name="match_date" type="text"
            class="form-control mb-3" style="width: 200px"> <label
            class="form-label" for="name">Home Score</label> <input
            name="home_score" type="text" class="form-control mb-3"
            style="width: 200px;"> <label class="form-label"
            for="name">Away Score</label> <input name="away_score" type="text"
            class="form-control mb-3" style="width: 200px;"> <label
            class="form-label" for="name">Home Team HT Score</label> <input
            name="home_ht_score" type="text" class="form-control mb-3"
            style="width: 200px;"> <label class="form-label"
            for="name">Away Team HT Score</label> <input name="away_ht_score"
            type="text" class="form-control mb-3" style="width: 200px;">

        <label class="form-label" for="name">Week</label> <input
            name="week" type="text" class="form-control mb-3"
            style="width: 200px;">

        <div class="d-md-flex justify-content-md-end">
            <button class="btn btn-primary mb-4" type="submit">Save
                Match Result</button>
        </div>
    </form>
</div>

如何停止在 .jsp 中的第一个下拉列表中提交？

How do I to stop submitting in first dropdown list in .jsp?

javascript

java

forms

jsp

servlets