Rumah hujung hadapan web tutorial js Extjs grid添加一个图片状态或者按钮的方法_extjs

Extjs grid添加一个图片状态或者按钮的方法_extjs

May 16, 2016 pm 04:53 PM
extjs grid tambah gambar

extjs的grid中我们经常需要添加一个图片状态或者按钮,总结一下自己用过的方法:

一、状态表示:

复制代码 代码如下:

renderer:function(value){
if(value==0){
return "Extjs grid添加一个图片状态或者按钮的方法_extjs";
}else if(value==1){
return "Extjs grid添加一个图片状态或者按钮的方法_extjs";
}
return value;
}

在columns中列添加renderer标识状态,效果图如下:

http://images.cnitblog.com/blog/489550/201304/19103818-94991d9869a6458e8a568efdea6081b5.png

二、事件处理:

直接给img添加onclick事件:
复制代码 代码如下:

\'明细维护\''

事件是将需要的数据传递过去。

还有一种方法就是给grid添加单元格点击事件:
复制代码 代码如下:

listeners: {
cellClick: viewDoc
}

function viewDoc(grid, rowIdx, colIdx, e) {
var action = e.getTarget().value;

}

这样就可以得到点击的单元格,再添加事件处理即可。

三、可以使用'actioncolumn'添加图片按钮
复制代码 代码如下:

{header:'合格证',sortable:false,width:80,align:'center',scope:this,

xtype:

'actioncolumn',
items : [{
icon : '${ctx}/img/details.png',
tooltip : '显示合格证',
handler : function(grid, rowIndex, colIndex) {
var record = grid.getStore().getAt(rowIndex);
//。。。
}
]}

这样也可以在grid单元格中添加图片。
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Bagaimana untuk menambah gambar pada tag komputer_Tipu untuk menambah gambar pada nota melekit dalam sistem win10 Bagaimana untuk menambah gambar pada tag komputer_Tipu untuk menambah gambar pada nota melekit dalam sistem win10 Apr 01, 2024 am 10:46 AM

Nota Win10 mudah digunakan apabila diletakkan pada desktop Apabila menggunakannya, jika anda ingin menambah gambar pada nota, bagaimanakah anda boleh melakukannya secara langsung ikon untuk melaksanakan operasi , sila lihat pengenalan di bawah untuk butiran 1. Klik Ctrl+alt+c untuk membuka kotak input yang besar. 2. Seret imej setempat ke kawasan pemindahan fail di bawah kotak input (menyokong menyeret berbilang imej pada satu masa). 3. Klik "Simpan" untuk menyimpan imej ke kandungan ini dan menyimpannya secara automatik dalam awan. 4. Apabila melihat, klik ikon cakera rangkaian di bawah entri dan kotak pratonton akan muncul.

Membawa anda langkah demi langkah untuk melaksanakan dadu 3D menggunakan CSS Flex dan susun atur Grid (dengan kod) Membawa anda langkah demi langkah untuk melaksanakan dadu 3D menggunakan CSS Flex dan susun atur Grid (dengan kod) Sep 23, 2022 am 09:58 AM

Dalam temu bual bahagian hadapan, kami sering ditanya bagaimana untuk melaksanakan susun atur dadu/mahjong menggunakan CSS. Artikel berikut akan memperkenalkan anda kepada kaedah menggunakan CSS untuk mencipta dadu 3D (lentur dan susun atur Grid untuk melaksanakan dadu 3D, saya harap ia akan membantu anda!

Ketahui tentang lima rangka kerja reka letak CSS yang biasa digunakan Ketahui tentang lima rangka kerja reka letak CSS yang biasa digunakan Jan 16, 2024 am 09:20 AM

Rangka kerja susun atur CSS: Terokai lima rangka kerja susun atur yang biasa digunakan Pengenalan: Dalam reka bentuk web, reka letak adalah bahagian yang penting. Rangka kerja reka letak CSS boleh membantu kami membina halaman web dengan cepat dengan gaya reka letak yang berbeza. Artikel ini akan memperkenalkan lima rangka kerja reka letak CSS yang biasa digunakan dan menyediakan contoh kod khusus untuk membantu pembaca memahami dan menggunakan rangka kerja ini dengan lebih baik. 1. Bootstrap: Bootstrap ialah salah satu rangka kerja susun atur CSS yang paling popular pada masa ini. Ia mempunyai komponen yang kaya dan ciri responsif yang berkuasa yang boleh

Cara menggunakan PHP dan ExtJS untuk melaksanakan fungsi aplikasi web yang berkuasa Cara menggunakan PHP dan ExtJS untuk melaksanakan fungsi aplikasi web yang berkuasa Jun 25, 2023 am 11:40 AM

Dengan pembangunan berterusan dan populariti aplikasi Web, semakin banyak syarikat dan individu mula menggunakan PHP dan ExtJS untuk membina aplikasi Web yang berkuasa. Sebagai bahasa skrip sebelah pelayan yang popular, PHP adalah merentas platform dan mudah dipelajari, manakala ExtJS ialah rangka kerja bahagian hadapan yang popular yang boleh membantu pembangun membina antara muka aplikasi web interaktif dengan cepat. Artikel ini akan memperkenalkan cara menggunakan PHP dan ExtJS untuk melaksanakan fungsi aplikasi web yang berkuasa. Wujudkan sambungan pangkalan data PHP dan MySQL untuk digunakan

Penjelasan terperinci tentang sifat susun atur relatif CSS: kedudukan dan relatif Penjelasan terperinci tentang sifat susun atur relatif CSS: kedudukan dan relatif Oct 26, 2023 am 10:01 AM

Penjelasan terperinci tentang sifat susun atur relatif CSS: kedudukan dan relatif Dalam pembangunan bahagian hadapan, reka letak selalunya menjadi masalah yang perlu dihadapi oleh pembangun Untuk mengawal kedudukan elemen pada halaman dengan lebih baik, CSS menyediakan pelbagai kaedah reka letak. Antaranya, reka letak relatif adalah kaedah susun atur yang sangat biasa Dengan menggunakan kedudukan dan atribut relatif, kita boleh melaraskan kedudukan dan saiz elemen secara fleksibel. Atribut kedudukan digunakan untuk menentukan kaedah penentududukan nilai biasa

Sifat susun atur panel CSS: grid dan grid-template-lajur Sifat susun atur panel CSS: grid dan grid-template-lajur Oct 25, 2023 am 08:15 AM

Sifat susun atur panel CSS: grid dan grid-template-lajur Dalam reka letak halaman web moden, reka letak panel ialah kaedah reka bentuk biasa yang boleh mengatur kandungan web dalam grid. Atribut susun atur grid dalam CSS dan atribut grid-template-columns adalah kunci untuk merealisasikan reka letak panel. 1. Pengenalan kepada atribut susun atur grid Atribut susun atur grid ialah atribut yang digunakan untuk mencipta susun atur grid dalam CSS Dengan menukar HTML

Teknik pelaksanaan UniApp untuk susun atur halaman dan reka bentuk responsif Teknik pelaksanaan UniApp untuk susun atur halaman dan reka bentuk responsif Jul 05, 2023 pm 01:57 PM

Kemahiran pelaksanaan UniApp untuk melaksanakan reka letak halaman dan reka bentuk responsif Pengenalan: UniApp ialah alat pembangunan merentas platform berdasarkan rangka kerja Vue.js, yang boleh membangunkan aplikasi untuk berbilang platform secara serentak seperti iOS, Android dan H5. Artikel ini akan memperkenalkan cara menggunakan UniApp untuk melaksanakan reka letak halaman dan reka bentuk responsif, dan menyediakan beberapa contoh kod praktikal. 1. Susun atur halaman Susun atur fleksibel Susun atur fleksibel ialah kaedah yang biasa digunakan dalam susun atur halaman, yang secara automatik boleh menyesuaikan diri dengan saiz skrin dan peranti yang berbeza. Dalam UniApp

Petua pengoptimuman sifat reka letak adaptif CSS: flex dan grid Petua pengoptimuman sifat reka letak adaptif CSS: flex dan grid Oct 21, 2023 am 08:03 AM

Petua pengoptimuman atribut reka letak adaptif CSS: flex dan grid Dalam pembangunan web moden, melaksanakan susun atur penyesuaian adalah tugas yang sangat penting. Dengan populariti peranti mudah alih dan kepelbagaian saiz skrin, adalah keperluan penting untuk memastikan tapak web boleh dipaparkan dengan baik pada pelbagai peranti dan menyesuaikan diri dengan saiz skrin yang berbeza. Nasib baik, CSS menyediakan beberapa sifat dan teknik yang berkuasa untuk melaksanakan reka letak penyesuaian. Artikel ini akan menumpukan pada dua sifat yang biasa digunakan: flex dan grid, dan memberikan contoh kod khusus.

See all articles