MagicSuggest实现根据输入进行选择提示的下拉框

最终实现效果如下:
MagicSuggest实现根据输入进行选择提示的下拉框_第1张图片
form表单代码块:

<span class="lines1_text"> <label>选择输入联系人:label>span>
<div class="address_style">
     <input id="address_id" name="address_id"  type="text"/>
div>

JS代码块:

<script type="text/javascript">
$(document).ready(function () {
      var addressIdMagicSuggest = $('#address_id').magicSuggest({
              width:200,
              allowFreeEntries: false,
              maxSelection:1,
              autoSelect:true,
              valueField:"id",
              displayField:"value",
              resultAsString:true,
              selectionStacked: true,
              //下拉框数据的获得:
              data: '${cxt}/ab/getCompanyAbJson?companyId=${param.companyId}'
     });
    $("#submitbt").click(function(){
        if(addressIdMagicSuggest.getValue()==""){
            alert("请输入或者选择正确联系人!");
            return false;
        }
        htmlobj=$.ajax({
             type: "POST",
             url: '${cxt}/mt/addMT',
             data:$("form").serialize(),   
             async:false,
             dataType: "text",       
             success: function (data) {
                 var json = eval("("+data+")");
                 if('success'==json.result){
                   alert("保存成功!");
                   window.location.href='${cxt}/mt/getCompanyMT?companyId='+json.companyId;
                 }else if('isopen'==json.result){
                    alert("此联系人已经开启了电话会议!");
                    return false;
                 }else{
                    alert(data);
                 }
             }, 
             error: function (XMLHttpRequest, textStatus, errorThrown) { 
                  alert(XMLHttpRequest.status);
                  alert(XMLHttpRequest.readyState);
                  alert(textStatus);
             }
        });
    });
});
script>

magicSuggestd的data属性即为下拉框中的内容(要是json格式),如果要是显示多项内容,那么后台sql文要做字段拼接。
本实例的后台sql如下:

String companyId = getPara("companyId");
List<AddressBook> list  = AddressBook.dao.find("select (name || '--' ||phone_number) as 
             value,id  from  ys_address_book where company_id=? and is_enabled=1 order 
             by PHONE_NUMBER",companyId);
renderJson(list);

这里oracle数据库的字段拼接利用“||”。

你可能感兴趣的:(技术)