如何解决JQuery Autocomplete Inside Modal无法在客户端的浏览器上运行,但可以在服务器的浏览器上运行
我正在使用CI3并使用jquery自动完成输入,并从简单的api获取数据,当我在服务器上尝试时它确实可以工作,但是在客户端的pc上却不起作用。
<div class="form-group">
<label> Name </label>
<input type="text" class="form-control" id="name" name="name" placeholder="Type Name/ID" required>
</div>
自动完成脚本
<script src="<?php echo base_url(); ?>assets/jquery/jquery-1.10.2.js"></script>
<script src="<?php echo base_url(); ?>assets/jquery/jquery-ui.js"></script>
<script>
$('#modalQuestionaire').on('shown.bs.modal',function() {
$("#name").autocomplete({
source: "<?php echo base_url('questionaire/autocomplete_responden'); ?>",select: function(event,ui) {
if (ui.item) {
$('#noid').val(ui.item.noid);
$('#address').val(ui.item.address);
document.getElementById("name").readOnly = true;
} else {
$('#noid').val('');
$('#address').val('');
}
}
});
});
</script>
控制器
function autocomplete_responden()
{
$searchTerm = $_GET['term'];
$url = base_url() . "api/someservice/responden/list.php?name=" . $searchTerm;
$content = file_get_contents($url);
$fp = fopen('checkresponden.json','w');
fwrite($fp,$content);
fclose($fp);
$file = file_get_contents('checkresponden.json');
$response = json_decode($file,true);
for ($i = 0; $i < count($response['result']); $i++) {
$data[$i]['label'][] = $response['result'][$i]['name'];
$data[$i]['id'][] = $response['result'][$i]['id'];
$data[$i]['address'][] = $response['result'][$i]['address_1'] . " " . $response['result'][$i]['address_2'] . " " . $response['result'][$i]['address_3'];
}
$jsonData = json_encode($data);
$fp2 = fopen('checkresponden2.json','w');
fwrite($fp2,$jsonData);
fclose($fp2);
echo $jsonData;
}
我尝试直接从浏览器的客户端(如someaddress/api/someservice/responden/list.php?name="12"
访问我的api网址,并且显示了正确的结果,然后我尝试将$url = base_url() . "api/someservice/responden/list.php?name=" . $searchTerm
更改为$url = base_url() . "api/someservice/responden/list.php?name="12"
,但仍然无法正常工作。我可能做错了什么?
============================ 更新
我尝试使用在input
中手动设置为array
的虚拟数据制作新的function
,但是它也不起作用,然后我尝试将其设置为外部modal
可以正常工作,好像我的模态有问题,我仍然不知道我的脚本在服务器PC上运行时是如何工作的,但是在客户端PC上却不能工作
我改变了
<div class="form-group">
<label> Name </label>
<input type="text" class="form-control" id="name" name="name" placeholder="Type Name/ID" required>
</div>
到
<div class="form-group">
<label> Name </label>
<input type="text" class="form-control" id="test_1" name="test_1" placeholder="Type Name/ID" required>
<input type="text" class="form-control" id="name" name="name" placeholder="Type Name/ID" required>
</div>
和
<script src="<?php echo base_url(); ?>assets/jquery/jquery-1.10.2.js"></script>
<script src="<?php echo base_url(); ?>assets/jquery/jquery-ui.js"></script>
<script>
$('#modalQuestionaire').on('shown.bs.modal',ui) {
if (ui.item) {
$('#noid').val(ui.item.noid);
$('#address').val(ui.item.address);
document.getElementById("name").readOnly = true;
} else {
$('#noid').val('');
$('#address').val('');
}
}
});
});
</script>
收件人
<script src="<?php echo base_url(); ?>assets/jquery/jquery-1.10.2.js"></script>
<script src="<?php echo base_url(); ?>assets/jquery/jquery-ui.js"></script>
<script>
$('#modalQuestionaire').on('shown.bs.modal',function() {
var data = [
"ActionScript","AppleScript","ASP","BASIC","C","C++","Clojure","COBOL","ColdFusion","Erlang","Fortran","Groovy","Haskell","Java","JavaScript","Lisp","Perl","PHP","Python","Ruby","Scala","Scheme"
];
$("#test_1").autocomplete({
source: data
});
$("#name").autocomplete({
source: "<?php echo base_url('questionaire/autocomplete_responden'); ?>",ui) {
if (ui.item) {
$('#noid').val(ui.item.noid);
$('#address').val(ui.item.address);
document.getElementById("name").readOnly = true;
} else {
$('#noid').val('');
$('#address').val('');
}
}
});
});
</script>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。