Wert übergeben an Servlet kommt als Null in extjs4.2.2 - Java-Servlet

Question

Ich bin neu mit ExtJS. Ich habe ein Login-Formular erstellt, bei Submit werden die Parameterwerte an das Servlet übergeben. Selbst das Servlet wird aufgerufen, der übergebene Wert ist null. Fügen Sie das unten stehende Code-Snippet hinzu, bitte helfen Sie mir beim Debuggen des Fehlers.

login.js

Ext.application({ 
name: 'test-application', 
launch: function() { 

    Ext.QuickTips.init(); 

    var login_details = Ext.create('Ext.form.Panel', { 
     frame: true, 
     xtype: 'fieldset', 
     padding: 10, 
     layout: 'anchor', 
     fieldDefaults: { 
      msgTarget: 'side', 
      labelWidth: 50 
     }, 
     defaultType: 'textfield', 
     defaults: { 
      anchor: '100%' 
     }, 
     items: [{ 
       xtype: 'fieldset', 
       title: 'Login', 
       defaultType: 'textfield', 
       layout: 'anchor', 
       defaults: { 
        anchor: '100%' 
       }, 
       items: [{ 
         xtype: 'container', 
         columnWidth: 1, 
         layout: 'anchor', 
         items: [{ 
           xtype: 'textfield', 
           labelAlign: 'top', 
           fieldLabel: 'Username', 
           name: 'username', 
           id: 'username', 
           allowBlank: false, 
           padding: '0 0 10 0', 
           anchor: '60%' 
          }, { 
           xtype: 'textfield', 
           labelAlign: 'top', 
           fieldLabel: 'Password', 
           inputType: 'password', 
           name: 'password', 
           id:'password', 
           allowBlank: false, 
           padding: '0 0 10 0', 
           anchor: '60%' 
          }] 
        }] 
      }], 
     buttons: [{ 
       text: 'Login', 
       handler: function() 
       { 
        Ext.Ajax.request({ 
         url: '/TestSystem/LoginServlet', 
         method: 'POST' 
        }); 
        var formData = this.up('form').getForm(); 
        formData.submit(); 
       } 
      }, 
      { 
       text: 'Reset Form', 
       handler: function() { 
        this.up('form').getForm().reset(); 
       } 
      }] 
    }); 

    var login_panel = new Ext.Panel({ 
     region: 'center', 
     align: 'stretch', 
     title: 'Test Automation', 
     items: [login_details] 
    }); 

    Ext.create('Ext.container.Viewport', { 
     layout: 'fit', 
     items: [{ 
       layout: 'border', 
       defaults: { 
        collapsible: false, 
        collapsed: false, 
        split: false, 
        bodyStyle: 'padding:2px' 
       }, 
       items: [{ 
         region: 'north', 
         height: 150, 
         minSize: 75, 
         maxSize: 250, 
         cmargins: '0 0 0 0', 
         border: false 
        }, { 
         region: 'west', 
         width: 450, 
         minSize: 100, 
         maxSize: 250, 
         border: false 
        }, { 
         region: 'center', 
         align: 'stretch', 
         border: false, 
         layout: { 
          type: 'fit', 
          align: 'stretch' 
         }, 
         items: [login_panel] 
        }, 
        { 
         region: 'east', 
         width: 450, 
         minSize: 100, 
         maxSize: 150, 
         bodyStyle: 'padding:0px', 
         border: false 
        }, 
        { 
         region: 'south', 
         width: 225, 
         height: 300, 
         minSize: 100, 
         maxSize: 250, 
         bodyStyle: 'padding:0px', 
         border: false 
        } 
       ] 
      }], 
     renderTo: Ext.getBody() 
    }); 
} 
}); 

LoginServlet.java

package servlet; 

import java.io.IOException; 
import javax.servlet.ServletException; 
import javax.servlet.annotation.WebServlet; 
import javax.servlet.http.HttpServlet; 
import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 
import javax.servlet.http.HttpSession; 

/** 
    * @author Bijoy 
*/ 

@WebServlet(description = "Servlet used to validate users", urlPatterns = { "/LoginServlet" }) 
public class LoginServlet extends HttpServlet { 

private static final long serialVersionUID = 1L; 

@Override 
protected void doPost(HttpServletRequest request, HttpServletResponse response) 
     throws ServletException, IOException { 

    response.setContentType("text/html"); 

    String username = request.getParameter("username"); 
    String password = request.getParameter("password"); 
    System.out.println("Username from UI : " + username); 
    System.out.println("Password from UI : " + password); 
    } 
} 

Ich verwende ExtJS-4.2.2

Answer 1

Sie benötigen keine ajax-Anfrage, um Ihr Formular einzureichen.

Alles, was Sie brauchen, ist form.submit() mit der URL-Konfiguration.

einreichen (Optionen): Ext.form.Basic verkettbar Abkürzung zu tun eine Aktion vorzulegen. Dies wird standardmäßig die AJAX-Übermittlungsaktion verwenden. Wenn die standardSubmit-Konfiguration aktiviert ist, verwendet sie ein Standardformularelement zum Senden, oder wenn die api-Konfiguration vorhanden ist, wird sie die Ext.direct.Direct-Übermittlungsaktion verwenden.

var formData = this.up('form').getForm(); 
    formData .submit({ 
     clientValidation: true, 
     url: '/TestSystem/LoginServlet', 
     success: function(form, action) { 
      Ext.Msg.alert('Success', action.result.msg); 
     }, 
     failure: function(form, action) { 
      switch (action.failureType) { 
       case Ext.form.action.Action.CLIENT_INVALID: 
        Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values'); 
        break; 
       case Ext.form.action.Action.CONNECT_FAILURE: 
        Ext.Msg.alert('Failure', 'Ajax communication failed'); 
        break; 
       case Ext.form.action.Action.SERVER_INVALID: 
        Ext.Msg.alert('Failure', action.result.msg); 
      } 
     } 
    }); 

Answer 2

Versuchen Sie mit folgenden Code

{ 
      text: 'Login', 
      handler: function() 
      { 
       var formData = this.up('form').getForm(); 
       formData.submit({ 
         url: '/TestSystem/LoginServlet', 
         method: 'POST', 
         success: function(form,action){ 
         // your success code once servelt returns response 
         }, 
         failure: function(form,action){ 
         } 

       }); 
      } 

Handler zu ändern

sende es selbst wird aja tun x Anfrage.