투비교육포털앱의 로그인 화면 입니다.

로그인은 회원(인터넷 신청)과 비회원(영업대표 신청) 두가지 방식으로 로그인을 처리하고 로그인 정보를 기억하는 기능이 구현되어 있습니다.

화면구성

소스참고
EduHub\mobile\Mobile_frmLogin.xfdl

log_1

1 Tab
두가지 로그인 방식을 제공하기 위해 Tab 컴포넌트를 배치하여 입력 받는 컴포넌트를 컨트롤 합니다.

2 3. Edit
사용자 아이디와 패스워드를 입력 받습니다.
회원 로그인 경우 아이디와 패스워드, 비회원 로그인 경우 성명과 이메일 정보를 이용합니다.

4 Static
사용자가 입력한 값에 대해 정합성 체크하여 오류 발생을 표현할 메시지를 입니다.

5 Checkbox
사용자 아이디와 패스워드 정보를 기억하는 기능을 처리합니다.

6 Button
서버와 통신하여 로그인 처리를 합니다.

주요 기능 구현 설명

TabPage가 선택될 때 Edit 컴포넌트의 displaynulltext 와 password 속성을 로그인 방식에 따라 변경 합니다.

this.tabTitle_onchanged = function(obj:nexacro.Tab,e:nexacro.TabIndexChangeEventInfo)
{  
    ...
	if(this.tabTitle.tabindex == 0){    
		this.edtUserId.set_displaynulltext("LoginID");
		this.edtPasswd.set_displaynulltext("Password");
		this.edtPasswd.set_password(true);	
	} 
    else {  
		this.edtUserId.set_displaynulltext("성명");
		this.edtPasswd.set_displaynulltext("이메일주소");
		this.edtPasswd.set_password(false);
	}
    ...
};

사용자ID 또는 패스워드의 입력 값을 체크하여 미 입력시 Static 컴포넌트에 안내 메시지를 출력 합니다.

if((this.edtUserId.value == undefined) || (this.edtUserId.value.length == 0))
{
	this.stLoginId.set_text("LoginID를 입력하세요.");
	this.stLoginId.set_visible(true);
	this.edtUserId.setFocus();
	return;  
}

모바일에서 alert을 통한 메시지 처리는 사용자 경험에 불편함을 발생할 수 있어 Static에 메시지를 표현하는 방법으로 구현

서버와 통신하여 로그인 처리를 합니다.
로그인 정보를 가지는 Dataset은 Global 영역에 정의하여 사용합니다.

this.fn_login = function()      
{	   
	...	
	var strSvcId    = "LoginInfo";
	var strSvcUrl   = "ServiceUrl::EduSqlManager/JspAgent.jsp"; 
	var inData      = "";       
	var outData     = "gdsUserInfo=output gdsUserEduList=output2";
	var strArg      = args;        
	var callBackFnc = "fnCallback";
 
	this.gfn_xtransCommon(strSvcId,
						  strSvcUrl,
						  inData,
						  outData,
						  strArg,
						  callBackFnc,
						  true);
	...	
};

로그인 정보 기억하기
로그인이 정상적으로 처리 되고 "로그인정보기억" 체크가 되어 있는 경우 사용자 ID와 패스워드 정보를 개인화 데이터로 저장합니다.

this.fn_setInfo = function()   
{ 
	if(this.chkSaveFlag.value == true)
	{
		nexacro.setPrivateProfile("EduHub_LoinID",this.edtUserId.value);
		nexacro.setPrivateProfile("EduHub_LoinPwd",this.edtPasswd.value);
		nexacro.setPrivateProfile("EduHub_chkSaveFlag",this.chkSaveFlag.value);
	} 
    else 
    { 
		nexacro.setPrivateProfile("EduHub_LoinID","");
		nexacro.setPrivateProfile("EduHub_LoinPwd","");     
		nexacro.setPrivateProfile("EduHub_chkSaveFlag",false);  
	}   
    ...
}

nexacro.setPrivateProfile( strKey, varVal )

어플리케이션에서 개인화 데이터를 저장하는 메소드로

개인화 데이터는 어플리케이션이 구동될 때 설정한 Key 값 별로 따로 관리되며 "nexacro.xml" 파일에 저장됩니다

로그인 정보 가져오기
화면이 로드된 후 개인화 데이터에 저장되어 있는 사용자ID와 패스워드 정보를 로그인 화면에 표현 합니다.

this.frmLogin_onload = function(obj:nexacro.Form,e:nexacro.LoadEventInfo) 
{
	var EduHub_LoinGubun = nexacro.getPrivateProfile("EduHub_LoinGubun");  
	var EduHubLoinID = nexacro.getPrivateProfile("EduHub_LoinID");
	var EduHubLoinPwd = nexacro.getPrivateProfile("EduHub_LoinPwd");
    ...
	this.edtUserId.set_value(EduHubLoinID);
	this.edtPasswd.set_value(EduHubLoinPwd);
	this.chkSaveFlag.set_value(true);
    ...
}

nexacro.getPrivateProfile( strKey )

어플리케이션에서 저장한 개인화 데이터를 반환하는 메소드입니다.

참고사항

회원 가입은 어디서 등록이 가능한가요?

'투비교육포털'에서는 별도의 회원가입 신청을 하지 않습니다. 
해당 회원정보는 투비소프트 고객지원팀에서 운영하는 기술지원사이트 
http://support.tobesoft.co.kr 에서 등록된 정보를 활용합니다.