jQuery EasyUI学习

1、通过form页面元素数据填充

$(‘#<?php echo NS;?>form‘).form(‘load‘,<?php echo json_encode($orm->as_array());?>);//loadYiXia

试图页源码:

<form id="<?php echo NS;?>form" method="post" enctype="multipart/form-data" onsubmit="return <?php echo NS;?>submit();" style="margin:0;padding:10px 50px">
    <div style="margin:5px">
        <input id="<?php echo NS;?>web" name="platform" style="width:300px;"
        data-options="label:‘*站点:‘,prompt:‘选择站点‘,required:true" />
    </div>
    <div style="margin:5px">
        <input class="easyui-textbox" name="name" style="width:300px;"
               data-options="label:‘*广告位置:‘,prompt:‘广告位置‘,required:true" />
    </div>
    <div style="margin:5px">
        <input class="easyui-textbox" name="node" style="width:300px;"
        data-options="label:‘*标识名称:‘,prompt:‘标识名称,例:aa_bb_1,_aa_bb_1‘,required:true" />
    </div>
    <div style="margin:5px">
        <input class="easyui-numberbox" name="width" style="width:300px;"
        data-options="label:‘*宽度:‘,prompt:‘建议宽度(单位:像数)‘,required:true" />
    </div>
    <div style="margin:5px">
        <input class="easyui-numberbox" name="height" style="width:300px;"
        data-options="label:‘*高度:‘,prompt:‘建议高度(单位:像数)‘,required:true" />
    </div>
    <div style="margin:5px">
        <input class="easyui-textbox" name="nopic" style="width:300px;"
        data-options="label:‘默认图片:‘,prompt:‘默认广告图‘,required:false" />
    </div>
    <div style="margin:5px">
        <input class="easyui-textbox" name="remark" style="width:300px;"
               data-options="label:‘备注:‘,prompt:‘备注‘,required:false" />
    </div>
</form>

<script type="text/javascript">
$(document).ready(function(){

   $(‘#<?php echo NS;?>form‘).form(‘load‘,<?php echo json_encode($orm->as_array());?>);//loadYiXia

    //站点选择
    $(‘#<?php echo NS;?>web‘).combobox({
        valueField: ‘id‘,
        textField: ‘name‘,
        panelHeight: 180,
        editable: false,
        data:<?php echo $web;?>,
        onLoadSuccess:function(){
        }
    });

    //下拉框展开收缩动画
   $(‘#<?php echo NS;?>web‘).combobox(‘panel‘).panel({
       openAnimation:‘slide‘,
       closeAnimation:‘hide‘
   });
});

function <?php echo NS;?>submit()
{
    $.ajax({
        type: ‘POST‘,
        url: ‘/advertise/config/ajax_<?php echo Request::current()->action();echo Request::current()->action()==‘update‘?‘/‘.$orm->pk():‘/0‘;?>‘,
        data: $(‘#<?php echo NS;?>form‘).serialize(),
        dataType: "json",
        beforeSend: function(xhr){
            if($(‘#<?php echo NS;?>form‘).form(‘validate‘)){
                $.messager.progress();
                return true;
            }
            return false;
        },
        success: function (res) {
            $.messager.progress(‘close‘);
            if(res.status == 200){
            	$("#<?php echo NS;?>form").parent().dialog("close");
                $.messager.alert(‘操作提示‘,res.msg,‘info‘);
                return true;
            }
            $.messager.alert(‘操作提示‘,res.msg,‘error‘);
        }
    });
    return false;
}
</script> 

print_r($orm->as_array())输出

array (
  ‘id‘ => ‘56‘,
  ‘reorder‘ => ‘0‘,
  ‘position‘ => ‘1‘,
  ‘name‘ => ‘text‘,
  ‘picurl‘ => ‘‘,
  ‘admode‘ => ‘URL‘,
  ‘linkurl‘ => ‘‘,
  ‘codebox‘ => NULL,
  ‘cityid‘ => ‘0‘,
  ‘_cityid‘ => ‘全国‘,
  ‘starttime‘ => ‘2018-11-15 10:49:15‘,
  ‘endtime‘ => ‘2018-11-15 10:49:18‘,
  ‘views‘ => ‘0‘,
  ‘remark‘ => ‘‘,
  ‘status‘ => ‘1‘,
  ‘modtime‘ => ‘1542261489‘,
  ‘addtime‘ => ‘1542250225‘,
)

2、EassUI动态改变参数

$("#<?php echo NS; ?>corper").datagrid("options").queryParams.belongcityid = val;
$(‘#<?php echo NS; ?>corper‘).datagrid(‘reload‘);

  

原文地址:https://www.cnblogs.com/hnhycnlc888/p/10987361.html

时间: 2024-11-05 02:18:06

jQuery EasyUI学习的相关文章

JQuery EasyUI学习框架

前言 前端技术,新项目的开发拟使用EasyUI框架(基于EasyUI丰富UI组件库),项目负责人的提示EasyUI分配给我这个任务.发展前,我需要这对于一个新手EasyUI框架学习一些基本的入门.记录在学习过程中的问题,在他们自己的问题和实事后. 关于EasyUI EasyUI框架式基于JQuery的,使用它帮助我们快捷的构建web网页. EasyUI框架是一个简单.易用.强大的轻量级web前端javascript框架.现阶段来说.在开发web项目时,前端的开发我们更喜欢使用JQuery取代原生

JQuery EasyUI学习笔记

转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/6690888.html  简介与准备 jQuery EasyUI 是一个基于 jQuery 的框架,集成了各种用户界面插件. 准备:下载:http://www.jeasyui.com/download/index.php 导入: <link rel="stylesheet" type="text/css" href="easyui/themes/default/e

JQuery EasyUI 学习——Struts2与EasyUI DataGrid数据表格结合使用显示数据库数据

因为EasyUI DataGrid只要取出后台传过来的一定格式的JSON数据,就可以在前台页面数据表格中,以一定形式显示数据库中的数据.此处,我们使用Struts2框架整合DataGrid,实现数据的显示. 一.页面内容 为了在页面中显示数据库中字段内容,需要定义一个table,通过EasyUI内部设计,自动显示数据,如下: <%@ page language="java" import="java.util.*" pageEncoding="UTF

JQuery EasyUI学习记录(四)

1.EasyUI中的validatebox使用 提供的校验规则: 1.非空校验required="required" 2.使用validType指定 email: 正则表达式匹配电子邮件规则. url: 正则表达式匹配的URL规则. length[0,100]: 在x和x字符允许. remote['http://.../action.do','paramName']: 发送ajax请求做验证值,返回"true"当成功. <table cellpadding=3

jQuery EasyUI入门

什么是jQuery EasyUI? jQuery EasyUI是一组基于jQuery的UI插件集合体,而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面.开发者不需要编写复杂的javascript,也不需要对css样式有深入的了解,开发者需要了解的只有一些简单的html标签. jQuery EasyUI的特点 1.基于jquery用户界面插件的集合 2.为一些当前用于交互的js应用提供必要的功能 3.EasyUI支持两种渲染方式分别为javascrip

jQuery EasyUI一个基于 jQuery 的框架(创建网页所需的一切)

jQuery EasyUI学习网址:http://www.runoob.com/jeasyui/jqueryeasyui-tutorial.html jQuery MiniUI学习网址:http://www.miniui.com/index.html#tutorial easyui 的入门学习:http://www.cnblogs.com/biehongli/p/6724953.html 一:jQuery EasyUI的入门指南: 1:实现的方法一 (a):导入jquery.easyui.min

JQuery EasyUI框架学习

前言 新项目的开发前端技术打算采用EasyUI框架(基于EasyUI较为丰富的UI组件库),项目组长将前端EasyUI这块的任务分配给了我.在进行开发之前,需要我这菜鸟对EasyUI框架进行一些基础的入门学习.之后会在学习的过程中将自己遇到的问题和有用的东西记录下来. 关于EasyUI EasyUI框架式基于JQuery的,使用它帮助我们快捷的构建web网页.EasyUI框架是一个简单.易用.强大的轻量级web前端javascript框架.现阶段来说,在开发web项目时,前端的开发我们更喜欢使用

第二百零八节,jQuery EasyUI,SplitButton(分割按钮菜单)组件

jQuery EasyUI,SplitButton(分割按钮)组件 学习要点: 1.加载方式 2.属性列表 3.方法列表 本节课重点了解 EasyUI 中 SplitButton(分割按钮)组件的使用方法,这个组件依赖 于 Menu(菜单)组件和 LinkButton(按钮)组件. 注意:SplitButton(分割按钮)组件与,MenuButton(菜单按钮)是一样的,不同是(分割按钮)组件多了一个分隔符 一加载方式 class 加载方式 <a href="javascript:void

使用Struts2和jQuery EasyUI实现简单CRUD系统(五)——jsp,json,EasyUI的结合

这部分比較复杂,之前看过自己的同学开发一个选课系统的时候用到了JSON,可是一直不知道有什么用.写东西也没用到.所以没去学他.然后如今以这样的怀着好奇心,这是做什么用的,这是怎么用的.这是怎么结合的心态去学习,效果非常好. 这次用到的EasyUI的数据网格,DataGrid. 需用引用一个url传来的json数据.然后整齐美观地展如今页面上.想想自己之前做的东西.就直接拿数据库的数据和html的table代码进行拼接,整洁是整洁,可是代码写得特别别扭. 让我站在一个设计者的思路上来看,假设我如今