jQuery MiniUI

标题: 哪位高手给出Thinkphp和miniui表单提交和查询的例子 [打印本页]
作者: 0938cs    时间: 2012-10-9 09:47:56     标题: 哪位高手给出Thinkphp和miniui表单提交和查询的例子

哪位高手给出Thinkphp和miniui表单提交和查询的例子，感谢！
作者: niko    时间: 2012-10-9 09:59:35

先用Thinkphp实现普通的ajax和Json交互的示例。
比如你自己找一个jquery的ajax加载thinkphp的文章等。
然后用miniui的url指向此地址即可。

作者: 0938cs    时间: 2012-10-9 10:07:19

能给出详细的示例吗?谢谢！
作者: 0938cs    时间: 2012-10-9 10:16:36

初次接触jquery和Thinkphp , 心血来潮就结合这两个做了个登陆的例子 :
  
页面代码:

<div align="center">
   <p>用户名：
     <input type="text" name="lid" id="lid" />
   </p>
   <p>密码：
   <input type="text" name="pwd" id="pwd" />
   </p>  
   <p>
     <input type="submit" name="loginbt" id="loginbt" value="登 陆" />
   </p>
   <p><div id="state" name="state"></div></p>
</div>



Javascript代码有两种方法)


    $(document).ready(function(){
         $('#loginbt').click(function(){
             // case one :
             $.ajax({
                 type:"OST",
                 url:"../index.php/index/doAjax",
                 data:{lid('#lid').val(),pwd('#pwd').val()},
                 success:function(msg){
                             $('#state').html(msg);
                         }           
             });   
             // case two:
             /*
             $.post("../index.php/index/doAjax",{lid('#lid').val(),pwd('#pwd').val()},function(msg){
                 $('#state').html(msg);
             });
             */
         });
     });




后台php代码:



class IndexAction extends Action
{
     public function index()
     {

    }
     
     public function doAjax()
     {
         $lid=$_POST["lid"];
         $pwd=$_POST["pwd"];
         if($lid==""||$pwd=="")
                 echo '用户名或密码为空！';
         else
         {
             if($lid=="admin" && $pwd=="admin")
                     echo '登陆成功！';
             else
                     echo '登陆失败！';
         }
     }
}
作者: 0938cs    时间: 2012-10-9 10:18:54

0938cs 发表于 2012-10-9 10:16
初次接触jquery和Thinkphp , 心血来潮就结合这两个做了个登陆的例子 :
  
页面代码:

请管理员看是否正确？
作者: 0938cs    时间: 2012-10-9 10:23:11

网官方多给出Thinkphp和miniui例子一并放到论坛或下载！
作者: factory    时间: 2012-10-9 10:43:29

0938cs 发表于 2012-10-9 10:23
网官方多给出Thinkphp和miniui例子一并放到论坛或下载！

你只需要前台获取到miniui控件的值,其他的只需要正常使用ajax提交到后台进行判断即可了
请参考MINIUI对应控件的API,上面有各种属性方法事件的
作者: lonm    时间: 2012-10-9 16:32:07

很简单啊

提交数据
miniui代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5.     <title>{$Think.config.site_name}</title>
  6.     <meta http-equiv="content-type" content="text/html; charset=UTF-8" />

  8.     <css href="__PUBLIC__/Css/main.css" />
  9.     <js href="__PUBLIC__/Js/boot.js"/>

  11. </head>
  12. <body>
  13.     <form id="form1" method="post">
  14.         <input name="department_id" class="mini-hidden" value="{$Dept.dept_id}"/>
  15.         <div style="padding-left:11px;padding-bottom:5px; padding-top: 10px; padding-right: 10px;">
  16.             <table style="table-layout:fixed;" cellspacing="5">
  17.                 <tr>
  18.                     <td style="width:70px;">部门名称：</td>
  19.                     <td style="width:150px;">   
  20.                         <input name="dept_name" class="mini-textbox" required="true" value="{$Dept.dept_name}"/>
  21.                     </td>
  22.                 </tr>
  23.                 <tr>
  24.                     <td >部门描述：</td>
  25.                     <td >
  26.                         <input name="dept_desc" class="mini-textarea" style="width:350px; height: 80px;" value="{$Dept.dept_desc}"/>
  27.                     </td>
  28.                 </tr>
  29.             </table>
  30.         </div>

  32.         <div style="text-align:center;padding:10px;">               
  33.             <a class="mini-button" onclick="onOk" style="width:60px;margin-right:20px;">确定</a>      
  34.             <a class="mini-button" onclick="onCancel" style="width:60px;">取消</a>      
  35.         </div>        
  36.     </form>

  38.     <script type="text/javascript">
  39.         mini.parse();
  40.         var form = new mini.Form("form1");
  41.         function SaveData() {
  42.             var o = form.getData();
  43.             form.validate();
  44.             if (form.isValid() == false) return;
  45.             $.ajax({
  46.                 type:"post",
  47.                 url: "__APP__/Department/updateDepartment",
  48.                 data: o,
  49.                 cache: false,
  50.                 success: function (text) {
  51.                     CloseWindow("save");
  52.                 },
  53.                 error: function (jqXHR, textStatus, errorThrown) {
  54.                     alert(jqXHR.responseText);
  55.                     CloseWindow();
  56.                 }
  57.             });
  58.         }
  59.     </script>
  60. </body>
  61. </html>
复制代码
Thinkphp代码
  1. public function updateDepartment() {
  2.         if($_REQUEST['department_id']){
  3.             $data['dept_name'] = $_REQUEST['dept_name'];
  4.             $data['dept_desc'] = $_REQUEST['dept_desc'];

  6.             $Depts = D('Dept');
  7.             $vo= $Depts->where('dept_id = ' .$_REQUEST['department_id'])->save($data);
  8.             if($vo){
  9.                 $this->ajaxReturn($vo,'部门信息已更新!)',1);
  10.             }else{
  11.                 $this->ajaxReturn(0,'部门信息更新失败!',0);
  12.             }
  13.         }
  14.     }
复制代码
作者: lonm    时间: 2012-10-9 16:35:42

查询就更简单了
thinkphp查询的结果数组转成json返回就可以了
  1. //读取部门列表
  2.     public function GetDepartmentList() {
  3.         $Depts = D('Department');
  4.         $DeptL1 = $Depts->order('id asc')->select();
  5.         $s = json_encode($DeptL1);
  6.         echo $s;
  7.     }
复制代码




欢迎光临 jQuery MiniUI (http://miniui.com/discuss/) Powered by Discuz! X2