From 9f5522e43ab1436e9fb31d0a4104b802adac7b62 Mon Sep 17 00:00:00 2001 From: Benjamin Renard Date: Thu, 6 Nov 2008 10:14:14 +0000 Subject: [PATCH] - LSformElement_select_object : Correction de bugs. --- .../css/black/LSformElement_select_object.css | 23 ++- .../default/LSformElement_select_object.css | 23 ++- .../class.LSformElement_select_object.php | 12 +- .../js/LSformElement_select_object_field.js | 136 ++++++++++-------- trunk/index_ajax.php | 6 +- 5 files changed, 129 insertions(+), 71 deletions(-) diff --git a/trunk/css/black/LSformElement_select_object.css b/trunk/css/black/LSformElement_select_object.css index b18f5f0a..ccd21f1c 100644 --- a/trunk/css/black/LSformElement_select_object.css +++ b/trunk/css/black/LSformElement_select_object.css @@ -24,6 +24,10 @@ li.LSformElement_select_object { border-bottom: 1px solid #dedede; } +li.LSformElement_select_object_noValue { + text-align: center; +} + li.LSformElement_select_object_addBtn { background-color: #dedede; text-align: center; @@ -36,16 +40,19 @@ img.LSformElement_select_object_deleteBtn { /* LSformElement_select_object_searchAdd */ input.LSformElement_select_object_searchAdd { border: 1px solid #ccc; - width: 200px; - margin-left: 20px; + width: 134px; + display: block; + background-image: url(../../images/black/find.png); + background-repeat: no-repeat; + padding-left: 18px; } ul.LSformElement_select_object_searchAdd { border: 1px solid #ccc; - width: 200px; + width: 152px; margin: 0; margin-top: 0.1em; - height: 10em; + max-height: 10em; overflow: auto; padding: 0; list-style-type: none; @@ -53,6 +60,8 @@ ul.LSformElement_select_object_searchAdd { li.LSformElement_select_object_searchAdd { cursor: pointer; + border-bottom: 1px dotted #ccc; + font-size: 0.8em; } li.LSformElement_select_object_searchAdd_over { @@ -63,3 +72,9 @@ li.LSformElement_select_object_searchAdd_current { font-style: italic; color: #777; } + +table.LSformElement_select_object_searchAdd, tr.LSformElement_select_object_searchAdd, td.LSformElement_select_object_searchAdd { + margin: 0; + padding: 0; + vertical-align: top; +} diff --git a/trunk/css/default/LSformElement_select_object.css b/trunk/css/default/LSformElement_select_object.css index 292d4048..0d55557e 100644 --- a/trunk/css/default/LSformElement_select_object.css +++ b/trunk/css/default/LSformElement_select_object.css @@ -24,6 +24,10 @@ li.LSformElement_select_object { border-bottom: 1px solid #b5e4f6; } +li.LSformElement_select_object_noValue { + text-align: center; +} + li.LSformElement_select_object_addBtn { background-color: #b5e4f6; text-align: center; @@ -36,16 +40,19 @@ img.LSformElement_select_object_deleteBtn { /* LSformElement_select_object_searchAdd */ input.LSformElement_select_object_searchAdd { border: 1px solid #ccc; - width: 200px; - margin-left: 20px; + width: 134px; + display: block; + background-image: url(../../images/default/find.png); + background-repeat: no-repeat; + padding-left: 18px; } ul.LSformElement_select_object_searchAdd { border: 1px solid #ccc; - width: 200px; + width: 152px; margin: 0; margin-top: 0.1em; - height: 10em; + max-height: 10em; overflow: auto; padding: 0; list-style-type: none; @@ -53,6 +60,8 @@ ul.LSformElement_select_object_searchAdd { li.LSformElement_select_object_searchAdd { cursor: pointer; + border-bottom: 1px dotted #ccc; + font-size: 0.8em; } li.LSformElement_select_object_searchAdd_over { @@ -63,3 +72,9 @@ li.LSformElement_select_object_searchAdd_current { font-style: italic; color: #777; } + +table.LSformElement_select_object_searchAdd, tr.LSformElement_select_object_searchAdd, td.LSformElement_select_object_searchAdd { + margin: 0; + padding: 0; + vertical-align: top; +} diff --git a/trunk/includes/class/class.LSformElement_select_object.php b/trunk/includes/class/class.LSformElement_select_object.php index e6de0968..287164a3 100644 --- a/trunk/includes/class/class.LSformElement_select_object.php +++ b/trunk/includes/class/class.LSformElement_select_object.php @@ -45,7 +45,7 @@ class LSformElement_select_object extends LSformElement { function getDisplay($refresh=NULL){ $GLOBALS['LSsession'] -> addCssFile('LSformElement_select_object.css'); if ($refresh) { - $this -> values = $this -> attr_html -> getValuesFromSession(); + $this -> values = $this -> getValuesFromSession(); } $return = $this -> getLabelInfos(); @@ -56,7 +56,8 @@ class LSformElement_select_object extends LSformElement { 'object_type' => $this -> selectableObject, 'addBtn' => _('Modifier'), 'deleteBtns' => _('Supprimer'), - 'multiple' => (($this -> params['multiple'])?1:0) + 'multiple' => (($this -> params['multiple'])?1:0), + 'noValueLabel' => _('Aucun objet') ) ); @@ -75,6 +76,13 @@ class LSformElement_select_object extends LSformElement { return $return; } + /* + * Retourne les valeurs de l'objet à partir de la variable Session + */ + function getValuesFromSession() { + return $this -> attr_html -> getValuesFromSession(); + } + /** * Défini le type d'objet sélectionnable * diff --git a/trunk/includes/js/LSformElement_select_object_field.js b/trunk/includes/js/LSformElement_select_object_field.js index 06bb9444..b953e864 100644 --- a/trunk/includes/js/LSformElement_select_object_field.js +++ b/trunk/includes/js/LSformElement_select_object_field.js @@ -35,7 +35,7 @@ var LSformElement_select_object_field = new Class({ this.addBtn = new Element('span'); this.addBtn.addClass('btn'); this.addBtn.set('html',this.params.addBtn); - this.addBtn.addEvent('click',this.onLSformElement_select_object_addBtnClick.bindWithEvent(this)); + this.addBtn.addEvent('click',this.onAddBtnClick.bindWithEvent(this)); this.addBtn.injectInside(this.li); this.li.inject(this.ul,'top'); @@ -49,7 +49,7 @@ var LSformElement_select_object_field = new Class({ this.searchAddBtn = new Element('img'); this.searchAddBtn.setProperty('src',varLSdefault.imagePath('add.png')); this.searchAddBtn.addClass('btn'); - this.searchAddBtn.addEvent('click',this.onSearchAddBtnClick.bind(this)); + this.searchAddBtn.addEvent('click',this.onSearchAddBtnClick.bindWithEvent(this)); this.searchAddBtn.injectAfter(this.addBtn); }, @@ -60,7 +60,7 @@ var LSformElement_select_object_field = new Class({ src: varLSdefault.imagePath('delete.png'), alt: this.params.deleteBtns }); - btn.addEvent('click',this.LSformElement_select_object_deleteBtn.bind(this,btn)); + btn.addEvent('click',this.onDeleteBtn.bind(this,btn)); btn.injectAfter(a); }, @@ -68,22 +68,11 @@ var LSformElement_select_object_field = new Class({ this.addBtn = new Element('img'); this.addBtn.setProperty('src',varLSdefault.imagePath('modify.png')); this.addBtn.addClass('btn'); - this.addBtn.addEvent('click',this.onLSformElement_select_object_addBtnClick.bindWithEvent(this)); + this.addBtn.addEvent('click',this.onAddBtnClick.bindWithEvent(this)); this.addBtn.injectInside(insideEl); }, - reinitialize: function() { - this.ul = this.dd.getFirst('ul'); - this.initializeLSformElement_select_object(); - if($type(this.searchAddInput)) { - this.searchAddInput.injectInside(this.dd); - if($type(this.searchAddUl)) { - this.searchAddUl.injectAfter(this.searchAddInput); - } - } - }, - - onLSformElement_select_object_addBtnClick: function(event) { + onAddBtnClick: function(event) { new Event(event).stop(); values = new Array(); @@ -102,10 +91,10 @@ var LSformElement_select_object_field = new Class({ }; data.imgload=varLSdefault.loadingImgDisplay(this.addBtn,'inside'); - new Request({url: 'index_ajax.php', data: data, onSuccess: this.onLSformElement_select_object_addBtnClickComplete.bind(this)}).send(); + new Request({url: 'index_ajax.php', data: data, onSuccess: this.onAddBtnClickComplete.bind(this)}).send(); }, - onLSformElement_select_object_addBtnClickComplete: function(responseText, responseXML) { + onAddBtnClickComplete: function(responseText, responseXML) { var data = JSON.decode(responseText); if ( varLSdefault.checkAjaxReturn(data) ) { varLSsmoothbox.asNew(); @@ -118,7 +107,7 @@ var LSformElement_select_object_field = new Class({ onLSsmoothboxValid: function() { var data = { template: 'LSform', - action: 'refreshField', + action: 'LSformElement_select_object_refresh', attribute: this.name, objecttype: varLSform.objecttype, objectdn: varLSform.objectdn, @@ -131,23 +120,29 @@ var LSformElement_select_object_field = new Class({ onLSsmoothboxValidComplete: function(responseText, responseXML) { var data = JSON.decode(responseText); if ( varLSdefault.checkAjaxReturn(data) ) { - this.dd.set('html',data.html); - this.reinitialize(); + this.clearUl(); + if ($type(data.objects)) { + var objs = new Hash(data.objects); + objs.each(this.addLi,this); + } + this.addNoValueLabelIfEmpty(); } }, + clearUl: function() { + this.ul.getElements('li.LSformElement_select_object').each(function(li){ + li.destroy(); + }); + }, + clearUlIfNoValue: function() { if (!$type(this.ul.getElement('a.LSformElement_select_object'))) { - this.ul.getElements('li.LSformElement_select_object').each(function(li){ - li.destroy(); - }); + this.clearUl(); } }, addLi: function(name,dn) { if (this.params.multiple) { - this.clearUlIfNoValue(); - var li = new Element('li'); li.addClass('LSformElement_select_object'); @@ -183,7 +178,17 @@ var LSformElement_select_object_field = new Class({ } }, - LSformElement_select_object_deleteBtn: function(img) { + addNoValueLabelIfEmpty: function() { + if (!$type(this.ul.getElement('a.LSformElement_select_object'))) { + var li = new Element('li'); + li.addClass('LSformElement_select_object'); + li.addClass('LSformElement_select_object_noValue'); + li.set('html',this.params.noValueLabel); + li.injectInside(this.ul); + } + }, + + onDeleteBtn: function(img) { var li = img.getParent(); var a = li.getFirst('a'); var input = li.getFirst('input'); @@ -199,34 +204,36 @@ var LSformElement_select_object_field = new Class({ } }, - onSearchAddBtnClick: function() { + onSearchAddBtnClick: function(event) { if (this._searchAddOpen==0) { this._searchAddOpen = 1; if (!$type(this.searchAddInput)) { + this.table = new Element('table'); + this.table.addClass('LSformElement_select_object_searchAdd'); + this.tr = new Element('tr'); + this.tr.addClass('LSformElement_select_object_searchAdd'); + this.tr.injectInside(this.table); + this.td = new Element('td'); + this.td.addClass('LSformElement_select_object_searchAdd'); + this.td.injectInside(this.tr); + + this.td2 = new Element('td'); + this.td2.addClass('LSformElement_select_object_searchAdd'); + this.td2.injectInside(this.tr); + + + this.ul.injectInside(this.td); + this.table.injectInside(this.dd); + this.searchAddInput = new Element('input'); this.searchAddInput.addClass('LSformElement_select_object_searchAdd'); this.searchAddInput.addEvent('keydown',this.onKeyUpSearchAddInput.bindWithEvent(this)); - this.searchAddInput.injectAfter(this.ul); + this.searchAddInput.injectInside(this.td2); } else { this.searchAddInput.value = ""; } - - if (this.params.multiple) { - this.searchAddInput.setStyles({ - top: this.li.getCoordinates().top + 'px', - left: this.li.getCoordinates().right + 'px', - position: 'absolute' - }); - } - else { - this.searchAddInput.setStyles({ - top: this.searchAddBtn.getCoordinates().top + 'px', - left: this.searchAddBtn.getCoordinates().right + 'px', - position: 'absolute' - }); - } - + this._lastSearch = ""; this.searchAddInput.setStyle('display','block'); this.searchAddInput.focus(); @@ -242,6 +249,10 @@ var LSformElement_select_object_field = new Class({ this.launchSearchAdd(); } } + + if (event.key=='esc') { + this.closeSearchAdd(); + } }, launchSearchAdd: function() { @@ -268,16 +279,13 @@ var LSformElement_select_object_field = new Class({ this.searchAddUl.addClass('LSformElement_select_object_searchAdd'); this.searchAddUl.injectAfter(this.searchAddInput); } - this.searchAddUl.setStyles({ - top: this.searchAddInput.getCoordinates().bottom + 'px', - left: this.searchAddInput.getCoordinates().left + 'px', - position: 'absolute' - }); this.searchAddUl.empty(); if (data.objects) { var objs = new Hash(data.objects); objs.each(this.addSearchAddLi,this); } + this.addSearchAddNoValueLabelIfEmpty(); + this.searchAddUl.setStyle('display','block'); } }, @@ -305,6 +313,15 @@ var LSformElement_select_object_field = new Class({ li.injectInside(this.searchAddUl); }, + addSearchAddNoValueLabelIfEmpty: function() { + if (!$type(this.searchAddUl.getElement('li.LSformElement_select_object_searchAdd'))) { + var li = new Element('li'); + li.addClass('LSformElement_select_object_searchAdd'); + li.set('html',this.params.noValueLabel); + li.injectInside(this.searchAddUl); + } + }, + onSearchAddLiMouseEnter: function(li) { li.addClass('LSformElement_select_object_searchAdd_over'); }, @@ -314,19 +331,22 @@ var LSformElement_select_object_field = new Class({ }, onSearchAddLiClick: function(li) { - var name = li.innerHTML; - var dn = li.id; - this.addLi(name,dn); + this.clearUlIfNoValue(); + this.addLi(li.innerHTML,li.id); }, closeIfOpenSearchAdd: function(event) { event = new Event(event); if (this._searchAddOpen == 1 && event.target!=this.searchAddBtn && event.target!=this.searchAddInput && event.target!=this.searchAddUl) { - this.searchAddInput.setStyle('display','none'); - if ($type(this.searchAddUl)) { - this.searchAddUl.setStyle('display','none'); - } - this._searchAddOpen = 0; + this.closeSearchAdd(); } + }, + + closeSearchAdd: function() { + this.searchAddInput.setStyle('display','none'); + if ($type(this.searchAddUl)) { + this.searchAddUl.setStyle('display','none'); + } + this._searchAddOpen = 0; } }); diff --git a/trunk/index_ajax.php b/trunk/index_ajax.php index 87c61b8e..7f12ed00 100644 --- a/trunk/index_ajax.php +++ b/trunk/index_ajax.php @@ -64,16 +64,16 @@ if (!isset($_ERRORS)) { } } break; - case 'refreshField': + case 'LSformElement_select_object_refresh': if ((isset($_REQUEST['attribute'])) && (isset($_REQUEST['objecttype'])) && (isset($_REQUEST['objectdn'])) && (isset($_REQUEST['idform'])) ) { if ($GLOBALS['LSsession'] -> loadLSobject($_REQUEST['objecttype'])) { $object = new $_REQUEST['objecttype'](); $form = $object -> getForm($_REQUEST['idform']); $field=$form -> getElement($_REQUEST['attribute']); - $val = $field -> getDisplay(true); + $val = $field -> getValuesFromSession(); if ( $val ) { $data = array( - 'html' => $val['html'] + 'objects' => $val ); } }