1. Rumah
  2. jQuery EasyUI Form - Buat kotak pohon drop-down (ComboTree)

Tutorial jQuery EasyUI Form - Buat kotak pohon drop-down (ComboTree) Terbaik Pada tahun 2024, Dalam tutorial ini Anda dapat mempelajari Ambil jQuery EasyUI contoh,

jQuery EasyUI Form - Buat kotak pohon drop-down (ComboTree)

Pohon kotak drop-down (ComboTree) adalah kotak drop-down di bawah pohon (tree) dengan (ComboBox). Hal ini dapat bertindak sebagai penggunaan bentuk lapangan, bisa dikirimkan ke server jauh.

Dalam tutorial ini, kita akan membuat formulir pendaftaran dengan bidang nama, alamat, kota. bidang kota adalah kotak drop-down pohon (ComboTree) lapangan, di mana pengguna bisa drop down panel pohon (panel pohon), dan pilih kota tertentu.

Buat formulir (Formulir) 

	<Div id = "dlg" class = "easyui-dialog" style = "width: 500px; height: 250px; padding: 10px 30px;"
			title = "Register" tombol = "# dlg-tombol">
		<H2> Informasi Akun </ h2>
		<Form id = "ff" method = "post">
			<Table>
				<Tr>
					<Td> Nama: </ td>
					<Td> <input type = "text" name = "nama" style = "width: 350px;" /> </ td>
				</ Tr>
				<Tr>
					<Td> Alamat: </ td>
					<Td> <input type = "text" name = "alamat" style = "width: 350px;" /> </ td>
				</ Tr>
				<Tr>
					<Td> Kota: </ td>
					<Td> <pilih class = "easyui-combotree" url = "data / city_data.json" name = "kota" style = "width: 156px;" /> </ td>
				</ Tr>
			</ Table>
		</ Form>
	</ Div>
	<Div id = "dlg-tombol">
		<a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="savereg()"> Kirim </a>
		<a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')"> Batal </a>
	</ Div>

Anda dapat melihat dari kode di atas, kita disebut 'kota' box pohon drop-down (ComboTree) menyiapkan lapangan atribut url, bidang ini dapat diambil pohon (pohon) data dari server jauh. Harap dicatat bahwa bidang ini memiliki gaya yang disebut 'easyui-combotree', sehingga kita tidak perlu menulis pohon kode js kotak drop-down (ComboTree) bidang secara otomatis diberikan.

Ambil jQuery EasyUI contoh

jeasyui-form-form2.zip

Tutorial Panas

Hubungi kami

jQuery EasyUI Form - Buat kotak pohon drop-down (ComboTree)
10/30