我拖网和＃1，一般在网络寻找一个答案。我发现了一些很好的建议（例如的af-design/blog/2010/05/12/using-jquery-uis-autocomplete-to-populate-a-form/)但不能得到任何工作......完全是由于我的无知！
I've trawled Stackoverflow and the web in general looking for an answer to this. I've found some good suggestions (e.g af-design/blog/2010/05/12/using-jquery-uis-autocomplete-to-populate-a-form/) but can't get any to work ... completely due to my ignorance!
我有一个包含一个局部性JSON文件，国家和邮政code数据（缩短版）：
I have a JSON file containing a Locality, State and Postcode data (shortened version):
[ { "PCODE":7255, "LOCALITY":"LOCCOTA", "STATE":"TAS" }, { "PCODE":7255, "LOCALITY":"LUGHRATA", "STATE":"TAS" }, { "PCODE":7255, "LOCALITY":"MEMANA", "STATE":"TAS" } ]基本上我想允许用户输入一个地点到表单字段，然后有jQuery的搜索JSON文件，找到后code和国家的匹配，并使用这些匹配的值来填充帖子code与国家形式的文本字段
Basically I want to allow a user to enter a Locality into a form field and then have jQuery search the JSON file, find a match for Postcode and State and use those matching values to populate Postcode and State form text fields
下面是我使用的形式加上一些测试的jQuery从 af-design/（我不能去上班 - 我的错，而不是源脚本）：
Here's the form I'm using plus some test jQuery pulled from af-design/ (which I can't get to work - my fault, not source script):
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title></title> <style> label{ float:left; width:80px; } </style> <link rel="stylesheet" href="static.jquery/ui/css/base2.css" type="text/css" media="all" /> <script src="ajax.googleapis/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script src="ajax.googleapis/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function(){ var ac_config = { source: "p-codes.json", select: function(event, ui){ $("#city").val(ui.item.LOCALITY); $("#state").val(ui.item.STATE); $("#zip").val(ui.item.PCODE); }, minLength:1 }; $("#city").autocomplete(ac_config); }); </script> </head> <body> <form action="#" method="post"> <p><label for="city">City</label><br /> <input type="text" name="city" id="city" value="" /></p> <p><label for="state">State</label><br /> <input type="text" name="state" id="state" value="" /></p> <p><label for="zip">Zip</label><br /> <input type="text" name="zip" id="zip" value="" /></p> </form> </body> </html>任何帮助或建议将是多少AP preciated！
Any help or suggestions would be much appreciated!
问候，
湄公河
推荐答案在网络各地的行...有点拖网和我能够这一个梳理，感谢的 www.jensbits/ 所有现在的工作。
OK ... a bit more trawling around the web and I was able to sort this one out, thanks to www.jensbits/ All working now.
$("#state").autocomplete({ source: function( request, response ) { $.ajax({ url: "location.json", dataType: "json", data: {term: request.term}, success: function(data) { response($.map(data, function(item) { return { label: item.state, id: item.id, abbrev: item.abbrev }; })); } }); }, minLength: 2, select: function(event, ui) { $('#state_id').val(ui.item.id); $('#abbrev').val(ui.item.abbrev); } });更多推荐
jQuery的搜索JSON和填充表单字段
发布评论