Page 1 of 2 12 LastLast
Results 1 to 10 of 14

Thread: Ext Js with Java

  1. #1

    Default Ext Js with Java

    I want to use Ext-Js as layout and Java as server side engine(for logic and querrys).
    how can i combine them? yet i can only think about servlets , but i dont like this dicission.

  2. #2
    Sencha Premium Member
    Join Date
    Oct 2009
    Location
    Germany
    Posts
    333

    Default

    If you are looking for a deep integration with java. Wy not Ext-GWT ?

  3. #3
    Sencha User
    Join Date
    Jan 2011
    Posts
    10

    Default

    I recommend having a look at ext direct.

    For my current project I use http://code.google.com/p/extdirectspring/ to provide the server side API.
    Works like a charm.

  4. #4

    Default Ext Js with Java Mysql

    Hello
    I am a new user of extjs and trying to integrate with JAVA.Came across the forum so thought someone could help.
    I have written a servlet to connect to the DB and fetch results.Now I want to display them in an ext-grid.
    I went through posts which suggest use of JSON,but I an not sure HOW??

    Please help me on how to use JSON to pass the data to the datastore using JAVA.

    This is my servlet for connection and fetching results.

    Code:
    public class register extends HttpServlet{ 
        PreparedStatement ps1;
         ResultSet rs1;
       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 = "abc"; 
        String password = "123";
    
        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");
            }
    Regards
    Sachin

  5. #5
    Sencha User
    Join Date
    Nov 2010
    Posts
    8

    Default

    If you're not using Ext.Direct you could try using a jsonP proxy on your store. Check out the documentation on the proxy here : http://docs.sencha.com/ext-js/4-0/#!...ta.proxy.JsonP

    I do strongly recommend using a server side framework to provide the json to your proxy instead of hand coding servlets for all your requests.

    Either use a restful method like Spring MVC or if you want to use Ext.Direct try using http://code.google.com/p/extdirectspring/ it really is quite easy to use and very powerful.

    Good luck

  6. #6

    Default extjs with java and mysql

    Hello
    Thank you for the response and links.I wen through them with very little understanding.
    Actually my knowledge about frameworks like spring,hibernate is negligible and limited to servlets and basic jsp's.

    When I try to build it using maven i get the following error.

    Code:
    [ERROR] No plugin found for prefix 'jetty' in the current project and in the plu
    gin groups [org.apache.maven.plugins, org.codehaus.mojo] available from the repository
    Also,can we point me to a simple example for connecting and deploying it using java.I know I am asking a bit more,but as I am newbie I cannot start without examples.

    Thanks and Regards
    Sachin

  7. #7

    Default

    @osnoek
    Hello
    I tried out this by reading blog posts and json.org ,but had no success.I impored the pacakage for Json and created a json array.inserted the records from the database but still not working for me.

    Please correct me where I am wrong.

    Code:
    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);
    
                    /*jArray.add("Username:");
                    jArray.add("uname");
                    jArray.add("Firstname:");
                    jArray.add("fname");
                    jArray.add("Lastname");
                    jArray.add("lname");*/
    
                    jArray.put("Username",uname);
                    jArray.put("Firstname",fname);         
                    jArray.put("Lastname",lname);
                    jArray.put("Emailid",emailid);
                    jArray.put("State",statename);
                    jArray.put("City",city);
                    jArray.put("Country",countryname);
                
                pw.println(jArray);        
            }
    I want the DB records to be stored in json array and then pass it to the datastore to display it in a grid.

    Regards
    Sachin

  8. #8
    Touch Premium Member
    Join Date
    May 2008
    Posts
    89

    Default

    I've done this a bunch, and its a bit of a long story, but here's the basic strategy..

    1) Use something like spring framework mvc on the server side. I realize that might be a bit of rampup, but if you can do it, then that would be better than working with servlets.
    Alternatively, consider using playframework for the server side. It is very very easy to use. Also, play has gson-based rendering built in.

    2) Look into google GSON for rendering json. It works quite nicely. Basically, you put your data from the DB into an arraylist of beans, and GSON will serialize the list and contained objects to json.

    3) your server side (servlet or spring controller or playframework controller) will accept a request, e.g. "/query" (with params for the db query if necessary), query the DB and respond with json.

    4) On the extjs side, use the "/query" url for the grid store proxy. When the store is loaded, it will query the server get the response and populate the grid. (works quite nicely)

    As others mentioned, you can also use ext-direct. I've not gone that route mainly because i need some fairly fine control on the server side.

    Apologies- I do not have a working example published.

    gson: https://sites.google.com/site/gson/gson-user-guide
    play framework: http://www.playframework.org/

    Hope this helps.

    -jeff

  9. #9

    Default Ext Js with Java

    @jeffcrilly
    Thanks for the inputs,but going into frameworks(SpringMVC or playframework) is not on the cards right now.I have just started and working on a small POC(Proof of concepts).Once I have something working I am surely going to get into it more.But,atleast to show what can be done i need a work around for this now.I have implemented it using PHP the other day,but struggling wth the JSON part in java.With php it was a walk in the park due to json_encode() inbuilt function.

    Just reframing where I am struggling:Any help would be appreciated.

    The java code I have is below alongwith the result I get back.
    But,when I give the path of the class file to the store(code pasted below), FIREBUG displays the error as "You're trying to decode and invalid JSON String "

    Java Code:
    Code:
    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);
                
                    jArray.add("Username:");
                    jArray.add(uname);
                    jArray.add("Firstname:");
                    jArray.add(fname);
                    jArray.add("Lastname");
                    jArray.add(lname);
                    jArray.add("Email");
                    jArray.add(emailid);
                    jArray.add("State");
                    jArray.add(statename);
                    jArray.add("City");
                    jArray.add(cityname);
                    jArray.add("Country");
                    jArray.add(countryname);
    
                    
                        
            }
            
            //pw.println(jArray);        
         
         JSONObject jObjDevice = new JSONObject();
            jObjDevice.put("device", jArray);
            JSONObject jObjDeviceList = new JSONObject();
            jObjDeviceList.put("devicelist", jObjDevice );
        
            pw.println(jObjDevice);
    Ext Js
    Code:
      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',    //Can this be done???url of the clas file
                  
                  reader: {
                      type: 'json',
                      store:'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();
        });

    JSON printed:

    Code:
    {"device":["Username:","Sachin","Firstname:","Sachin","Lastname","Taware","Email","[email protected]","State","MH","City","Pune","Country","India","Username:","Rahul","Firstname:","Rahul","Lastname","Dravid","Email","[email protected]","State","KA","City","Bangalore","Country","India","Username:","MS","Firstname:","MS","Lastname","Dhoni","Email","[email protected]","State","JH","City","Ranchi","Country","India","Username:","viru","Firstname:","Virender","Lastname","Sehwag","Email","[email protected]","State","DL","City","Delhi","Country","India","Username:","Gauti","Firstname:","Gautam","Lastname","Gambhir","Email","[email protected]","State","DL","City","Delhi","Country","India","Username:","jumbo","Firstname:","Anil","Lastname","kumble","Email","[email protected]","State","KA","City","Bangalore","Country","India","Username:","Zak","Firstname:","Zaheer","Lastname","Khan","Email","[email protected]","State","MH","City","Mumbai","Country","India","Username:","Umesh","Firstname:","Umesh","Lastname","Yadav","Email","[email protected]","State","MH","City","Nagpur","Country","India","Username:","Ishant","Firstname:","ishant","Lastname","sharma","Email","[email protected]","State","DL","City","Delhi","Country","India","Username:","yuvi","Firstname:","yuvraj","Lastname","Singh","Email","[email protected]","State","PB","City","Chandigarh","Country","India","Username:","dada","Firstname:","saurov","Lastname","ganguly","Email","[email protected]","State","WB","City","Kolkata","Country","India","Username:","Rohit","Firstname:","Rohit   ","Lastname","Sharma","Email","[email protected]","State","MH","City","Mumbai","Country","India","Username:","RJ","Firstname:","Ravidra","Lastname","jadeja","Email","[email protected]","State","RJ","City","Jaipur","Country","India","Username:","Ravi","Firstname:","Ravi","Lastname","Ashwin","Email","[email protected]","State","TN","City","Chennai","Country","India","Username:","Pragyan","Firstname:","Pragyan","Lastname","ojha","Email","[email protected]","State","OR","City","Bhubaneshwar","Country","India","Username:","Irfan","Firstname:","Irfan","Lastname","pathan","Email","[email protected]","State","GJ","City","Ahemdabad","Country","India","Username:","Raina","Firstname:","Suresh","Lastname","Raina","Email","[email protected]","State","UP","City","Varanasi","Country","India","Username:","Praveen","Firstname:","Praveen","Lastname","Kumar","Email","[email protected]","State","UP","City","Lucknow","Country","India","Username:","RP","Firstname:","rudra","Lastname","singh","Email","[email protected]","State","UP","City","Lucknow","Country","India","Username:","kapil","Firstname:","Kapil","Lastname","Dev","Email","[email protected]","State","HR","City","Haryana","Country","India","Username:","Ashish","Firstname:","Ashish","Lastname","Nehra","Email","[email protected]","State","DL","City","Delhi","Country","India","Username:","Rob","Firstname:","Robin","Lastname","Uthappa","Email","[email protected]","State","KA","City","Bangalore","Country","India","Username:","RP","Firstname:","Rudra","Lastname","Singh","Email","[email protected]","State","UP","City","Raipur","Country","India","Username:","Venkat","Firstname:","Venkatpathy","Lastname","Raju","Email","[email protected]","State","KA","City","Bangalore","Country","India","Username:","Wasim","Firstname:","Wasim","Lastname","Jaffer","Email","[email protected]","State","MH","City","mumbai","Country","India","Username:","Ravi","Firstname:","Ravi","Lastname","Shashtri","Email","[email protected]","State","MH","City","Mumbai","Country","India","Username:","sunny","Firstname:","sunil","Lastname","gavaskar","Email","[email protected]","State","MH","City","Mumbai","Country","India","Username:","Roger","Firstname:","Roger","Lastname","Binny","Email","[email protected]","State","MH","City","Mumbai","Country","India","Username:","vvs","Firstname:","venkat","Lastname","Laxman","Email","[email protected]","State","AP","City","Hyderabad","Country","India","Username:","umesh","Firstname:","umesh","Lastname","yadav","Email","[email protected]","State","MH","City","Vidharba","Country","India","Username:","ajay","Firstname:","ajay","Lastname","jadeja","Email","[email protected]","State","RJ","City","Jaipur","Country","India","Username:","sunil","Firstname:","sunil","Lastname","chetri","Email","[email protected]","State","TN","City","Channai","Country","India","Username:","asa","Firstname:","dsdsd","Lastname","dssds","Email","[email protected]","State","MH","City","Pune","Country","India","Username:","Hello","Firstname:","Happy","Lastname","Singh","Email","[email protected]","State","MH","City","Pune","Country","India","Username:","sachin","Firstname:","sachin","Lastname","taware","Email","[email protected]","State","MH","City","Pune","Country","India","Username:","sachin","Firstname:","sachin","Lastname","taware","Email","[email protected]","State","MH","City","Nagpur","Country","India","Username:","final","Firstname:","final","Lastname","tried","Email","[email protected]","State","MH","City","Pune","Country","India","Username:","once","Firstname:","try","Lastname","hopefully","Email","[email protected]","State","MH","City","Nashik","Country","India","Username:","Half","Firstname:","Not","Lastname","important","Email","[email protected]","State","MH","City","amravati","Country","India"]}
    Regards
    Sachin

  10. #10

    Default

    Just to add to the previous post,this is the JSON response for the PHP function json_encode.
    I think the format in which I am getting it using java is not correct,hence the error.
    So,please let me know how can I get in the required format.


    Code:
    [{"username":"Sachin","firstname":"Sachin","lastname":"Taware","email":"[email protected]","state":"MH","city":"Pune","country":"India"},{"username":"Rahul","firstname":"Rahul","lastname":"Dravid","email":"[email protected]","state":"KA","city":"Bangalore","country":"India"},{"username":"MS","firstname":"MS","lastname":"Dhoni","email":"[email protected]","state":"JH","city":"Ranchi","country":"India"},{"username":"viru","firstname":"Virender","lastname":"Sehwag","email":"[email protected]","state":"DL","city":"Delhi","country":"India"},{"username":"Gauti","firstname":"Gautam","lastname":"Gambhir","email":"[email protected]","state":"DL","city":"Delhi","country":"India"},{"username":"jumbo","firstname":"Anil","lastname":"kumble","email":"[email protected]","state":"KA","city":"Bangalore","country":"India"},{"username":"Zak","firstname":"Zaheer","lastname":"Khan","email":"[email protected]","state":"MH","city":"Mumbai","country":"India"},{"username":"Umesh","firstname":"Umesh","lastname":"Yadav","email":"[email protected]","state":"MH","city":"Nagpur","country":"India"}
    Regards
    Sachin

Page 1 of 2 12 LastLast

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •