首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Ajax >

extjs4.0 form数据加载有关问题

2013-04-05 
extjs4.0 form数据加载问题。%@ page languagejava contentTypetext/html charsetUTF-8pageEncodi

extjs4.0 form数据加载问题。

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page isELIgnored="false"%>
<%String path=request.getContextPath();
   %>

<html>
<head>
<title>Test direct(Ext4)</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css"
href="<%=path%>/ext-4.0.1/resources/css/ext-all.css">
<link rel="stylesheet" type="text/css" href="<%=path%>/css/main.css">
<script type="text/javascript" src="<%=path%>/ext-4.0.1/ext-all.js"></script>
<script type="text/javascript" src="<%=path%>/paper/paperApi.js"></script>

<title>在线考试</title>
</head>
<body>
<script type="text/javascript">
Ext.onReady(function(){
Ext.Direct.addProvider(Ext.paper.REMOTING_API);

var form=Ext.create('Ext.form.FormPanel', {
border:false,
fieldDefaults:{//统一设置表单字段默认属性
labelSeparator :':',//分隔符
labelWidth : 80,//标签宽度
width : 270,//字段宽度
msgTarget : 'under'
},
    
    api: {
        load: paper.load//加载数据的远程方法
      //提交数据的远程方法
    },
      //  disabled:true,
       items: [{
           xtype     : 'textfield',
           fieldLabel: '题号',
           name:'id'
          // disabled:true
         
       },{
        xtype     : 'textarea',
        fieldLabel: '题目',
        name:'context'
       // disabled:true
      
    },{
       xtype:'textfield',
       fieldLabel:'A',
       name:'answer1'
      /// disabled:true
        },{
            xtype:'textfield',
            fieldLabel:'B',
            name:'answer2'
        //    disabled:true
         },{
            xtype:'textfield',
            fieldLabel:'C',
            name:'answer3'
         //   disabled:true
            },{
             xtype:'textfield',
             fieldLabel:'D',


             name:'answer4'
         //    disabled:true
          },{
              xtype:'textfield',
              fieldLabel:'D',
              name:'answer'
           //   disabled:true
                        }]
});
form.form.load({
//以产品id作为参数
success:function(form,action){//加载成功的处理函数
//Ext.Msg.alert('提示','表单数据加载成功');
},
failure:function(form,action){//加载失败的处理函数
Ext.Msg.alert('提示','表单数据加载失败<br>失败原因:'+action.result.errorMessage);
}
});
var button1=Ext.create('Ext.Button', {
    text: '上一题',
    style:'margin-left:350px;',
    handler: function() {
        alert('You clicked the button!');
    }
});
var button2=Ext.create('Ext.Button', {
    text: '下一题',
    style:'margin-left:20px;',
    handler: function() {
        alert('You clicked the button!');
    }
});

var button3=Ext.create('Ext.Button', {
    text: '交卷',
    style:'margin-left:20px;',
    handler: function() {
        alert('You clicked the button!');
    }
});


function loadData(){


}
var item = Ext.create('Ext.container.Viewport', {
layout : 'border',
style : 'padding:10px;',
items : [{
region : 'center',

style : 'padding-top:10px;',
title:'试题',
items : [form]
},{
            region:'south',
            height:80,
            layout:'border',
            items:[{
                region:'north',height:40,
             xtype: 'radiogroup',fieldLabel:'请选择',style:'margin-left:20px;width:10px;',
            items: [
                {boxLabel: 'A', name: 'rb-auto', inputValue: 1,id:'radio1'},
                {boxLabel: 'B', name: 'rb-auto', inputValue: 2, id:'radio2',checked: true},
                {boxLabel: 'C', name: 'rb-auto', inputValue: 1,id:'radio3'},
                {boxLabel: 'D', name: 'rb-auto', inputValue: 2, id:'radio4'}


            ]
                },{
                    region:'center',
                    items:[button1,button2,button3]
                        }]
           
}]

});
});
</script>
</body>
</html>

这是前端代码,与后台交互用的是ext direct 技术,现已成功向后台发请求,并得到数据

OST http://localhost:8080/Exam_site/djn/directprovider

200 OK
10ms
ext-all.js (第 7 行)
头信息Post响应Cookies

{"tid":1,"action":"paper","method":"load","result":{"data":[{"id":1,
        "context":"这是什么?","answer1":"是花","answer2":"是水果","answer3":"是铅笔",
        "answer4":"是树","answer":"是花"}],"errorMessage":null,"success":true,
    "errors":{}}"type":"rpc"}

现在问题是 页面不显示,求大神帮忙,新手实在不知道问题出在何处。
[解决办法]
返回的json数据错的

{"tid":1,"action":"paper","method":"load","result":{"data":[{"id":1,
        "context":"这是什么?","answer1":"是花","answer2":"是水果","answer3":"是铅笔",
        "answer4":"是树","answer":"是花"}],"errorMessage":null,"success":true,
    "errors":{}}"type":"rpc"}

少了,
{"tid":1,"action":"paper","method":"load","result":{"data":[{"id":1,
        "context":"这是什么?","answer1":"是花","answer2":"是水果","answer3":"是铅笔",
        "answer4":"是树","answer":"是花"}],"errorMessage":null,"success":true,
    "errors":{}}",type":"rpc"}

热点排行