成都网站建设设计

将想法与焦点和您一起共享

[ExtJs4.0]当鼠标停留在某行的时候显示此物品缩略图

控制器代码:

10年积累的成都网站设计、网站建设、外贸网站建设经验,可以快速应对客户对网站的新想法和需求。提供各种问题对应的解决方案。让选择我们的客户得到更好、更有力的网络服务。我虽然不认识你,你也不认识我。但先网站设计后付款的网站建设流程,更有港南免费网站建设让你可以放心的选择与我们合作。

 [ExtjsAction("view")]

       public ActionResult GetById()

       {

           string picId = GetParameter("Id");

           foreach (var p_w_picpath in picInfo.Images)

           {

               p_w_picpath.PicAddress = "http://localhost:8088/pic/Image/" + p_w_picpath.PicAddress;

           }

           return this.JsonFormat(new ExtjsFormInfo(picInfo));

       }

js页面代码:

var panel = Ext.create('Ext.Panel', {

           bodyStyle: 'padding-top:5px 5px 0;background-color:#DFE9F6',

           layout: {

               type: 'table',

               columns: 3

           },

           frame: true,

           name: 'picPanle',

           id: 'p_w_picpaths-view',

           collapsible: true,

           width: 120,

           title: '图片信息',

           items: Ext.create('Ext.view.View', {

               store: {

                   model: 'OOO.model.picPackage.Picture',

                   proxy: {

                       type: 'memory',

                       reader: {

                           type: 'json'

                       }

                   }

               },

               tpl: [

               '',

                   '

',

                   '

',

                   '{PicName}

',

               '',

               '

'

           ],

               multiSelect: true,

               height: 310,

               trackOver: true,

               overItemCls: 'x-item-over',

               itemSelector: 'div.thumb-wrap',

               emptyText: 'No p_w_picpaths to display'

           })

       });

       var detaileForm = {

           xtype: 'fieldset',

           layout: 'column',

           width: 500,

           height: 400,

           defaultType: 'textfield',

           items: [

               {

                   xtype: 'container',

                   columnWidth: .6,

                   layout: 'anchor',

                   items: stationColumn

               }, {

                   xtype: 'container',

                   columnWidth: .4,

                   layout: 'anchor',

                   items: panel

               }]

       };

extjs model层代码:

Ext.define('OOOmodel.Picture', {

   extend: 'Ext.data.Model',

   fields: ['PicAddress', 'PicName']

});

 

下面的是另外的

initComponent: function () {

       this.columns = [{

           xtype: 'gridcolumn',

           header: 'ID',

           dataIndex: 'Id',

           width: 100,

           menuDisabled: true,

           sortable: true,

           renderer: function (value, metaData, record, rowIndex, columnIndex, store) {

               var url = 'http://localhost:8088/Image/';

               var fileName = store.getAt(rowIndex).get('PictureName');

               var img = "";

               metaData.tdAttr = 'data-qtip="' + img + '"';

               return value;

           }

       }];


文章标题:[ExtJs4.0]当鼠标停留在某行的时候显示此物品缩略图
路径分享:http://chengdu.cdxwcx.cn/article/ijegdg.html