久々の更新です。個人的な備忘録なので、あしからず・・・(こうやったほうが、良いよ!!というご意見はどしどしください)
最近はjqueryを表示に重宝しています。
仕事柄、WEBシステムの管理画面を多く作るのですが、マスターデータを参照してIDを取得したいことが多々あります。
HTMLのselectを利用してコンボボックスを作ってもいいのですが、選択肢が大量にある場合探せないし、と言ってpopupウィンドウで選択させるのも・・・
そこで、jqueryのautocompleteを利用して、隠し項目にidをセットする方法が取れないか
すなわち、autocompleteで情報を取得して、入力フィールドには名称を隠し項目にIDをセットする方法を模索しました
結構簡単でしたが、忘れないようにメモしておきます。
まず、autocompleteを呼び出すときにオプションを追加しました。オプションの名称はなんでも良かったのですがここでは”idInput”としました。
呼び出し方は
$('#id').autocomplete('url', { onItemSelect : selectItem, onFindValue : findValue, formatItem : formatItem, idInput : "chirashi_place" });
idInput : “chirashi_place”の部分を追加、でautocomplete..jsは以下の部分を修正しました。
function selectItem()の$input.val(v);の部分を
var idInput = options.idInput; if(idInput!=""){ listData = v.split(":"); $('#'+idInput).val(listData[0]); $input.val(listData[1]); }else{ $input.val(v); }
更に呼び出しているスクリプトからの戻り値を「”値”\n”値”\n”値”\n”値”\n”値”\n”値”\n”値”」だったものを「”id:値”\n”id:値”\n”id:値”\n”id:値”\n”id:値”\n”id:値”\n”id:値”」に変更して対応完了です。
細かい処理は割愛してあります。
再選択した際に、隠し項目のidをクリアするとか、これだけでは上手くいかないことも多いかと思いますが・・・
とりあえず