jQuery自动完成多列

Question

I am trying to display a multiple column autosuggest. I would like it to return suburb , state from my db when the user searches it. Currently it is only returning suburb .

It also populates the other two columns, but I would like it to dispay the value of the other two columsn before populating them.

$st = DB::singleton()
    ->prepare(
        'select postcode, suburb, state ' .
        'from postcode_db ' .
        'where suburb like :suburb ' .
        'order by suburb asc ' .
        'limit 0,10');

$suburbq = $_REQUEST['term'] . '%';
$st->bindParam(':suburb', $suburbq, PDO::PARAM_STR);

$data = array();
if ($st->execute())
{
while ($row = $st->fetch(PDO::FETCH_OBJ))
{
    $data[] = array(
        'postcode' => $row->postcode ,
        'value' => $row->suburb ,
        'state' => $row->state
    );
}
}
echo json_encode($data);
flush();  `

My JQuery

jQuery(document).ready(function(){
        $('.postcode').autocomplete({
            source:'../../assets/php/data.php', 
            minLength:2,
            width: 300,

            select:function(event, ui)
            {
                // when a zipcode is selected, populate related fields in this form
                this.form.suburb.value = ui.item.suburb;
                this.form.postcode.value = ui.item.postcode;
                this.form.state.value = ui.item.state;
            }
        });
    });


</script>

My Form

<form onsubmit="return false;">
Enter a Postcode:
<input id="postcode" type="text" />

City: 
<input id="suburb" type="text" class="postcode"/>

State:
<input id="state" type="text" />

Answer 1

I was able to get it to display both the suburb and state by doing this

while ($row = $st->fetch(PDO::FETCH_OBJ))
{
    $data[] = array(
        'postcode' => $row->postcode ,
        'value' => $row->suburb . " , " . $row->state,
        'state' => $row->state
    );
}

But now the text field input will store both the suburb and state If someone has a better solution please post.