PDA

View Full Version : [HELP] populate combo box from database using JSP



yehezqiel
10 May 2010, 1:02 AM
Hi All, i'm newbie in using extjs so i really need ur help guys..

I'm make a file 3_2.jsp
here is the code :


<%@ page contentType="text/html; charset=iso-8859-1" language="java" import="java.sql.*" errorPage="" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<link rel="stylesheet" type="text/css" href="lib/extjs/resources/css/ext-all.css" />
<script src="lib/extjs/adapter/ext/ext-base.js" ></script>
<script src="lib/extjs/ext-all-debug.js"></script>
<script>
Ext.onReady
(
function()
{
Ext.QuickTips.init();
var genres = new Ext.data.JsonStore
({
url: 'data.jsp',
baseParams:{cmd:'root'},
root: 'root',
fields: [ {name: 'id'},{name: 'genre'}] ,
autoLoad: true
});

var MakeCombo=
{
xtype: 'combo',
store : genres,
displayField: 'genre',
valueField: 'genre',
editable: false,
mode: 'remote',
forceSelection: true,
triggerAction: 'all',
fieldLabel: 'Make',
emptytext: 'select...',
selectOnFocus: true
}

var movie_form = new Ext.FormPanel
({
url: '3_2.jsp',
renderTo: document.body,
frame: true,
title: 'Movie Information Form',
width: 250,
url: '3_2.jsp',
items:
[
MakeCombo
]
});
}
);
</script>
</head>

<body>
</body>
</html>



and here is the code for data.jsp


<%@ page contentType="text/html; charset=iso-8859-1" language="java" import="java.sql.*"
import ="org.json.*"
import="java.util.Enumeration"
import="java.util.*"
import="net.sf.json.JSONArray"
errorPage="" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

</head>

<body>
<%
Class.forName("org.postgresql.Driver");
String url = "jdbc:postgresql://localhost/qq";
String user = "postgres";
String pass = "qq";
Connection con = DriverManager.getConnection(url, user, pass);
Statement stmt = con.createStatement();

String q = "select id, genre from genres";
ResultSet rs;
rs=stmt.executeQuery(q);
ArrayList list = new ArrayList();
JSONArray root=new JSONArray();
while(rs.next())
{
list.add(rs.getString(2));
root.add(rs.getString(2));
}
for(int i=0; i<list.size(); i++)
{
out.println(list.get(i));
}
String myOut1 = root.toString().replaceAll("'", " ");
String myOut = "{root:" + myOut1 + "}" ;
out.println(myOut);
%>
</body>
</html>


but i am unable to loading combo box, please help me any one knows about this..
thx b4

yehezqiel
10 May 2010, 2:11 AM
please help me, I really do not know what to do anymore ...
i've googling all day today but still have not received any instructions..
master2... help please

yehezqiel
10 May 2010, 5:28 PM
someone please help me......:((

libertux
18 May 2010, 9:50 AM
Hi there to do it just folow thease steps:

JS FILE



var intefaces = new Ext.data.Store({
reader: new Ext.data.JsonReader({
fields: ['id', 'ipadr'],
root: 'rows'
}),
proxy: new Ext.data.HttpProxy({
url: '../core/sside/getinterfaces.jsp'
}),
autoLoad: true
});
....
....
{
fieldLabel: 'Interface',
xtype:'combo',
name: 'interf',
mode: 'local',
store: intefaces,
displayField:'ipadr'
}
...


JSP FILE




...
stmt = conn.createStatement();
ResultSet rs = stmt.executeQuery(SQL);
ArrayList list = new ArrayList();
String menuString;

while(rs.next()){
cinter item = new cinter();
item.setId(rs.getString(init.getProperty("dbinterfacetableidcolumn")).toString());
item.setIpadr(rs.getString(init.getProperty("dbinterfacetableinterfaceipaddresscolumn")));
list.add(item);
}

try {
JSONArray jsonObject = JSONArray.fromObject(list);
menuString = "{rows:"+jsonObject.toString()+"}";
}catch (Exception e) {
menuString = "Error";
}

out.print(menuString);
out.flush();

...



cinter.java


public class cinter {
private String id;
private String ipadr;

public void setId(String id) {
this.id = id;
}

public void setIpadr(String ipadr) {
this.ipadr = ipadr;
}

public String getId() {
return id;
}

public String getIpadr() {
return ipadr;
}


}



;)