jquery.ajax-combobox
Others

You can search by free word, but must set the value only from the list.

自由な文章で検索できますが、リストの中から選ばなければ警告が表示されます。

$('#foo').ajaxComboBox(
  'jquery.ajax-combobox.php',
  {
    select_only: true
  }
);

If this option is set, the value of primary_key field transmit by the form.

なお、このオプションを設定すると、フォームで送信されるのは"primary_key"オプションで設定したカラムの値になります。
この値は、候補リストの<li>要素のpkey属性にもなります。
テキストボックスと同じname属性を持つ隠しフィールド(hidden)を生成し、リストから選択した場合のみ、"primary_key"の値をhiddenのvalue属性に設定しています。

// Text box
<input id="foo" name="foo" type="text" />

// List
...
<li pkey="A010" class="">Adams</li>
<li pkey="A009" class="ac_over">Adams</li>
<li pkey="A005" class="">Adams</li>
...

// Hidden field
<input type="hidden" name="foo" value="A011"/>

$('#foo').ajaxComboBox(
  'jquery.ajax-combobox.php',
  {
    primary_key: 'name' // Default: 'id'
  }
);

$('#foo').ajaxComboBox(
  'jquery.ajax-combobox.php',
  {
    bind_to: 'foo'
  }
)
.bind('foo', function() {
  $('#result').text($(this).val() + ' is selected.');
});

If text box is not enclosed by form tag and event handler is set
for inputting enter key, when one of the list is selected by enter key
function is doubly executed.
To avoid this situation, a argument that become true when selected by
enter key is set When originality event of plugin is fired.

テキストボックスをフォームタグで囲まず、Enterキーが押された場合の
イベントハンドラを独自に用意している場合、候補をEnterキーで選ぶと
イベントが重複して実行されてしまいます。
それを防ぐため、プラグインの独自イベントが発火する際に、
Enterキーで候補が選ばれた場合はtrueとなる引数を追加しました。

$('#foo').ajaxComboBox(
  'jquery.ajax-combobox.php',
  {
    bind_to: 'foo'
  }
)
.bind('foo', function(e, is_enter_key) {
  if (!is_enter_key) {
    $('#result').text($(this).val() + ' is selected. (by mouse)');
  }
})
.keydown(function(e) {
  if(e.keyCode == 13) {
    $('#result').text($(this).val() + ' is selected. (by enter key)');
  }
});

As initial value, set the value of primary_key option.

primary_keyオプションの値を初期値として指定できます。

$('#foo').ajaxComboBox(
  'jquery.ajax-combobox.php',
  {
    init_record: 10
  }
);

Set JS object instead of the name of server-side file to 1st argument.

Ajax通信するサーバサイドのファイル名の代わりに、JSオブジェクトを第1引数に指定します。

var data = [
  {id:'A001',name:'Adams',    post:'Sales',          position:'The rank and file'},
  {id:'A002',name:'Darling',  post:'Sales',          position:'The rank and file'},
  {id:'A003',name:'Kingston', post:'General Affairs',position:'Chief clerk'},
  ...
];

$('#foo').ajaxComboBox(data, {});

Remove pull-down button from text box, but functionality is same as default.

プルダウンボタンが非表示なっている以外は、通常のコンボボックスと何ら変わりありません。

$('#foo').ajaxComboBox(
  'jquery.ajax-combobox.php',
  {
    plugin_type: 'simple'
  }
);

You can get an instance of this plugin, and control after apply.
NOTE: Method chaining will be destroyed.

プラグインのインスタンスを受け取ることで、プラグイン適用後に設定を変更することができます。
その代わり、メソッドチェーンは無効になります。

var $instance = $('#foo').ajaxComboBox(
  '-----',
  {
    db_table: '-----',
    instance: true
  }
);
$instance.each(function() {
  this.option.source = 'jquery.ajax-combobox.php';
  this.option.db_table = 'nation';
});

You can set button_img option to change image of button.
button_img accepts src attribute of <img> or HTML element such as <img>, <svg>.
Default value is Octicons.

button_imgオプションでボタンの画像を変更できます。
button_imgには<img>のsrc属性、または<img>や<svg>などのHTML要素を指定できます。 デフォルトはOcticonsのSVG画像です。

$('#foo').ajaxComboBox(
  'jquery.ajax-combobox.php',
  {
    // Default (SVG)
    button_img: '<svg class="octicon octicon-chevron-down" viewBox="0 0 10 16" version="1.1" aria-hidden="true"><path fill-rule="evenodd" d="M5 11L0 6l1.5-1.5L5 8.25 8.5 4.5 10 6z"></path></svg>',

    // Image
    button_img: '<img src="btn.png">',

    // src attribute of <img>
    button_img: 'btn.png',
  }
);