/**
* Gets the Javascript part of the control which is sent to the client side upon the completion of Render
* @return string The JS string
*/
public function GetControlJavaScript()
{
$strJS = parent::GetControlJavaScript();
$options = array('controlId' => $this->ControlId);
if ($this->strMultipleValueDelimiter) {
$options['multiValDelim'] = $this->strMultipleValueDelimiter;
}
if ($this->blnMustMatch) {
$options['mustMatch'] = 1;
}
if ($this->blnDisplayHtml) {
$options['displayHtml'] = 1;
}
$strJS .= ';qAutocomplete(' . JavaScriptHelper::toJsObject($options) . ')';
return $strJS;
}
public function GetControlJavaScript()
{
$strJS = parent::GetControlJavaScript();
$strValueExpr = 'var value = jQuery(this).val();';
$strResetValue = 'var resetValue = "";';
if ($this->strMultipleValueDelimiter) {
// don't navigate away from the field on tab when selecting an item
$strJS .= '.bind("keydown", function(event) {
if (event.keyCode === jQuery.ui.keyCode.TAB && jQuery(this).data("autocomplete").menu.active) {
event.preventDefault();
}
})';
$strEscapedDelimiter = preg_quote($this->strMultipleValueDelimiter);
$strSplitFunc = sprintf('
// splits the value in element el into terms using the delimiter
// finds and returns the term at the caret
// if the second argument is present replaces that term with val and returns the full (modified) value
function (el, val) {
var value = jQuery(el).val();
// get caret position
var caretPos = 0;
if (document.selection) { // IE
el.focus();
var range = document.selection.createRange();
range.moveStart("character", -value.length);
caretPos = range.text.length;
} else if (el.selectionStart) { // MOZ
caretPos = el.selectionStart;
}
// find which term the caret is in
var matches = value.substring(0, caretPos).match(/%s\\s*/g);
var termIdx = matches ? matches.length : 0;
var terms = value.split(/%s\\s*/);
if (termIdx >= terms.length) {
termIdx = terms.length;
terms.push("");
}
if (val !== undefined) { // setting the value
if (val !== null)
terms[termIdx] = val;
else
terms.splice(termIdx, 1);
if (terms.length && terms[terms.length-1]) {
terms.push("");
}
return terms.join("%s ");
}
return terms[termIdx];
}', $strEscapedDelimiter, $strEscapedDelimiter, $this->MultipleValueDelimiter);
$strJS .= '.data("splitterFunc", ' . $strSplitFunc . ')';
$strValueExpr = 'var splitterFunc = jQuery(this).data("splitterFunc"); var value = splitterFunc(this);';
$strResetValue = 'var resetValue = splitterFunc(this, null);';
$strJS .= sprintf('.on("autocompleteselect",
function (event, ui) {
var sel = ui.item ? (ui.item.value ? ui.item.value : ui.item.label) : "";
this.value = jQuery(this).data("splitterFunc")(this, sel);
return false;
})', preg_quote($this->strMultipleValueDelimiter), $this->strMultipleValueDelimiter);
$strJS .= '.on("autocompletefocus",
function () {
return false;
})';
} else {
$strJS .= sprintf('.on("autocompleteselect",
function (event, ui) {
qcubed.recordControlModification("%s", "SelectedId", ui.item.id);
})', $this->ControlId);
$strJS .= sprintf('
.on("autocompletefocus",
function (event, ui) {
if ( /^key/.test(event.originalEvent.type) ) {
qcubed.recordControlModification("%s", "SelectedId", ui.item.id);
}
})', $this->ControlId);
}
$strMustMatch = $this->blnMustMatch ? sprintf('// remove invalid value, as no match
%s
jQuery( this ).val(resetValue);
jQuery( this ).data( "autocomplete" ).term = "";
', $strResetValue) : '';
$strJS .= sprintf('
.on("autocompletechange", function( event, ui ) {
var toTest = ui.item ? (ui.item.value ? ui.item.value : ui.item.label) : "";
%s
if ( !ui.item || value != toTest) {
%s
qcubed.recordControlModification("%s", "SelectedId", "");
}
})', $strValueExpr, $strMustMatch, $this->ControlId);
return $strJS;
}
