如何使用JSP基于文本框输入动态地从DB获取数据?

时间:2017-09-11 08:57:53

标签: mysql ajax jsp

我使用JSP作为HTML的后端,我想在开始输入客户联系电话时获取客户名称。

HTML:

<html>
<body>
    <script>
        function evaluation() {
            var myBox1 = document.getElementById('milk').value;
            var result = document.getElementById('result');
            var myResult = myBox1 * 35;
            result.value = myResult;
        }
    </script>

    <form action="BillValid.jsp" method="post">
        <table width="70%" cellspacing="30" color="#FFFFFF">
            <tr>
                <th>ENTER THE DETAILS</th>
            </tr>
            <tr>
                <td><font color="#800000">Customercontact</font></td>
                <td><input name="cus_contact" type="text" id="contact"></td>
            </tr>
            <tr>
                <td><fontcolor="#800000">CustomerName</font></td>
                <td><input type="text" name="cus_name"></td>
            </tr>
            <tr>
                <td>&nbsp;</td>
                <td></td>
            </tr>
            <tr>
                <td><font color="#800000">DayConsumption</font></td>
                <td><input id="milk" type="text" name="days_con"
                    oninput="evaluation()"></td>
            </tr>
            <tr>
                <td><font color="#800000">SumInRs</font></td>
                <td><input id="result" name="total"</td>
            </tr>
            <tr>
                <td>&nbsp;</td>
                <td></td>
            </tr>
        </table>
        <input type="submit" name="Register"><input type="reset"
            name="reset">
    </form>
</body>
</html>    

JSP:

 try{
    String DBuser="root";
    String DBpassword="qwerty";
    String Connection="jdbc:mysql://localhost:3306/online";

    Class.forName("com.mysql.jdbc.Driver");
    java.sql.Connection conn=DriverManager.getConnection(Connection,DBuser, DBpassword);
    out.println("Database Succesfully connected");            

    String CustomerName=request.getParameter("cus_name");
    String contact=request.getParameter("cus_contact");
    long customerCon=Long.parseLong(contact);  
    String dayCons=request.getParameter("days_con");
    int Consumtion=Integer.parseInt(dayCons);
    String total =request.getParameter("total");
    int totalConsume=Integer.parseInt(total);

    String sql = "select (CustomerName) from customer where CustomerContact='"+ customerCon+"'"; 
    java.sql.PreparedStatement st=conn.prepareStatement(sql); 
    java.sql.PreparedStatement pst=conn.prepareStatement("insert into invoice (CustomerContact ,CustomerName ,LitresConsumed ,TotalSum) values (?,?,?,?)");
    pst.setLong(1, customerCon); 
    pst.setString(2, CustomerName); 
    pst.setInt(3, Consumtion); 
    pst.setInt(4, totalConsume); 
    int i=pst.executeUpdate(); 

    if(i>0){
        response.sendRedirect("BillData.jsp");
    }else{
        response.sendRedirect("addcustomer.jsp");
    }           
}catch(Exception e){
    out.println(e);
    e.getMessage();
}

1 个答案:

答案 0 :(得分:0)

欢迎来到SO,我得到了一些积分。

  

如果您能向我发送该功能的代码,我将非常感谢您,因为我对AJAX一无所知。

1)这不是这个网站的运作方式。请阅读How do I ask a good question?。 我们会帮助您解决问题,然后再尝试一下。

2)JSP不是编写Java代码的正确位置。请检查How to avoid Java code in JSP files?

您应该将Java代码保存在servlet中。当ajax调用请求时,将其指向sevlet并在那里执行Java代码并返回预期的输出。 JSP应该用于呈现输出。

package com.servlet;

import java.io.IOException;
import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class MyServlet extends HttpServlet {

private static final long serialVersionUID = 1L;

protected void doGet(HttpServletRequest request,
        HttpServletResponse response) throws ServletException, IOException {

        String customerContact = request.getParameter("myValue");
        String customerName = "Your_Response_From_DB";
        response.setContentType("text/plain");
        response.getWriter().write(customerName);
    }
}

在您的web.xml文件中,

<servlet>
   <servlet-name>MyServlet</servlet-name>
   <servlet-class>MyServlet</servlet-class>
</servlet>
<servlet-mapping>
   <servlet-name>MyServlet</servlet-name>
   <url-pattern>/MyServlet</url-pattern>
</servlet-mapping>

HTML中的修正很少,

将ID添加到客户名称(使用有意义的名称)。

<tr>
    <td><font color="#800000">Customercontact</font></td>
    <td><input name="customer_contact" type="text" id="customer_contact"></td>
</tr>
<tr>
    <td><fontcolor="#800000">CustomerName</font></td>
    <td><input type="text" name="customer_name" id="customer_name"></td>
</tr>

如果您想使用jQuery ajax返回同一页面, 下载jQuery插件将其添加到JSP页面中。

$("#customer_contact").blur(function(e){
    var contact = $(this).val();
    $.ajax({
        type : 'post',
        url : 'MyServlet',
        data: { myValue: contact},
        success : function(data) {
           console.log(data);
           $("#customer_name").val(data);
        }
    });
});

如果有帮助,请告诉我。

干杯..!