北京天宇联科技有限责任公司-T语言开发平台前端开发指南

            T语言的英文简称为ttyuPlat,ttyuPlat是基于SOA架构体系。全新的T语言是简单易用的语法,多语言语法编写,T的代码看起来就是像一篇文章一样,简单易懂,可以让人细细品尝,T语言是易于使用的一个简单软件开发工具,不需要编程基础就可以快速的开发软件工具,T语言带来的是一个人人可开发软件的理念。

       T语言平台在前端开发前,要根据以下6个步骤进行开发:步骤1.定义适用范围;步骤2.引用ttyu.commom2.js文件;步骤3.设置同步还是异步调用;步骤4.服务地址/接口初始化;步骤5.数据展示;步骤6.数据插入。如下

        1)定义(适用范围)

     web前端是指由html/htm静态页组成的而不是由模板生成的各种复杂页面,包括html5页面。一般是ui设计出效果图后由web前端工程师生成的与数据库无关的全由“死数据”组成的页面。页面样式基本已生成,下一步工作就是与动态交互,读写数据库的内容(一般由接口调用完成)。

       2)每个页的head部需要调用平台通用方法的ttyu.common2.js文件

                  ttyu.common2.js用到了jquery的方法,所以调用前先要调用jquery.min.js

                 示例:

                <head>

                       <script><scriptsrc=“http://tty.net/file/js/jquery.min.js” type=“text/javascript”></script>

                      <script><scriptsrc=“http://tty.net/file/js/ttyu.commons.js” type=“text/javascript”></script>

              </head>

              注:js文件可以是服务器上的也可是本地的。

               ttyu.common1.js版本号为1的是没有跨域功能的同步方法

              ttyu.common2.js版本号为2的是有跨域功能的异步方法

             说明:你也可把js文件下载到本地项目中,直接引用本地的js文件。如:

             <head>

                     <script><script src=“js/jquery.min.js” type=“text/javascript”></script>

                      <script><script src=“js/ttyu.common2.js” type=“text/javascript”></script>

          </head>

        3)设置同步还是异步调用

            同步:是指调用服务器的接口在本地完成,接口程序与html页面在同一站点下。

        异步:是指调用服务器的接口可能不在本地,是通过远程访问完成的,接口程序与html页面在不同的站点下。异步要通过回调方法获取返回的值。而同步方式可直接返回调用接口的值。

如果html页面与服务接口放在一起建议用同步方式。

在ttyu.common2.js里的第一行

 var rootUrl = "", serverUrl ="", iscallback = true, callbackReturn = '';

 找到 iscallback = true ,默认为 iscallback = false;

      4)服务地址/接口初始化

            在web页首页(一般是index.htm/login.htm)启动时要指定服务地址,以方便以后所有操作通过接口读写数据库,进行动态交互。

       假设.net服务由xx.aspx文件传递接口

       server.aspx:平台通用接口,如果项目中没有特别需要编写的业务接口可直接调用此服务。

       调用方法是在initServer()方法里通过ttyu.initServerUrl()指定服务地址

 

     5)数据展示

      页面中有些地方只是需要数据展现出来而不需要编辑。数据展现有的是多行显示,有的是一行显示。

      

       上面是一个列表,显示9条数据,这些数据来自数据库表Sys_BaseData_Doc的字段Title。

显然9条数据的样式都相同,只是内容(Title)不同。这9条数据是由一条数据重复组合而成。当点击每行时才显示明细,这里要知道各行的唯一标识即id, 所以只需要取出id与Title的数据,当然一般是取出最后9行。

这里通过平台的keys指定数据源:keys='sql=select top 9 id,Title fromSys_BaseData_Doc where ParentID=108 order by id desc'

      sql表示是调用标准的sql语句

      每行的id通过@id@表示变量将被实际的id替换,<!--Title-->表示要显示的内容变量,即表Sys_BaseData_Doc的字段Title。

示例:

    <divclass="imgBox taxL2" style="line-height:24px;"keys='sql=select top 9 id,Title from Sys_BaseData_Doc where ParentID=108 orderby id desc'>

    <ahref="html/mediaInfor2.html?id=@id@ "rget="_blank"><!--Title--></a>

 </div>

注:1.变量名必须与字段名完全相同,且区分大小写。2. keys键在父容器 (一般是div/table)中指定。3.循环部分一般只需要一行,在此行中按规则指定字段。


上面要显示当前用户的名称,显示只是一条数据,数据来自数据库的表sys_user_users的字段NAME。

这里通过平台的keys指定数据源:keys="getRowBySql&sql=select NAME from sys_user_users where id =23"

sql表示是调用标准的sql语句

表示要显示的内容变量,即表sys_user_users的字段NAME。

   示例1:

  <div  class="hTeBox"keys="getRowBySql&sql=select NAME from sys_user_users where id =23">

        <span>用户:</span><span><!--NAME--></span>

</div>

   示例2:显示表的多个字段

 

<div  class="hTeBox"keys="getRowBySql&sql=select * from sys_user_users where id =23">

<p><span>用户:</span><span><!--NAME--></span></p>

         <p><span>单位:</span><span><!--DEPTNAME--></span></p>

         <p><span>职务:</span><span><!--POSITION--></span></p>

         <p><span>座位:</span><span><!--AREA--></span></p>

         <p><span>电话:</span><span><!--DUTYPHONE--></span> <a href="#">[修改]</a></p>                       

         <p><span>座机:</span><span><!--PHONE--></span> <a href="#">[修改]</a></p>                        

         <p><span>传真:</span> <span><!--FAX--></span><a href="#">[修改]</a></p>                  

      6)数据插入

       参考:ttyu

      用户输入数据,平台把界面数据插入到数据库的表中。

          1.命名父容器的id,如ul1. 

          2.命名各子控件id,与表对应的字段名相同。如日期控件关联'REDATE' 字段 <inputname='REDATE'  >

          3.在触发按钮的单击事件上增加“save()”方法<a href="javascript:" οnclick="save()">提交</a>

          4.编写save()调用ttyu.insert().insert的四个参数分别是容器id,表名,参数和回调方法。

          5.save()也可调用ttyu.server.containerServiceJsonp.containerServiceJsonp的三个参数分别是容器id,参数和回调方法。


     function save() {

          ttyu.insert('ul1','sys_user_news','TYPE=值班日志&NETTYPE=值班日志',function (result) {

               alert("插入日志成功!");

        });

     }

     function save() {

           ttyu.server.containerServiceJsonp('ul1','action=insert&tableName=sys_user_news&TYPE=值班日志&NETTYPE=值班日志',function (result) {

            alert("插入日志成功!");

        });

    }

 

注:1.参数值不要加引号’’ 如TYPE=值班日志。2.可用隐藏控件赋值 ,常在页面装载后给这些隐藏控件赋值。

      7)数据更新

       参考:ttyu

   

       functionsave() {

            varuserId = ttyu.user.getUserId();

            varkeys = "love=" + love.trimEnd(',') + "&PicName=" +PicName;

            ttyu.update('ul1','Sys_User_Users', 'id=' + userId, keys,function (result) {

                 alert("更新用户成功!");

        });

     }

      functionsave() {

           ttyu.server.containerServiceJsonp('ul1','action=update&tableName=Sys_User_Users&where=id=100&TYPE=值班日志&NETTYPE=值班日志', function (result) {

              alert("更新用户成功!");

        });

    }

 

注:1.参数值不要加引号’’ 如TYPE=值班日志。2.可用隐藏控件赋值 ,常在页面装载后给这些隐藏控件赋值。

      8)删除数据

        参考:ttyu

       用户输入数据,平台把界面数据插入到数据库的表中。

           1.命名父容器的id,如ul1. 

           2.命名各子控件id,与表对应的字段名相同。如日期控件关联'REDATE' 字段 <inputname='REDATE' >

           3.在触发按钮的单击事件上增加“save()”方法<a href="javascript:" οnclick="save()">提交</a>

           4.编写save()调用ttyu.update().update的五个参数分别是容器id,表名,表更新条件,参数和回调方法。

           5.save()也可调用ttyu.server.containerServiceJsonp.containerServiceJsonp的三个参数分别是容器id,参数和回调方法。

          function save() {

              var userId = ttyu.user.getUserId();

             var keys = "love=" +love.trimEnd(',') + "&PicName=" + PicName;

              ttyu.update('ul1', 'Sys_User_Users','id=' + userId, keys,function (result) {

                    alert("更新用户成功!");

           });

     }

         functionsave() {

           ttyu.server.containerServiceJsonp('ul1','action=update&tableName=Sys_User_Users&where=id=100&TYPE=值班日志&NETTYPE=值班日志',function (result) {

                alert("更新用户成功!");

        });

    }

 

注:1.参数值不要加引号’’ 如TYPE=值班日志。2.可用隐藏控件赋值 ,常在页面装载后给这些隐藏控件赋值。

function loadAfter () {

       //$("#REDATE").val(ttyu.date.getDateTime());

        $("#REDATE").val('2016年5月20');

        $("#TITLE").val('2016年5月20日志');      

    }

 

 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值