Question

我正在尝试实现ajax调用，以根据输入文本字段填充选择下拉列表的选项。任何帮助都将在此得到赞赏。

这是我的方法，它允许我们获取数字的模板。

System.out.println("Getting template for " + no_nego);
//Do the database code or business logic here.  
try {
    Connection con;
    con = null;

    Class.forName("com.mysql.jdbc.Driver").newInstance();
    con = DriverManager.getConnection("jdbc:mysql://localhost:8081/RSI_MANAGEMENT", "root", "user");

    Statement stmt = null;

    stmt = con.createStatement();
    String tableName = "rsi_demande";
    String sql;

    sql = "select filename from " + tableName +
        " Where (filename IS NOT NULL and no_negociateur=" + getNo_nego() + " ) ";
    ResultSet res = null;
    res = stmt.executeQuery(sql);

    while (res.next()) {

        listeTemplateDownload.add(res.getString(1));

    }
    //setListeTemplateDownload(listeTemplateDownload);  
    stmt.close();

} catch (Exception ex1) {
    ex1.printStackTrace();
}


for (int i = 0; i < 2; i++)
    System.out.println(listeTemplateDownload.get(i));

JSONArray json = new JSONArray();

json.addAll(getListeTemplateDownload());
json.toString();
System.out.printf("JSON: %s", json.toString());

return Action.SUCCESS;


}

这是我的jsp页面：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
  <html>  
  <head>  
  <script src="js/jquery-1.11.1.min.js"></script>      
  </head>      
  <body>  
  <script>  
    $(function() {
      $("#no_nego").change(
        function() {
          var state = {
              "no_nego": $("#no_nego").val()
          };

          $.ajax({
            url: "readDistricts",
            data: JSON.stringify(state),
            dataType: 'JSON',
            contentType: 'application/json',
            type: 'POST',
            async: true,
            success: function() {
              var $select = $('#listeTemplateDownload');
              $select.html('');
              console.log(listeTemplateDownload.size());
              for (var i = 0; i < getListeTemplateDownload().size(); i++) {
                $select.append(
                  '<option value= ' + listeTemplateDownload.get(i) + '</option>');
              }
            }
          });
        });
    }); 
  </script>  

    <h3>Struts 2 Dynamic Drop down List</h3>  
    State :  
    <input type="text" id="no_nego"></select> District :  
    <select id="listeTemplateDownload"></select>  
  </body>  

</html>

我希望当用户完成设置号码时，列表将动态生成... 但是如何用这些数据填充选择表单？

Answer 1

解决了。问题是追加方法： jsp：

   <%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>

<head>
<script src="js/jquery-1.11.1.min.js"></script>
<script>

$(document).ready(function () {
     $('#listeTemplateDownload').html('');
        $("#no_nego").change(
                function() {

                    var no_nego = {
                        "no_nego" : $("#no_nego").val()

                    };

                    $.ajax({
                            url : "readDistricts.action",
                        data : JSON.stringify(no_nego),
                        dataType : 'json',
                        contentType : 'application/json',
                        type : 'post',
                        async : true,
                        success : function(res) {
                            console.log(res.listeTemplateDownload.length);
                            for ( var i = 0; i < res.listeTemplateDownload.length; i++) {
                                 $('#listeTemplateDownload').append( '<option value=' + res.listeTemplateDownload[i] + '>' + res.listeTemplateDownload[i] + '</option>');

                            }
                        }
                    });

                });
    });
</script>

</head>

<body>


    <h3>Struts 2 Dynamic Drop down List</h3>
    Negociateur n°:
    <input type="text" id="no_nego" > Template :
    <select id="listeTemplateDownload"></select>
</body>

</html>

使用jQuery + JSON + Struts根据输入文本字段填充选择选项

1 个答案: