将html页面用extjs显示

最新推荐文章于 2021-06-16 23:31:52 发布

hfy211

最新推荐文章于 2021-06-16 23:31:52 发布

阅读量4.3k

点赞数

分类专栏： extjs 文章标签： extjs html function input stylesheet button

extjs 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

Ext.onReady(function() {
    Ext.BLANK_IMAGE_URL = 'http://www.cnblogs.com/resources/images/default/s.gif';
    Ext.QuickTips.init();
    /**//**
     * button
     */
    var objArray = Ext.DomQuery.select("input[type=submit]");
    Ext.each(objArray, function(obj) {
        var btn = new Ext.Button({
            text : obj.value,
            applyTo : obj,
            handler : obj.onclick,
            type : obj.type
        });
        btn.getEl().replace(Ext.get(obj));
    });
    var objArray = Ext.DomQuery.select("input[type=reset]");
    Ext.each(objArray, function(obj) {
        var btn = new Ext.Button({
            text : obj.value,
            applyTo : obj,
            handler : obj.onclick,
            type : obj.type
        });
        btn.getEl().replace(Ext.get(obj));
    });
    var objArray = Ext.DomQuery.select("input[type=button]");
    Ext.each(objArray, function(obj) {
        var btn = new Ext.Button({
            text : obj.value,
            applyTo : obj,
            handler : obj.onclick,
            type : obj.type
        });
        btn.getEl().replace(Ext.get(obj));
    });
    /**//**
     * text and textarea and password and file
     */
    var objArray = Ext.DomQuery.select("input[type=text]");
    Ext.each(objArray, function(obj) {
        var txtField = new Ext.form.TextField({
            applyTo : obj,
            validationEvent : 'blur',
            validator : function() {
                Ext.Ajax.request({
                    url : '1.htm',
                    success : function(response) {
                        txtField.clearInvalid();
                        txtField.markInvalid(response.responseText);
                    },
                    failure : function() {
                        alert(1);
                    }
                });
            },
            allowBlank : ((obj.attributes.getNamedItem("notNull") || obj.attributes
                    .getNamedItem("notnull")) ? false : true),
            blankText : '该字段不能为空'
        });
    });
    var objArray = Ext.DomQuery.select("input[type=password]");
    Ext.each(objArray, function(obj) {
        var txtField = new Ext.form.TextField({
            applyTo : obj,
            inputType : 'password'
        });
    });
    var objArray = Ext.DomQuery.select("input[type=file]");
    Ext.each(objArray, function(obj) {

    });
    var objArray = Ext.DomQuery.select("textarea");
    Ext.each(objArray, function(obj) {
        var txtArea = new Ext.form.TextArea({
            applyTo : obj
        });
    });
    /**//**
     * checkbox and radio
     */
    var objArray = Ext.DomQuery.select("input[type=checkbox]");
    Ext.each(objArray, function(obj) {
        var checkbox = new Ext.form.Checkbox({
            applyTo : obj
        });
    });
    var objArray = Ext.DomQuery.select("input[type=radio]");
    Ext.each(objArray, function(obj) {
        var radio = new Ext.form.Radio({
            applyTo : obj
        });
    });
    /**//**
     * select or comboBox
     */
    var objArray = Ext.DomQuery.select("select");
    Ext.each(objArray, function(obj) {
        var btn = new Ext.form.ComboBox({
            typeAhead : true,
            triggerAction : 'all',
            transform : obj,
            forceSelection : true
        });
    });

})
原型页面
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
        <title>test</title>
        <link rel="stylesheet" type="text/css"
            href="resources/css/ext-all.css" />
        <script type="text/javascript" src="adapter/ext/ext-base.js"></script>
        <script type="text/javascript" src="ext-all-debug.js"></script>
        <script type="text/javascript" src="example-form.js"></script>
    </head>
    <body>
        <form>
            <input type="submit" value="asdqweqwe" οnclick="alert(2)">
            <input type="text" notnull>
            <input type="text">
            <input type="password">
            <input type="file">
            <textarea></textarea>
            <input type="checkbox">
            <input type="radio" name="q">qweqwe</input>
            <input type="radio" name="q">qweqwe</input>
            <select name="s">
                <option value="kkkkk">
                    pp
                </option>
                <option value="gg">
                    ww
                </option>
            </select>
        </form>
    </body>
</html>

hfy211

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
将html页面用extjs显示

Ext.onReady(function() { Ext.BLANK_IMAGE_URL = http://www.cnblogs.com/resources/images/default/s.gif; Ext.QuickTips.init(); /**//** * button */ var objArray = Ext.DomQuery.select
复制链接

扫一扫