JSFiddle - React, Tailwind, and code Playground
by HYEONGJINKIM
HTML
<input type="text" id="loginId" />
<input type="password" id="loginPassword" />
<button id='loginBtn'>click</button>
<div id="loginStatus"></div>
JavaScript
// 사용자 로그인을 받아 로그인 상태를 노출할 목적으로 잡은 구조
var emart = emart || {};
emart.Model = emart.Model || {};
emart.View = emart.View || {};
emart.Presenter = emart.Presenter || {};
emart.Model.Login = function () {
this.init();
};
emart.View.Login = function () {
this.init();
};
emart.Presenter.Login = function (options) {
$.extend(this, options || {});
this.init();
};
emart.Model.Login.prototype = {
_sLoginUrl : null,
init: function(){
this._sLoginUrl = 'http://jsfiddle.net/echo/jsonp/';
},
enterUser : function(sId, sPassword){
var sLoginUrl = this._sLoginUrl;
var htLoginData = {
id: sId,
password: sPassword,
result: true
};
return $.ajax({
type: "get",
url: sLoginUrl,
data: htLoginData,
dataType: "jsonp"
});
}
};
emart.View.Login.prototype = {
_welLoginId : null,
_welLoginPassword : null,
_welLoginBtn : null,
_welLoginStatus : null,
init: function(){
this._assignElement();
},
_assignElement : function(){
this._welLoginId = $("#loginId");
this._welLoginPassword = $("#loginPassword");
this._welLoginBtn = $("#loginBtn");
this._welLoginStatus = $("#loginStatus");
},
printStatus : function(sResult){
this._welLoginStatus.html(sResult);
}
};
emart.Presenter.Login.prototype = {
init: function(){
this._attachEventHandlers();
},
_attachEventHandlers : function(){
this.view._welLoginBtn.on("click", $.proxy(this._onClickLoginBtn, this));
this.view._welLoginId.on("keypress", $.proxy(this._onKeyPressLoginId, this));
this.view._welLoginPassword.on("keypress", $.proxy(this._onKeyPressLoginPassword, this));
},
_onClickLoginBtn : function(){
var sId = this.view._welLoginId.val();
var sPassword = this.view._welLoginPassword.val();
...