EXT-JS java and Mysql

[sachintaware]

Hello
I am struggling a bit with displaying database values in a grid using java.This is the servlet which fetches the values from database and stores them in a Json array.



JSONArray jArray = new JSONArray();
while(rs1.next())

{
Integer id = rs1.getInt(1);
String uname = rs1.getString(2);
String fname = rs1.getString(4);
String lname = rs1.getString(5);
String emailid = rs1.getString(6);
String statename = rs1.getString(7);
String cityname = rs1.getString(8);
String countryname = rs1.getString(9);

JSONObject jobj = new JSONObject();

// jobj.put("id",id);
jobj.put("uname",uname);
jobj.put("fname",fname);
jobj.put("lname",lname);
jobj.put("emailid",emailid);
jobj.put("statename",statename);
jobj.put("cityname",cityname);
jobj.put("countryname",countryname);

jArray.add(jobj);


}

//pw.println(jArray);

JSONObject jObjDevice = new JSONObject();
jObjDevice.put("device", jArray);
JSONObject jObjDeviceList = new JSONObject();
jObjDeviceList.put("devicelist", jObjDevice );

pw.println(jObjDevice.toString());


This is the json array that is created with the records from database.



{"device":[{"id":1,"uname":"Sachin","fname":"Sachin","lname":"Taware","emailid":"sachi@gmail.com","statename":"MH","cityname":"Pune","countryname":"India"},{"id":2,"uname":"Rahul","fname":"Rahul","lname":"Dravid","emailid":"rdravid@gmail.com","statename":"KA","cityname":"Bangalore","countryname":"India"},{"id":3,"uname":"MS","fname":"MS","lname":"Dhoni","emailid":"ms@gmail.com","statename":"JH","cityname":"Ranchi","countryname":"India"},{"id":4,"uname":"viru","fname":"Virender","lname":"Sehwag","emailid":"viru123@gmail.com","statename":"DL","cityname":"Delhi","countryname":"India"}]


I have my script in an Html file.
But,now how can I pass the array to the store?
The problem I think is in the proxy and reader section(I have highlighted it).Can I pass the URL of the class file of the compiled servlet ??If not how to pass the json to the store?
Firebug shows me the same error of invalid json.



<script type="text/javascript">

Ext.onReady(function() {
Ext.define('Company', {
extend: 'Ext.data.Model',
fields: [
{name:'uname',type: 'string'},
{name:'fname',type: 'string'},
{name:'lname',type: 'string'},
{name:'emailid',type: 'string'},
{name:'statename',type: 'string'},
{name:'cityname',type: 'string'},
{name:'country',type: 'string'}]
});

var store_company = new Ext.data.Store({
model: 'Company',
proxy: {
type: 'ajax',
url: 'register.class', //Not sure if this is correct url:'register.class'"!!

reader: {
type: 'json',
root:'device'
},

}

});


var grid_company = Ext.create('Ext.grid.Panel', {

store: store_company,

columns:[

{
text : 'User Name',
width : 120,
sortable : true,

dataIndex: 'uname'
},
{
text : 'Firstname',
width : 120,
sortable : true,
dataIndex: 'fname'
},
{
text : 'Lastname',
width : 110,
sortable : true,
dataIndex: 'lname'
},
{
text : 'Email',
width : 150,
sortable : true,
dataIndex: 'emailid'
},
{
text : 'State',
width : 100,
sortable : true,
dataIndex: 'statename'
},
{
text : 'City',
width : 150,
sortable : true,
dataIndex: 'cityname'
},
{
text : 'Country',
width : 150,
sortable : true,
dataIndex: 'countryname'
}
],
bbar: Ext.create('Ext.PagingToolbar', {
store: store_company,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display"
}),
height: 210,
width: 902,
title: 'Company List',
renderTo: 'grid-company',
viewConfig: {
stripeRows: true
}
});
store_company.load();
});
</script>




Sach
www.optionsconsultancy.com

[tobiu]

your json is missing the last "}", probably a CC error.
http://jsonlint.com/ is worth a look.

you need to set the success property in your json as well, by default:


success: true


and yes, the store needs to know the correct url, otherwise it has no chance to fetch the data.

[sachintaware]

Thanks for the response.
The "{" was a copy/paste error.

where do I set the property in the code?Is it in the js code mentioned above??



success:true


Also,the URL is correct but the way(passing the link of class file of the compiled servlet) is what I am not sure if its correct.If wrong please suggest the correct way.

(http://jsonlint.com/)
Regards
Sachin

[sachintaware]

I have made the following changes,please inspect and correct if needed.

Added the name of the servlet i.e register.


var store_company = new Ext.data.Store({
model: 'Company',
proxy: {
type: 'ajax',
url: 'register',

reader: {
type: 'json',
root: 'device',
success:'true'
},

}

});



ERROR:Error I get is
http://localhost:8080/Dbext/register?_dc=1323169781608&page=1&start=0&limit=25
405 Method Not Allowed

Please guide me through this.

Regards
Sachin
www.optionsconsultancy.com

chrome://firebug/content/blank.gif

[tobiu]

json:


{"success":true, "device":...}


register seems to me not like an valid url, since it has no file ending (like register.html).

i am no java guy, so i can only help with the clientside issues.

[sachintaware]

@tobiu
Thank you for your inputs.Yes I have tried the url's


url: 'register.class'
and

url: 'register.java'

but doesn't seem to work.

But i have implemented a similar example in php without the


success:"true"

and url working as,


url:'register.php'


Not sure why its not working in java.

Also,this error in firebug:ERROR:
http://localhost:8080/Dbext/register...art=0&limit=25 (http://localhost:8080/Dbext/register?_dc=1323169781608&page=1&start=0&limit=25) 405 Method Not Allowed

I haven't encountered before.
Hope someone else has a look into it and helps me out.

Regards
Sachin

[tobiu]

ok, next try:
http://www.checkupdown.com/status/E405.html

http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.proxy.Ajax-property-actionMethods

probably you are using get instead of post which is not allowed by your backend (or something similar).

[sachintaware]

Well i will go through the links,but I have used doPost() in my servlet.Please ignore the commented code as i am still working on it,i have kept it.Really thankful for your responses.

Pasting the code for reference(For anyone who can help).



import java.io.*;
import javax.servlet.*;
import javax.servlet.http.*;
import javax.sql.*;
import java.sql.*;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;


public class register extends HttpServlet{

Statement ps1 = null;
ResultSet rs1 = null;

public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException,IOException{
response.setContentType("text/html");
PrintWriter pw = response.getWriter();

System.out.println("MySQL Connect Example.");
Connection conn = null;
String url = "jdbc:mysql://localhost:3306/";
String dbName = "user_register";
String driver = "com.mysql.jdbc.Driver";
String userName = "";
String password = "";

String username = request.getParameter("username");
String user_pass = request.getParameter("password");
String firstname = request.getParameter("firstname");
String lastname = request.getParameter("lastname");
String email = request.getParameter("email");
String state = request.getParameter("state");
String city = request.getParameter("city");
String country = request.getParameter("country");
Statement st;
try {
Class.forName(driver).newInstance();
conn = DriverManager.getConnection(url+dbName,userName,password);
System.out.println("Connected to the database");
String query = "insert into register set

username='"+username+"',password='"+user_pass+"',firstname='"+firstname+"',lastname='"+lastname+"',email=

'"+email+"',state='"+state+"',city='"+city+"',country='"+country+"'";
st = conn.createStatement();
int i = st.executeUpdate(query);

if(i>0)
{
pw.println("<html>");
pw.println("<Title>");
pw.println("Register");
pw.println("</Title>");
pw.println("<body>");
pw.println("<table width='100%' align='center'>");
pw.println("<tr>");
pw.println("<td width='100%' align='center'

style='padding-top:100px;font-weight:bold;color:blue;'>");
pw.println("You are Successfully entered the Record.");
pw.println("</td>");
pw.println("</tr>");
pw.println("</table>");
pw.println("</body>");
pw.println("</html>");

}
else
{
response.sendRedirect("register.html?error");
}
// pw.println(query);

String query1="select * from register";
ps1 = conn.prepareStatement(query1);
rs1 = ps1.executeQuery(query1);

/*Table for displaying the records */

pw.println("<br>");
pw.println("<b></b>");
pw.println("<html><table border=''><tr>");
pw.println("<td><b>Id</b></td>");
pw.println("<td><b>Username</b></td>");
pw.println("<td><b>First Name</b></td>");
pw.println("<td><b>Last Name</b></td>");
pw.println("<td><b>Email</b></td>");
pw.println("<td><b>State</b></td>");
pw.println("<td><b>City</b></td>");
pw.println("<td><b>Country</b></td>");
pw.println("</tr>");
/*while(rs1.next())

{
Integer id = rs1.getInt(1);
String uname = rs1.getString(2);
String fname = rs1.getString(4);
String lname = rs1.getString(5);
String emailid = rs1.getString(6);
String statename = rs1.getString(7);
String cityname = rs1.getString(8);
String countryname = rs1.getString(9);

pw.println("<tr>");
pw.println("<td>"+id+"</td>");
pw.println("<td>"+uname+"</td>");
pw.println("<td>"+fname+"</td>");
pw.println("<td>"+lname+"</td>");
pw.println("<td>"+emailid+"</td>");
pw.println("<td>"+statename+"</td>");
pw.println("<td>"+cityname+"</td>");
pw.println("<td>"+countryname+"</td>");
pw.println("</tr>");
}

pw.println("</table><br>");*/


JSONArray jArray = new JSONArray();
while(rs1.next())

{
Integer id = rs1.getInt(1);
String uname = rs1.getString(2);
String fname = rs1.getString(4);
String lname = rs1.getString(5);
String emailid = rs1.getString(6);
String statename = rs1.getString(7);
String cityname = rs1.getString(8);
String countryname = rs1.getString(9);

JSONObject jobj = new JSONObject();

// jobj.put("id",id);
jobj.put("uname",uname);
jobj.put("fname",fname);
jobj.put("lname",lname);
jobj.put("emailid",emailid);
jobj.put("statename",statename);
jobj.put("cityname",cityname);
jobj.put("countryname",countryname);

jArray.add(jobj);


}

//pw.println(jArray);

JSONObject jObjDevice = new JSONObject();
jObjDevice.put("device", jArray);
JSONObject jObjDeviceList = new JSONObject();
jObjDeviceList.put("devicelist", jObjDevice );

pw.println(jObjDevice);




conn.close();
pw.println("Disconnected from database");
} catch (Exception e)
{
e.printStackTrace();
}
}
}


Thanks and Regards
Sachin

[tvanzoelen]

Set on your proxy



actionMethods: {create: "POST", read: "POST", update: "POST", destroy: "POST"}


like:


var store_company = new Ext.data.Store({
model: 'Company',
proxy: {
type: 'ajax',
url: 'register',
actionMethods: {create: "POST", read: "POST", update: "POST", destroy: "POST"},
reader: {
type: 'json',
root: 'device',
success:'true'
},

}

});

[sachintaware]

Works like CHARM!!!!!!!!!!!!!! :)
@tvanzoelen : Can you please explain me the need of the

actionMethods: {create: "POST", read: "POST", update: "POST", destroy: "POST"}

or point me to the documentation related to it?? It would be another favour on me.

Thanks to both of you tvanzoelen and tobiu for the help and time you gave.

Will get back to you in case I need any further help.

Regards
Sachin

[tvanzoelen]

Well actually tobiu gave you the answer to look at this

http://docs.sencha.com/ext-js/4-0/#!...-actionMethods

You see that the default action for reading is the GET method. Your servlet wants a post.

[sachintaware]

ohhh!!! Anyways,thank you very much to both for the help.
I need to go through the documentation more thoroughly it seems.;)

Keep up the good work.

Wish you good luck

Thanks and Regards
Sachin

[tobiu]

you are welcome. take a look at my last reply, it already pointed to the right location inside the docs.

[sachintaware]

@tvanzoelen @tobiu
Hello
In need of help again./:)
Well I wanted to write a authentication mechanism using ext-js and xml schema.
That is I will have a few users in an xml schema,with username and password


<?xml version="1.0" encoding="UTF-8"?>
<message success="true">
<contact>
<username>Admin</username>
<password>Some encrypted password</password>
.
.(other fields)

</contact>
</message>


What I want to implement is:
1) Have a form to add a user,which on adding saves the username and password(encrypted) to the xml files.
Encryption can be using standard base64 encoding using java.
2) use the same username password to authenticate the user.i.e if the username password matches he is allowed to enter the application else not.How to check if the username posted from form matches the one in the xml file.


Problem I am facing:
I am able to read from xml files(referred to sample examples) but how to save them to the xml? Is it possible
Can you point to some examples??

Any help would be appreciated.

Regards
Sachin

[tvanzoelen]

Open a new thread plz for a new question. Else it would be difficult to find answers for people who are looking for it on the forum.

[sachintaware]

oops !!fine!!
will do that!
Here's the link!!!!!
@tvanzoelen (http://www.sencha.com/forum/member.php?32684-tvanzoelen)[/URL]

[URL]http://www.sencha.com/forum/showthread.php?160736-ExtJs-and-XML-schema&p=688268#post688268 (http://www.sencha.com/forum/member.php?32684-tvanzoelen)

Thanks and Regards
Sachin