eclipse(写一个表格)

利用eclipse写一个如图所示的表格

在这里插入图片描述

1.首先打开eclipse,在webcontent中创建一个HTML(自己命名,在这命名为newData.html)

在这里插入图片描述

2.在创建的newData.html中写入如下代码

在这里插入图片描述

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"> </script>
</head>
<body onload="get()">
	<div id="hhh"></div>
</body>
<script>
	function get(){
		$.ajax({
			type:"get",
			url:"/BigData01/newDataServlet",
			success:function(data){
				console.log(data);
				showData(data.data);
			}
		})		
	}
	
	function showData(data){
		var html = '<table border="1">';
		for(var i = 0; i < data.length;i++){
			html += '<tr>';
			html += '<td>' + data[i].username + '</td>';
			html += '<td>' + data[i].password + '</td>';
			html += '<td>' + data[i].sex + '</td>';
			html += '<td>' + data[i].age + '</td>';
			html += '<td>';
			html += '<input type="button" value="编辑" />';
			html += '<input type="button" value="删除" />';
			html += '</td>';
			html += '</tr>';
		}
		html +='</table>';
		$("#hhh").empty().append(html);
	}
</script>
</html>

3.在 JAVA Resources的src的com.bigdata(自己创建的)中创建一个servlet(如图所示)

在这里插入图片描述

4.命名为newDataServlet(自己命名),在这里写入如下代码,注意:只更改了28行到43行的内容,其他不变(5.6.7是写法,往下看看!!)

在这里插入图片描述

5.利用JOSN编辑器更快写入代码(31-39行)

JOSN在线编辑器的链接!!!(点我!!!!)

{
  	"data":[
	  {"username":"admin","password":"123456","sex":"男","age":"23"},
	  {"username":"admin","password":"123456","sex":"男","age":"20"},
	  {"username":"admin","password":"123456","sex":"女","age":"14"},
	  {"username":"admin","password":"123456","sex":"男","age":"28"}
	
	]

}

在其中写入以上代码(自己可更改内容)后,点击检验查看是否正确

在这里插入图片描述

6.回到eclipse的newDataServlet界面,在第31行写入String data ="";,把上边的代码复制到双引号内就可以有下图的效果啦

在这里插入图片描述

7.第四条的完整代码(29-42行),其余不变

response.setCharacterEncoding("utf-8");
		response.setContentType("application/json; charset=utf-8");
		String data = "{\r\n" + 
				"  	\"data\":[\r\n" + 
				"	  {\"username\":\"admin\",\"password\":\"123456\",\"sex\":\"男\",\"age\":\"23\"},\r\n" + 
				"	  {\"username\":\"admin\",\"password\":\"123456\",\"sex\":\"男\",\"age\":\"20\"},\r\n" + 
				"	  {\"username\":\"admin\",\"password\":\"123456\",\"sex\":\"女\",\"age\":\"14\"},\r\n" + 
				"	  {\"username\":\"admin\",\"password\":\"123456\",\"sex\":\"男\",\"age\":\"28\"}\r\n" +  
				"	]\r\n" + 
				"\r\n" + 
				"}";
		
		response.getWriter().append(data);
	}

8.回到newData.html中,右击运行

在这里插入图片描述

9.运行出的界面!!!!

在这里插入图片描述

  • 11
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
要用Eclipse一个数据库管理系统,你需要掌握以下技术: 1. Java语言:Eclipse一个Java开发工具,因此你需要熟悉Java语言。 2. JDBC:Java Database Connectivity,是Java中用于访问数据库的API,你需要学会如何使用JDBC连接数据库。 3. SQL语言:结构化查询语言,用于对数据库进行操作。 下面是一个简单的数据库管理系统的示例,它可以连接到MySQL数据库,显示数据库中的表格,添加新的表格,删除表格等功能。 首先,你需要创建一个Java项目,并将MySQL的JDBC驱动程序添加到项目中。接下来,你需要创建一个类来连接到数据库并执行SQL查询。 ```java import java.sql.Connection; import java.sql.DriverManager; import java.sql.ResultSet; import java.sql.Statement; public class DatabaseManager { private Connection connection; public void connect(String url, String username, String password) throws Exception { Class.forName("com.mysql.jdbc.Driver"); connection = DriverManager.getConnection(url, username, password); } public void disconnect() throws Exception { connection.close(); } public ResultSet executeQuery(String query) throws Exception { Statement statement = connection.createStatement(); ResultSet resultSet = statement.executeQuery(query); return resultSet; } public void executeUpdate(String update) throws Exception { Statement statement = connection.createStatement(); statement.executeUpdate(update); } } ``` 上面的代码中,我们使用了Java的JDBC API来连接到MySQL数据库,并执行SQL查询。connect()方法用于连接到数据库,disconnect()方法用于关闭数据库连接,executeQuery()方法用于执行查询语句并返回结果集,executeUpdate()方法用于执行更新语句(如插入、删除、修改数据)。 接下来,我们可以创建一个图形用户界面(GUI)来显示数据库中的表格,并提供添加、删除表格的功能。 ```java import java.awt.BorderLayout; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import java.sql.ResultSet; import java.util.Vector; import javax.swing.JButton; import javax.swing.JFrame; import javax.swing.JPanel; import javax.swing.JScrollPane; import javax.swing.JTable; import javax.swing.JTextField; import javax.swing.table.DefaultTableModel; public class DatabaseGUI extends JFrame { private static final long serialVersionUID = 1L; private DatabaseManager manager; private JTable table; private DefaultTableModel tableModel; public DatabaseGUI() { super("Database Manager"); setDefaultCloseOperation(EXIT_ON_CLOSE); setSize(600, 400); setLocationRelativeTo(null); // 创建连接数据库的按钮和文本框 JPanel connectPanel = new JPanel(); JTextField urlField = new JTextField("jdbc:mysql://localhost:3306/test"); JTextField userField = new JTextField("root"); JTextField passwordField = new JTextField(); JButton connectButton = new JButton("Connect"); connectButton.addActionListener(new ActionListener() { public void actionPerformed(ActionEvent e) { try { manager = new DatabaseManager(); manager.connect(urlField.getText(), userField.getText(), passwordField.getText()); updateTable(); } catch (Exception ex) { ex.printStackTrace(); } } }); connectPanel.add(urlField); connectPanel.add(userField); connectPanel.add(passwordField); connectPanel.add(connectButton); // 创建添加新表格的按钮和文本框 JPanel addPanel = new JPanel(); JTextField tableField = new JTextField(); JButton addButton = new JButton("Add Table"); addButton.addActionListener(new ActionListener() { public void actionPerformed(ActionEvent e) { try { String tableName = tableField.getText(); String createTable = "CREATE TABLE " + tableName + " (id INT PRIMARY KEY, name VARCHAR(50))"; manager.executeUpdate(createTable); updateTable(); } catch (Exception ex) { ex.printStackTrace(); } } }); addPanel.add(tableField); addPanel.add(addButton); // 创建删除表格的按钮和文本框 JPanel deletePanel = new JPanel(); JTextField deleteField = new JTextField(); JButton deleteButton = new JButton("Delete Table"); deleteButton.addActionListener(new ActionListener() { public void actionPerformed(ActionEvent e) { try { String tableName = deleteField.getText(); String dropTable = "DROP TABLE " + tableName; manager.executeUpdate(dropTable); updateTable(); } catch (Exception ex) { ex.printStackTrace(); } } }); deletePanel.add(deleteField); deletePanel.add(deleteButton); // 创建显示表格的面板和按钮 JPanel tablePanel = new JPanel(new BorderLayout()); tableModel = new DefaultTableModel(); table = new JTable(tableModel); JScrollPane scrollPane = new JScrollPane(table); JButton refreshButton = new JButton("Refresh"); refreshButton.addActionListener(new ActionListener() { public void actionPerformed(ActionEvent e) { updateTable(); } }); tablePanel.add(scrollPane, BorderLayout.CENTER); tablePanel.add(refreshButton, BorderLayout.SOUTH); // 将所有组件添加到主窗口中 JPanel mainPanel = new JPanel(new BorderLayout()); mainPanel.add(connectPanel, BorderLayout.NORTH); mainPanel.add(addPanel, BorderLayout.WEST); mainPanel.add(deletePanel, BorderLayout.EAST); mainPanel.add(tablePanel, BorderLayout.CENTER); setContentPane(mainPanel); } private void updateTable() { try { ResultSet resultSet = manager.executeQuery("SHOW TABLES"); Vector<String> columnNames = new Vector<String>(); columnNames.add("Tables_in_test"); Vector<Vector<Object>> data = new Vector<Vector<Object>>(); while (resultSet.next()) { Vector<Object> rowData = new Vector<Object>(); rowData.add(resultSet.getObject(1)); data.add(rowData); } tableModel.setDataVector(data, columnNames); } catch (Exception ex) { ex.printStackTrace(); } } public static void main(String[] args) { DatabaseGUI gui = new DatabaseGUI(); gui.setVisible(true); } } ``` 上面的代码中,我们使用了Java的Swing API来创建一个GUI界面,包括连接数据库的文本框和按钮、添加、删除表格的文本框和按钮、以及显示表格的JTable组件和刷新按钮。 当用户点击连接按钮时,我们创建一个DatabaseManager对象并调用connect()方法连接到MySQL数据库,并更新表格数据。当用户点击添加或删除表格的按钮时,我们使用executeUpdate()方法执行SQL语句,创建或删除表格。当用户点击刷新按钮时,我们使用executeQuery()方法查询数据库中的所有表格,并更新表格数据。 这只是一个简单的示例,你可以根据自己的需求和技能来扩展它。注意,这只是一个示例,实际情况下你需要更多的错误处理和安全性措施。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值