在CodeIgniter中自动使用来自JSON的数据填充输入框


Auto fill input boxes with data from JSON in CodeIgniter

对不起,我绞尽脑汁,我已经很久没有处理这个了。我有一个表单,您可以在其中输入电话号码,并在更改时向数据库提交AJAX调用,该数据库发布数据并查询数据库。然后将响应发送回我通过Firefox中的Firebug看到响应值的页面,但是对于我的生活,我无法弄清楚如何获取数据以使用信息更新文本框字段。任何帮助都会很棒。这也是使用CodeIgniter的框架,并且正在json_ecoded数据。

这是我的输入字段,用户填写customer_phone,并在更改时提交 AJAX 调用并发回如下所示的响应:

<input type="text" name="customer_phone" id="customer_phone" value="" />
<input type="text" name="customer_name" id="customer_name" value="" />
<input type="text" name="customer_address" id="customer_address" value="" />

这是 ajax 调用。

$('#customer_phone').change(function() {
  var form_data = {
    customer_phone : $('.customer_phone').val(),
    ajax : '1'
  };
  $.ajax({
    url: "<?php echo site_url('home/customer_search'); ?>",
    type: 'POST',
    async : false,
    data: form_data,
    dataType: 'json',
    success: function(datas) {
      $('.customer_name').val(datas['customer_name']);
    }
  });
  return false;
});

我只是无法弄清楚一旦页面收到来自后端的响应,如何使用数据库中的值更新文本框字段。

这是我通过Firebug收到的回复

[{
  "customer_phone_number": "4124020388",
  "id": "2",
  "customer_name": "Fudgie Wudgie",
  "customer_address_1": "3811"
}]

看起来返回的 JSON 是多维的,因为您的所有值(customer_name 等)都在一个键下,在本例中为 0。

因此,您可以通过以下方式访问它:

datas[0]['customer_name']

这是一个 jsfiddle,其中第一个弹出窗口是代码中的方式,第二个弹出窗口使用 [0]: http://jsfiddle.net/wqfp1k1b/

同样如前所述,在字段 ID 的选择器中使用 # 而不是 。

编辑

看到您已经自己解决了问题。抱歉,没有看到您回复了有关看到问题的答案。

更改此行:

$('.customer_name').val(datas['customer_name']);

对此:

$('#customer_name').val(datas.customer_name);
首先,

当你在这里使用 id 时,应该有一个#

$('#customer_name').val(datas['customer_name']);

在您的 PHP 页面中,使用 json_encode 函数将数组转换为 JSON。

然后 Ajax 调用应该返回不带方括号的 JSON 数据,并且您当前的代码将起作用。

你为什么使用返回假。删除它:

 $('.customer_name').val(datas['customer_name']); //you cannot access object like this.

而是使用:

 $('.customer_name').val(datas.customer_name);