Autor Zpráva
tomas123
Profil
Při zpracování BB značek došlo k samovolnému sežrání celého příspěvku. Pardon.
[i]Při zpracování BB značek došlo k samovolnému sežrání celého příspěvku. Pardon.[/i]
Ahoj,
mám menší problém s jQuery autocomplete, vše funguje jak má krom toho, že když napíšu do příslušného políčka písmeno s diakritikou, tak to nic nenalezne. Nevíte kde by mohl být problém?
[pre]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Auto Complete Input box</title>
<link rel="stylesheet" type="text/css" href="jquery.autocomplete.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.autocomplete.js"></script>
<script>
$().ready(function() {
$("#naseptavac").autocomplete("hledani_db.php", {
width: 260,
});
});
</script>
</head>

<body>
<form method="POST">
<input type="text" name="potr_naz" id="naseptavac" style="width:300px" autocomplete="off" required>
</form
</body>
</html>
[/pre]
autocomplete.js
[pre]
;(function($) {

$.fn.extend({
autocomplete: function(urlOrData, options) {
var isUrl = typeof urlOrData == "string";
options = $.extend({}, $.Autocompleter.defaults, {
url: isUrl ? urlOrData : null,
data: isUrl ? null : urlOrData,
delay: isUrl ? $.Autocompleter.defaults.delay : 10,
max: options && !options.scroll ? 10 : 150
}, options);

// if highlight is set to false, replace it with a do-nothing function
options.highlight = options.highlight || function(value) { return value; };

// if the formatMatch option is not specified, then use formatItem for backwards compatibility
options.formatMatch = options.formatMatch || options.formatItem;

return this.each(function() {
new $.Autocompleter(this, options);
});
},
result: function(handler) {
return this.bind("result", handler);
},
search: function(handler) {
return this.trigger("search", [handler]);
},
flushCache: function() {
return this.trigger("flushCache");
},
setOptions: function(options){
return this.trigger("setOptions", [options]);
},
unautocomplete: function() {
return this.trigger("unautocomplete");
}
});

$.Autocompleter = function(input, options) {

var KEY = {
UP: 38,
DOWN: 40,
DEL: 46,
TAB: 9,
RETURN: 13,
ESC: 27,
COMMA: 188,
PAGEUP: 33,
PAGEDOWN: 34,
BACKSPACE: 8
};

// Create $ object for input element
var $input = $(input).attr("autocomplete", "off").addClass(options.inputClass);

var timeout;
var previousValue = "";
var cache = $.Autocompleter.Cache(options);
var hasFocus = 0;
var lastKeyPressCode;
var config = {
mouseDownOnSelect: false
};
var select = $.Autocompleter.Select(options, input, selectCurrent, config);

var blockSubmit;

// prevent form submit in opera when selecting with return key
$.browser.opera && $(input.form).bind("submit.autocomplete", function() {
if (blockSubmit) {
blockSubmit = false;
return false;
}
});

// only opera doesn't trigger keydown multiple times while pressed, others don't work with keypress at all
$input.bind(($.browser.opera ? "keypress" : "keydown") + ".autocomplete", function(event) {
// a keypress means the input has focus
// avoids issue where input had focus before the autocomplete was applied
hasFocus = 1;
// track last key pressed
lastKeyPressCode = event.keyCode;
switch(event.keyCode) {

case KEY.UP:
event.preventDefault();
if ( select.visible() ) {
select.prev();
} else {
onChange(0, true);
}
break;

case KEY.DOWN:
event.preventDefault();
if ( select.visible() ) {
select.next();
} else {
onChange(0, true);
}
break;

case KEY.PAGEUP:
event.preventDefault();
if ( select.visible() ) {
select.pageUp();
} else {
onChange(0, true);
}
break;

case KEY.PAGEDOWN:
event.preventDefault();
if ( select.visible() ) {
select.pageDown();
} else {
onChange(0, true);
}
break;

// matches also semicolon
case options.multiple && $.trim(options.multipleSeparator) == "," && KEY.COMMA:
case KEY.TAB:
case KEY.RETURN:
if( selectCurrent() ) {
// stop default to prevent a form submit, Opera needs special handling
event.preventDefault();
blockSubmit = true;
return false;
}
break;

case KEY.ESC:
select.hide();
break;

default:
clearTimeout(timeout);
timeout = setTimeout(onChange, options.delay);
break;
}
}).focus(function(){
// track whether the field has focus, we shouldn't process any
// results if the field no longer has focus
hasFocus++;
}).blur(function() {
hasFocus = 0;
if (!config.mouseDownOnSelect) {
hideResults();
}
}).click(function() {
// show select when clicking in a focused field
if ( hasFocus++ > 1 && !select.visible() ) {
onChange(0, true);
}
}).bind("search", function() {
// TODO why not just specifying both arguments?
var fn = (arguments.length > 1) ? arguments[1] : null;
function findValueCallback(q, data) {
var result;
if( data && data.length ) {
for (var i=0; i < data.length; i++) {
if( data[i].result.toLowerCase() == q.toLowerCase() ) {
result = data[i];
break;
}
}
}
if( typeof fn == "function" ) fn(result);
else $input.trigger("result", result && [result.data, result.value]);
}
$.each(trimWords($input.val()), function(i, value) {
request(value, findValueCallback, findValueCallback);
});
}).bind("flushCache", function() {
cache.flush();
}).bind("setOptions", function() {
$.extend(options, arguments[1]);
// if we've updated the data, repopulate
if ( "data" in arguments[1] )
cache.populate();
}).bind("unautocomplete", function() {
select.unbind();
$input.unbind();
$(input.form).unbind(".autocomplete");
});


function selectCurrent() {
var selected = select.selected();
if( !selected )
return false;

var v = selected.result;
previousValue = v;

if ( options.multiple ) {
var words = trimWords($input.val());
if ( words.length > 1 ) {
var seperator = options.multipleSeparator.length;
var cursorAt = $(input).selection().start;
var wordAt, progress = 0;
$.each(words, function(i, word) {
progress += word.length;
if (cursorAt <= progress) {
wordAt = i;
return false;
}
progress += seperator;
});
words[wordAt] = v;
// TODO this should set the cursor to the right position, but it gets overriden somewhere
//$.Autocompleter.Selection(input, progress + seperator, progress + seperator);
v = words.join( options.multipleSeparator );
}
v += options.multipleSeparator;
}

$input.val(v);
hideResultsNow();
$input.trigger("result", [selected.data, selected.value]);
return true;
}

function onChange(crap, skipPrevCheck) {
if( lastKeyPressCode == KEY.DEL ) {
select.hide();
return;
}

var currentValue = $input.val();

if ( !skipPrevCheck && currentValue == previousValue )
return;

previousValue = currentValue;

currentValue = lastWord(currentValue);
if ( currentValue.length >= options.minChars) {
$input.addClass(options.loadingClass);
if (!options.matchCase)
currentValue = currentValue.toLowerCase();
request(currentValue, receiveData, hideResultsNow);
} else {
stopLoading();
select.hide();
}
};

function trimWords(value) {
if (!value)
return [""];
if (!options.multiple)
return [$.trim(value)];
return $.map(value.split(options.multipleSeparator), function(word) {
return $.trim(value).length ? $.trim(word) : null;
});
}

function lastWord(value) {
if ( !options.multiple )
return value;
var words = trimWords(value);
if (words.length == 1)
return words[0];
var cursorAt = $(input).selection().start;
if (cursorAt == value.length) {
words = trimWords(value)
} else {
words = trimWords(value.replace(value.substring(cursorAt), ""));
}
return words[words.length - 1];
}

// fills in the input box w/the first match (assumed to be the best match)
// q: the term entered
// sValue: the first matching result
function autoFill(q, sValue){
// autofill in the complete box w/the first match as long as the user hasn't entered in more data
// if the last user key pressed was backspace, don't autofill
if( options.autoFill && (lastWord($input.val()).toLowerCase() == q.toLowerCase()) && lastKeyPressCode != KEY.BACKSPACE ) {
// fill in the value (keep the case the user has typed)
$input.val($input.val() + sValue.substring(lastWord(previousValue).length));
// select the portion of the value not typed by the user (so the next character will erase)
$(input).selection(previousValue.length, previousValue.length + sValue.length);
}
};

function hideResults() {
clearTimeout(timeout);
timeout = setTimeout(hideResultsNow, 200);
};

function hideResultsNow() {
var wasVisible = select.visible();
select.hide();
clearTimeout(timeout);
stopLoading();
if (options.mustMatch) {
// call search and run callback
$input.search(
function (result){
// if no value found, clear the input box
if( !result ) {
if (options.multiple) {
var words = trimWords($input.val()).slice(0, -1);
$input.val( words.join(options.multipleSeparator) + (words.length ? options.multipleSeparator : "") );
}
else {
$input.val( "" );
$input.trigger("result", null);
}
}
}
);
}
};

function receiveData(q, data) {
if ( data && data.length && hasFocus ) {
stopLoading();
select.display(data, q);
autoFill(q, data[0].value);
select.show();
} else {
hideResultsNow();
}
};

function request(term, success, failure) {
if (!


někde se stala chyba :o
Davex
Profil
tomas123:
někde se stala chyba
Chyba se stala v tom, že vkládáš příliš dlouhý kód, který možná ani nikdo zkoumat nebude. Dej raději odkaz na živou ukázku, případně vlož zdrojový kód použitého PHP skriptu.
tomas123
Profil
Davex:
Nemám kam bych nahrál živou ukázku a php skript ti nic neřekne protože v něm chyba není. Chyba je v tom, že funkce autocomplete do php scriptu nepřenese písmenka s diakritikou, díky tomu pak následně php nedokáže v databázi nic najít.
_es
Profil
tomas123:
Nemám kam bych nahrál živou ukázku
To je obvyklá výhovorka: Povídání o živých ukázkách » „Nevím, kam to nahrát.
Nikto si asi kvôli tebe nebude vytvárať vlastnú „živú“ ukážku z [#1], ak ešte môže byť chyba aj inde - v PHP či databáze.

Chyba je v tom, že funkce autocomplete do php scriptu nepřenese písmenka s diakritikou, díky tomu pak následně php nedokáže v databázi nic najít.
Čo znamená „neprenesie“? Ako si to zistil? Možno ti nesedí kódovanie znakov.
tomas123
Profil
Už jsem to vyřešil, problém byl opravdu v javascriptu nikoli v PHP a už vůbec ne v DB.
_es
Profil
tomas123:
problém byl opravdu v javascriptu
A aký? ( Pravidla diskuse JPW a doporučení » 8. Snažte se zajistit, aby po vyřešení vašeho problému bylo z diskuse zřejmé, jak byl vyřešen.)
lukasMK
Profil *
Docela by mě zajímalo řešení. Mám úplně stejný problém. V případě, že zadám "cerny" v pohodě to nabídne položku kde je v názvu "černý", jak ale do inputu zadám variantu přímo s diakritikou nenajde to nic. Hledal jsem celý den, ale žádné z řešení nepomohlo.
Aktuálně to vypadá takto:
<script type="text/javascript">
$(function() {
    $("#search-q").autocomplete({
        source: "search.php",
        minLength: 2,
        multiple: false,
        scrollHeight: 300,
        width:350,
 select: function(event, ui) { 
        $("#search-q").val(ui.item.label);
        $(".search form").submit(); }
    });    
});
</script>

Na webu autocomplete jsem našel řešení:
http://jqueryui.com/autocomplete/#folding
Ovšem zde je příklad se statickými daty:
var names = [ "Jörn Zaefferer", "Scott González", "John Resig" ];
Jak to má ale vypadat v případě načítání z php a mysql databáze to netuším. Zkoušel jsem vše možné.
Budu rád za každou radu.
lukasMK
Profil *
Tak problém nakonec byl v mém localhostu, na hostingu už funguje.

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Odkud se sem odkazuje


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: