PDA

View Full Version : Auto complete login form



Bezge
22 Jun 2009, 1:03 AM
Hello,

I'd like to have my browser to store the login credentials and to auto complete the login form of my application. So far i've realized that the login form needs to be contained in the main html page and not be added by javascript (gxt). Never the less i'd like to have the validation functionality of gxt TextFields (e.g. to check for proper length of password or non-empty fields). Is there a way to reuse existing <input> tags for TextFields?

example index.html:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>my app</title>

<!-- Stylesheet for ext-gwt -->
<link rel="stylesheet" type="text/css" href="gxt/css/gxt-all.css"></link>
</head>
<body>
<form id="login">
<input id="username" type="text">
<input id="password" type="password">
<input type="submit" value="login">
</form>

<!-- load module javascript -->
<script language="javascript" src="MyApp/MyApp.nocache.js"></script>
</body>
</html>example entry point:



import com.extjs.gxt.ui.client.widget.form.TextField;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.dom.client.Document;
import com.google.gwt.user.client.Command;
import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.ui.FormPanel;

public class MyApp implements EntryPoint {

TextField<String> username;
TextField<String> password;

public void onModuleLoad() {
FormPanel loginForm = FormPanel.wrap(Document.get().getElementById("login"));
loginForm.setAction("javascript:__login()");
injectFunction("__login", new Command() {

@Override
public void execute() {
sendLoginRequest();
}
});

// this field should use the input tag with id username
username = new TextField<String>();
username.setMinLength(8);
username.setAllowBlank(false);
username.setAutoValidate(true);
username.setEmptyText("enter username");

// this field should use the input tag with id password
password = new TextField<String>();
password.setMinLength(8);
password.setAllowBlank(false);
password.setPassword(true);
password.setAutoValidate(true);
password.setEmptyText("enter password");
}

private native void injectFunction(String name, Command cmd) /*-{
tmpwin = $wnd;
tmpcallback = function () {
cmd.@com.google.gwt.user.client.Command::execute()();
};
eval("tmpwin."+name+"=tmpcallback");
}-*/;

}

Bezge
23 Jun 2009, 7:28 AM
I found a solution which works for firefox but not for IE



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>my app</title>

<!-- Stylesheet for ext-gwt -->
<link rel="stylesheet" type="text/css" href="gxt/css/gxt-all.css"></link>
</head>
<body>
<form id="login" action="javascript:__login()">
<input id="username" type="text">
<input id="password" type="password">
<input type="submit" value="login">
</form>

<!-- load module javascript -->
<script language="javascript" src="MyApp/MyApp.nocache.js"></script>
</body>
</html>

public class MyApp implements EntryPoint {

TextField<String> username;
TextField<String> password;

public void onModuleLoad() {
injectFunction("__login", new Command() {

@Override
public void execute() {
sendLoginRequest();
}
});

// this field should use the input tag with id username
username = new TextField<String>() {
@Override
protected void onRender(Element target, int index) {
if (el() == null) {
setElement(Document.get().getElementById("username"));
}
super.onRender(target, index);
}
};
username.setMinLength(8);
username.setAllowBlank(false);
username.setAutoValidate(true);
username.setEmptyText("enter username");
username.render(RootPanel.get("login").getElement());
ComponentHelper.doAttach(username);

// this field should use the input tag with id password
password = new TextField<String>();
password.setMinLength(8);
password.setAllowBlank(false);
password.setPassword(true);
password.setAutoValidate(true);
password.render(RootPanel.get("login").getElement());
ComponentHelper.doAttach(password);
}

private native void injectFunction(String name, Command cmd) /*-{
tmpwin = $wnd;
tmpcallback = function () {
cmd.@com.google.gwt.user.client.Command::execute()();
};
eval("tmpwin."+name+"=tmpcallback");
}-*/;

private void sendLoginRequest() {
String un = username.getValue();
String pw = password.getValue();
// do the login stuff ...
}
}

harun
21 Mar 2012, 1:52 AM
Is there any progress for Internet explorer and Chrome?

it is too boring...