PDA

View Full Version : Newbie to EXT-GWT. how to get started



alka_jan1980
3 Dec 2008, 9:38 PM
i want to wrtie a demo for login page ... i dont know how to start.

zaccret
4 Dec 2008, 2:25 AM
I think the simplest way is to put a FormPanel in the Viewport which should use a CenterLayout.

alka_jan1980
4 Dec 2008, 3:07 AM
import java.util.HashMap;
import java.util.Map;

import com.extjs.gxt.ui.client.Style.HorizontalAlignment;
import com.extjs.gxt.ui.client.widget.DataList;
import com.extjs.gxt.ui.client.widget.LayoutContainer;
import com.extjs.gxt.ui.client.widget.VerticalPanel;
import com.extjs.gxt.ui.client.widget.button.Button;
import com.extjs.gxt.ui.client.widget.form.FormPanel;
import com.extjs.gxt.ui.client.widget.form.TextField;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.core.client.GWT;
import com.google.gwt.user.client.rpc.AsyncCallback;
import com.google.gwt.user.client.rpc.ServiceDefTarget;
import com.google.gwt.user.client.ui.RootPanel;
import com.gwtext.client.core.EventObject;
import com.gwtext.client.widgets.MessageBox;
import com.gwtext.client.widgets.event.ButtonListenerAdap ter;
import com.gwtext.client.widgets.form.Form;

publicclass abcEntry extends LayoutContainer implements EntryPoint {


private VerticalPanel vp;
private FormPanel formPanel= new FormPanel();
private TextField<String> firstName=null;
private TextField<String> password =null;
private Button loginButton = null;
private Button cancelButton= null;



public abcEntry() {
vp = new VerticalPanel();
vp.setSpacing(10);
this.createForm1();

}

@SuppressWarnings("unchecked")
privatevoid createForm1() {


final abcServiceAsync palmLoginService=(abcServiceAsync)GWT.create(abcService.class);
ServiceDefTarget endpoint=(ServiceDefTarget)abcLoginService;
String moduleRelativeURL=GWT.getModuleBaseURL()+"abclogin";
endpoint.setServiceEntryPoint( moduleRelativeURL );

this.setLoginPanel();

final AsyncCallback callback = new AsyncCallback()
{
publicvoid onSuccess( Object result ) {
// take the result coming from the server
boolean ok = Boolean.valueOf( result.toString() ).booleanValue();
if( ok )
{
MessageBox.alert( "Success", "Successfully logged in!");
}
else
{
MessageBox.alert( "Invalid", "Wrong username or password");
}
}

publicvoid onFailure( Throwable caught ) {
MessageBox.alert( "Error", "Error while logging in" );
}
};
loginButton = new Button( "Login" );
cancelButton = new Button( "Cancel");
loginButton.addListener( new ButtonListenerAdapter(){

publicvoid onClick( Button button, EventObject e ){
Map loginData = getUserData( formPanel.getForm() );
abcLoginService.userIsValid( loginData, callback );
}
});



//-------
formPanel .setButtonAlign(HorizontalAlignment.CENTER);
formPanel .addButton(loginButton);
formPanel .addButton(cancelButton);

formPanel .setStyleName("background-color:#EEEEEE");
vp.add(formPanel );
vp.setHeight(250);
}

// setup login panel

privatevoid setLoginPanel() {
// TODO Auto-generated method stub
formPanel .setHeading("User Login");
formPanel .setFrame(true);
formPanel .setWidth(350);

firstName = new TextField<String>();

firstName.setFieldLabel("User Name");
firstName.setAllowBlank(false);
formPanel .add(firstName);

password = new TextField<String>();
password.setFieldLabel("Password");
password.setPassword(true);
password.setAllowBlank(false);

formPanel .add(password);

}

// prepare data for sending to the server
private Map getUserData( Form form )
{
String formValues = form.getValues();
Map loginData = new HashMap();
String[] nameValuePairs = formValues.split( "&" );
for (int i = 0; i < nameValuePairs.length; i++) {
String[] oneItem = nameValuePairs.split( "=" );
loginData.put( oneItem[0], oneItem[1] );
}
return loginData;
}



publicvoid onModuleLoad()
{

vp.setHeight(100);
RootPanel.[I]get("login").add(vp);

}
}

http://extjs.com/forum/images/misc/progress.gif

alka_jan1980
4 Dec 2008, 3:08 AM
i cannot add the buttons and can get the data from the text box

zaccret
4 Dec 2008, 5:20 AM
import com.gwtext. ???

zaccret
4 Dec 2008, 9:30 AM
I mean you are mixing Ext GWT (com.extjs.gxt) and GWT-Ext (com.gwtext). This is the forum for Ext GWT, I don't think you'll find help about GWT-EXT widgets.