par
cca » 29 nov. 2015, 23:06
Bonjour
Puis-je poser cette question ici, qui relève de HTML, Javascript dans un php?
Après bien des recherches, je suis arrivée à sérier mon problème pour pouvoir vous le soumettre..
Il faut savoir que je développe dans le cadre d'un logiciel libre qui a des outils.
Je veux pouvoir proposer une liste de choix permettant, en saisissant 2,3 4 lettres, de restreindre la liste aux items possédant cette séquence de lettres. ça, c'est ce que fait la fonction ci-dessous, provenant du cœur du logiciel.
Mais je veux aussi pouvoir activer des fonctions sur changement de choix (par exemple afficher le téléphone et le mail du tiers choisi dans la liste)
Je viens de prouver que la fonction ci-dessous m'empêche d'activer les événements 'onchange','onclick'.
Quelqu'un saurait-il me dire pourquoi?
Merci Beaucoup
Claude
Code : Tout sélectionner
(function( $ ) {
$.widget( "ui.combobox", {
options: {
minLengthToAutocomplete: 0
},
_create: function() {
var savMinLengthToAutocomplete = this.options.minLengthToAutocomplete;
var self = this,
select = this.element.hide(),
selected = select.children( ":selected" ),
value = selected.val() ? selected.text() : "";
var input = this.input = $( "<input>" )
.insertAfter( select )
.val( value )
.attr('id', 'inputautocomplete'+select.attr('id'))
.autocomplete({
delay: 0,
minLength: this.options.minLengthToAutocomplete,
source: function( request, response ) {
var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" );
response( select.children( "option:enabled" ).map(function() {
var text = $( this ).text();
if ( this.value && ( !request.term || matcher.test(text) ) )
return {
label: text.replace(
new RegExp(
"(?![^&;]+;)(?!<[^<>]*)(" +
$.ui.autocomplete.escapeRegex(request.term) +
")(?![^<>]*>)(?![^&;]+;)", "gi"
), "<strong>$1</strong>" ),
value: text,
option: this
};
}) );
},
select: function( event, ui ) {
ui.item.option.selected = true;
self._trigger( "selected", event, {
item: ui.item.option
});
},
change: function( event, ui ) {
if ( !ui.item ) {
var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( $(this).val() ) + "$", "i" ),
valid = false;
select.children( "option" ).each(function() {
if ( $( this ).text().match( matcher ) ) {
this.selected = valid = true;
return false;
}
});
if ( !valid ) {
// remove invalid value, as it didnt match anything
$( this ).val( "" );
select.val( "" );
input.data( "autocomplete" ).term = "";
return false;
}
}
}
})
.addClass( "ui-widget ui-widget-content ui-corner-left dolibarrcombobox" );
input.data( "autocomplete" )._renderItem = function( ul, item ) {
return $( "<li></li>" )
.data( "item.autocomplete", item )
.append( "<a>" + item.label + "</a>" )
.appendTo( ul );
};
this.button = $( "<button type=\'button\'> </button>" )
.attr( "tabIndex", -1 )
.attr( "title", "Show All Items" )
.insertAfter( input )
.button({
icons: {
primary: "ui-icon-triangle-1-s"
},
text: false
})
.removeClass( "ui-corner-all" )
.addClass( "ui-corner-right ui-button-icon" )
.click(function() {
// close if already visible
if ( input.autocomplete( "widget" ).is( ":visible" ) ) {
input.autocomplete( "close" );
return;
}
// pass empty string as value to search for, displaying all results
input.autocomplete({ minLength: 0 });
input.autocomplete( "search", "" );
input.autocomplete({ minLength: savMinLengthToAutocomplete });
input.focus();
});
},
destroy: function() {
this.input.remove();
this.button.remove();
this.element.show();
$.Widget.prototype.destroy.call( this );
}
});
})( jQuery );
Bonjour
Puis-je poser cette question ici, qui relève de HTML, Javascript dans un php?
Après bien des recherches, je suis arrivée à sérier mon problème pour pouvoir vous le soumettre..
Il faut savoir que je développe dans le cadre d'un logiciel libre qui a des outils.
Je veux pouvoir proposer une liste de choix permettant, en saisissant 2,3 4 lettres, de restreindre la liste aux items possédant cette séquence de lettres. ça, c'est ce que fait la fonction ci-dessous, provenant du cœur du logiciel.
Mais je veux aussi pouvoir activer des fonctions sur changement de choix (par exemple afficher le téléphone et le mail du tiers choisi dans la liste)
Je viens de prouver que la fonction ci-dessous m'empêche d'activer les événements 'onchange','onclick'.
Quelqu'un saurait-il me dire pourquoi?
Merci Beaucoup
Claude
[code]
(function( $ ) {
$.widget( "ui.combobox", {
options: {
minLengthToAutocomplete: 0
},
_create: function() {
var savMinLengthToAutocomplete = this.options.minLengthToAutocomplete;
var self = this,
select = this.element.hide(),
selected = select.children( ":selected" ),
value = selected.val() ? selected.text() : "";
var input = this.input = $( "<input>" )
.insertAfter( select )
.val( value )
.attr('id', 'inputautocomplete'+select.attr('id'))
.autocomplete({
delay: 0,
minLength: this.options.minLengthToAutocomplete,
source: function( request, response ) {
var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" );
response( select.children( "option:enabled" ).map(function() {
var text = $( this ).text();
if ( this.value && ( !request.term || matcher.test(text) ) )
return {
label: text.replace(
new RegExp(
"(?![^&;]+;)(?!<[^<>]*)(" +
$.ui.autocomplete.escapeRegex(request.term) +
")(?![^<>]*>)(?![^&;]+;)", "gi"
), "<strong>$1</strong>" ),
value: text,
option: this
};
}) );
},
select: function( event, ui ) {
ui.item.option.selected = true;
self._trigger( "selected", event, {
item: ui.item.option
});
},
change: function( event, ui ) {
if ( !ui.item ) {
var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( $(this).val() ) + "$", "i" ),
valid = false;
select.children( "option" ).each(function() {
if ( $( this ).text().match( matcher ) ) {
this.selected = valid = true;
return false;
}
});
if ( !valid ) {
// remove invalid value, as it didnt match anything
$( this ).val( "" );
select.val( "" );
input.data( "autocomplete" ).term = "";
return false;
}
}
}
})
.addClass( "ui-widget ui-widget-content ui-corner-left dolibarrcombobox" );
input.data( "autocomplete" )._renderItem = function( ul, item ) {
return $( "<li></li>" )
.data( "item.autocomplete", item )
.append( "<a>" + item.label + "</a>" )
.appendTo( ul );
};
this.button = $( "<button type=\'button\'> </button>" )
.attr( "tabIndex", -1 )
.attr( "title", "Show All Items" )
.insertAfter( input )
.button({
icons: {
primary: "ui-icon-triangle-1-s"
},
text: false
})
.removeClass( "ui-corner-all" )
.addClass( "ui-corner-right ui-button-icon" )
.click(function() {
// close if already visible
if ( input.autocomplete( "widget" ).is( ":visible" ) ) {
input.autocomplete( "close" );
return;
}
// pass empty string as value to search for, displaying all results
input.autocomplete({ minLength: 0 });
input.autocomplete( "search", "" );
input.autocomplete({ minLength: savMinLengthToAutocomplete });
input.focus();
});
},
destroy: function() {
this.input.remove();
this.button.remove();
this.element.show();
$.Widget.prototype.destroy.call( this );
}
});
})( jQuery );
[/code]