Bu işi yapmak için çok kolay kullandığım eskilerde yazdığım bir
scripti gönderiyorum. Dağıtımı serbest, Adına SelectTree demişim ;)
JS:
function SelectTree(group_name){
var STEs = new Array();
var getGroupName = function(element){return
element.getAttribute('SelectTreeGroup');}
var getLevel = function(element){return element.getAttribute('Level');}
var getURL = function(element){
var url = element.getAttribute('URL')
return url ? url : document.location.href ;
}
var getDefaultValue = function(element){return
element.getAttribute('DefaultValue');}
var getLabel = function(element){return element.getAttribute('Label');}
var getEmptyLabel = function(element){return
element.getAttribute('EmptyLabel');}
var empty = function(element_id){
STEs[element_id].length = 0;
STEs[element_id].options[0] = new
Option(getEmptyLabel(STEs[element_id]), null);
}
var disable = function(element_id){
for (i=element_id;i<STEs.length;i++) {
empty(i);
STEs[i].disabled = true;
}
}
var getJsonObj = function(element_id){
var url = getURL(STEs[element_id]) + '?SelectTree&';
for(i=0;i<element_id;i++){
var value = '';
for (x=0;x<STEs[i].options.length;x++) {
value += STEs[i].options[x].selected ?
','+STEs[i].options[x].value : '';
}
value = value.substring(1, value.length);
url += i + '=' + value + '&';
}
/* JQuery */
$.get(url, null, function(data){
fillContinue(element_id, eval('(' + data + ')'));
});
/* Mootools */
/*
new Ajax(url, {onComplete: function(data){
fillContinue(element_id, eval('(' + data + ')'));
}}).request();
*/
/* Prototype */
/*
new Ajax.Request('/some_url',
{
method:'get',
onSuccess: function(transport){
fillContinue(element_id, transport.responseText.evalJSON());
}
});
*/
}
var fill = function(element_id){
empty(element_id);
disable(element_id);
getJsonObj(element_id);
}
var fillContinue = function(element_id, obj){
var el = STEs[element_id];
if (obj && obj.length && obj.length>0) {
el.disabled = false;
el.options.length = 0;
var label = getLabel(el);
if (label && label!=''){
el.options[0] = new Option(label, null);
}
if (STEs[element_id+1]) {
el.onchange = function(){
fill(element_id+1);
}
}
var default_value = getDefaultValue(el);
var selected;
for (i=0;i<obj.length;i++){
el.options[i+1] = new Option(obj[i].name, obj[i].value);
if (default_value && default_value!='' &&
default_value == obj[i].value) {
selected = i+1;
}
}
if (selected>0) {
el.options[selected].selected = true;
if (STEs[element_id+1]) {
fill(element_id+1);
}
}
}
}
did = function(){
var tmpSTEs = document.getElementsByTagName('select');
for (i=0; i<tmpSTEs.length; i++){
el = tmpSTEs[i];
if(getGroupName(el) && getGroupName(el)==group_name){
level = getLevel(el);
if(!level){
alert('Level Belirtilmemiş.');
return false;
}
/*
if(!getURL(el)){
alert('URL Belirtilmemiş.');
return false;
}
*/
STEs[level] = el;
}
}
if (STEs.length == 0) {
alert('Belirtilen Gurupda Elemen Bulunamadı');
return false;
}
for (i=0;i<STEs.length;i++) {
if (!STEs[i]) {
alert('Eksik Ayar: ' + i + ' Level');
return false;
}
}
return fill(0);
}
did();
}
HTML:
.
..
<select name="city" id="city" SelectTreeGroup="group2" Level="0"
URL="/ajax/getplaces" Label="Seçiniz" EmptyLabel="Null"
style="width:250px;"></select>
<select name="district_id" id="district_id" SelectTreeGroup="group2"
Level="1" URL="/ajax/getplaces" Label="Seçiniz" EmptyLabel="Önce İl
Seçiniz" style="width:250px;">
..
.
PHP:
<?php
if (isset($_GET['1'])) {
// İlçe ResulSet veya Level 2 istenilen kadar yazailrsiniz.
} elseif (isset($_GET['0'])) {
$id = (int)$_GET['0'];
// Şehir ResulSet veya Level 1
} else {
// Ülke ResulSet veya Level 0
}
$rtrn = array();
foreach ($res as $row) {
$rtrn[] = array('value'=>$row->id, 'name'=>$row->name);
}
echo json_encode($rtrn);
Kullanım:
onlaod veya sayfanın sonunda
<script>SelectTree('group1');</script>
yazacaksın. birden fazla kullandıysan (şehirler, sektörler vs) group1,
group2 veya sehirler, sektorler gibi guruplar vererrk kulalnabilirsin.
bunu kullanmak istersen ve sıkıntı yaşarsan genel olmadığını
düşündüğünde özel olarak yaz.
js dosyasının üst tarafında Ajax eylemi için Mootols, JQuery ve
Prototype örneklerini yazdım. kullanacağını bırak diğerini kapat.
Kendin de benzerini ordan oluşturabilirsin. [Sıkıntılar olabilr çünki
ondan sonra örneğin mootolsun yapısı çok değişti :( ]
hadi kolay gelsin.
--
Elvin Şiriyev
http://siriyev.net
_______________________________________________
Linux-programlama mailing list
[email protected]
http://liste.linux.org.tr/mailman/listinfo/linux-programlama