QeePHP中采用Ajax实现多个输入框的联动关联查询

前端之家收集整理的这篇文章主要介绍了QeePHP中采用Ajax实现多个输入框的联动关联查询前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

客户端页面

<td>

<select name="product_id" style="width: 8em" id="product_id"

onchange="setNetAndSer('/far800express/index.PHP?controller=waybillinformation&action=setnetandser&&product_id='+this.value)">

<option value=""></option>

<?PHP foreach ($products as $product):?>

<option value="<?PHP echo $product->product_id ?>"

<?PHP if ($product->product_id==$waybill->product_id): ?>

<?PHP echo "selected='selected'" ;?> <?PHP endif;?>><?PHP echo $product->product_name ?></option>

<?PHP endforeach;?>

</select>

</td>

<td align="right">网络</td>

<td> <input id="network_code"name="network_code"value="<?PHP echo $waybill->network_code;?>" type="text" style="width: 90px" onfocus="this.blur()">

<td align="right">服务类别</td>

<td><input id="service_code"name="service_code"value="<?PHP echo $waybill->service_code;?>" type="text" style="width: 90px" onfocus="this.blur()">

说明:注意客户端页面中触发onchange事件之后Ajax中传递路径的写法,不同于一般绝对路径的写法,因为在框架中会先到控制器动作方法中,而不是直接到一个页面!这点儿上可能会有一些差别存在!区别之前W3c中关于Ajax部分的例子,那种写法如下:

xhr.open("post",'<?PHP echo url('scannedmanage/upload1')?>&file_name=' + fileList[i].name,true);

xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded; boundary=' + new Date().getTime());

xhr.send(fileList[i]);


客户端页面脚本:

function setNetAndSer(url) {

$.ajax({

url:url,

type:'post',

dataType:'json',

success:function(result){

if (result.net.network_name_en!=null) {

$("#network_code").val(result.net.network_code);

//服务

$("#service_code").val(result.ser.service_code);

$("#service_name_en").val(result.ser.service_name_en);

//燃油附加费率

console.dir(result.baf.price_rates);

$("#baf").val(result.baf.price_rates);

//主帐号

jQuery("#main_account").empty();

for( index in result.account)

{

jQuery("#main_account").append("<option value='"+result.account[index].main_account+"'>"+result.account[index].main_account+"</option>");

}

}

}

});

}

说明:注意HTML DOM操作的写法,如result.ser.service_code


后台控制器动作方法

function actionSetnetandser(){

//查询产品 获取产品

$pro = Product::find('product_id=?',request('product_id'))->getOne();

$net = Network::find('network_id=?',$pro->network_id)->asArray()->getOne();

$ser = Service::find('service_id=?',$pro->service_id)->asArray()->getOne();

$baf = Baf::find('network_id=?',$pro->network_id)->asArray()->getOne();

$account = Proxy::find('network_id=?',$pro->network_id)->asArray()->getAll();

echojson_encode(array(

'net' => $net,

'ser' => $ser,

'baf' =>$baf,

'account' => $account

));

exit();

}

说明:json_encode()方法将数组类型的数据转换为Json类型的,并打印输出来让客户请求端接收后台(控制器动作方法)处理的数据!




补充(于2015年3月16日):

在做项目中涉及到取件地、销售员、取件员与所属部门关联的情况,最终没有采用Ajax的方式,采用的是在后台将与所属部门对应的取件地、销售员、取件员数据分别查出来,并按对应的关联逻辑关系存放到新建的数组中,将数组数据转换为Json数据并返回到前台前台采用jQuery的方法来控制部门的变化引起取件地、取件员、销售员的变化!

前台JS控制代码

后台代码

//取件地、销售员、取件员与所属部门关联
$receive_address = array ();
$salesperson = array ();
$receiver = array ();
foreach ( $departments as $department ) {
//取件地
$address = Area::find ( 'department_id= ?',$department->department_id )->getAll ();
foreach ( $address as $addr ) {
$receive_address [] = array (
"department_id" => $department->department_id,
"receive_address" => $addr->receive_address,
"area_id" => $addr->area_id
);
}
//销售员
$sal = User::find ( 'department_id= ?',$department->department_id )->where ( 'salesperson = ?',1 )->getAll ();
foreach ( $sal as $sa ) {
$salesperson [] = array
("department_id" => $department->department_id,"salesperson" => $sa->user_name,"user_id" => $sa->user_id );}//取件员$rec = User::find ( 'department_id= ?',$department->department_id )->where ( 'receiver = ?',1 )->getAll ();foreach ( $rec as $re ) {$receiver [] = array ("department_id" => $department->department_id,"receiver" => $re->user_name,"user_id" => $re->user_id );}}$area_id = Helper_Array::groupBy ( $receive_address,'department_id' );$salesperson_id = Helper_Array::groupBy ( $salesperson,'department_id' );$receiver_id = Helper_Array::groupBy ( $receiver,'department_id' );$this->_view ["area_id"] = $area_id;$this->_view ["salesperson_id"] = $salesperson_id;$this->_view ["receiver_id"] = $receiver_id;

原文链接:https://www.f2er.com/ajax/163759.html

猜你在找的Ajax相关文章