When I read the blog of Allessandro Spadoni(BSP mobile logon screen using jQuery Mobileabout how to build a login-screen optimized for mobile devices, I thought about my last project, where we have to build a very fancy logon-screen. I spoke to him, if I can reuse his example and here I present you, how you implement a new logon-screen with less effort and more flexibility.
<link href=”http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css” mcehref=”http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css” rel=”stylesheet”/>
<script src=”http://code.jquery.com/jquery-1.6.4.min.js” mcesrc=”http://code.jquery.com/jquery-1.6.4.min.js“/>
<script src=”http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js” mcesrc=”http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js“/>
Custom Logon using jQueryMobile
Messages
Footer content
</div>
<!– /footer –>
</div>
<!– /page –>
</body>
</html>
</xsl:template>
<!– Message processing –>
<xsl:template match=”asx:abap/asx:values/MSG”>
<div mcetmp=”1″>
METHOD htm_login.
-
Create HTML Login-Page
CALL TRANSFORMATION zxslt_icflogin
SOURCE msg = m_logmessages
type = ‘LOGON’
mandt = sy-mandt
langu = sy-langu
javascript = iv_javascript
hiddenfields = iv_hidden_fields
application = m_sap_application
RESULT XML rv_html.
ENDMETHOD.
<div mcetmp=”1″>
Thanks for sharing,
Mark