2016-12-16 3 views
1

У меня есть текстовое поле для отображения данных из json-файла. когда я набираю текстовое поле, я хочу отображать данные с критериями как «автозаполнение». но когда я слежу с firebug. и я получить возврат в закладки Response/HTML, как это:как отобразить результат из json в текстовое поле

{"rajaongkir":{"query":[],"status":{"code":200,"description":"OK"}, 
"results":[ 
{"province_id":"1","province":"Bali"}, 
{"province_id":"2","province":"Bangka Belitung"}, 
{"province_id":"3","province":"Banten"}, 
{"province_id":"4","province":"Bengkulu"}, 
{"province_id":"5","province":"DI Yogyakarta"}, 
{"province_id":"6","province":"DKI Jakarta"} 
{"province_id":"7","province":"Sumatera Selatan"}, 
{"province_id":"8","province":"Sumatera Utara"} 
]}} 

и это мой код:

<html> 
<head> 
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
<script type="text/javascript"> 
$(function() { 
    $("#kotaAsaljne").autocomplete({ 
    source: "city.php", 
    minLength: 3, 
    search: function(event, ui) {  
     $("#kotaAsaljne").val(0); 
    }, 
    select: function(event, ui) { 
     if (ui.item) { 
      $("#kotaAsaljne").val(ui.item.province); 
     } else { 
      $("#kotaAsaljne").val(0); 
     } 
    } 
    }); 
}); 
</script> 
</head> 
<body> 
from : <input type="text" name="kotaAsaljne" id="kotaAsaljne"/> 

</body> 
</html> 

пожалуйста, помогите мне ... Спасибо!

+2

какой вопрос у вас есть, пожалуйста, сообщите мне вопрос? –

+0

проблема не показывает значение текстового поля с функцией автозаполнения –

+0

Источник поддержки автозаполнения JQuery UI как массив объектов с меткой и значениями. Поэтому вам нужно изменить формат либо на стороне сервера, либо на стороне клиента –

ответ

0

Вам необходимо использовать пользовательскую функцию в качестве источника и манипулировать данными, поступающими с сервера.

Попробуйте это:

$(function() { 
    $("#kotaAsaljne").autocomplete({ 
     minLength: 3, 
     source: function (request, response) { 
      $.ajax({ 
       url: 'city.php', 
       data: {search: request}, 
       dataType: "json", 
       type: "POST", 
       success: function (data) { 
        response($.map(data.results, function (item) { 
         return { 
          label: item.province, 
          val: item.province_id 
         }; 
        })); 
       }, 
       error: function (response) { 
        console.log("error",response); 
       } 
      }); 
     }, 
     select: function (e, i) { 
      // your on select callback 
     }, 
    }); 
}); 

Я надеюсь, что это поможет. Для получения дополнительной информации о функции источника https://api.jqueryui.com/autocomplete/#option-source

+0

не работает sir = ( –

+0

Любая ошибка в консоли? Предоставьте полную информацию о том, что не работает –

+0

Этот случай закрыт, спасибо всем за помощь мне ... =) –

Смежные вопросы