我有一个用PHP动态调用的用户列表,当我点击时,会触发$ .ajax()请求,而在另一个div中,会加载来自$ .ajax()的内容。 $ .ajax()请求正在运行,但我无法使用v-model进行数据绑定(因为它是div),而v-for的内容显示为空。
我在这里缺少什么?
用户列出HTML代码:
<div class="row">
<div class="col-md-12">
<div id="users" name="users">
<!--- section to display the list of users starts -->
<?php if(!empty($user))
{
foreach($user as $value)
{
?>
<div class="row oddEven usersElements userid" id=<?php echo $value->id;?> style="margin-top: -1vw;">
<div v-on:click="displayAgregators(<?php echo $value->id;?>)" class="col-md-10">
<span id="items<?php echo $value->id;?>"><?php echo ucfirst($value->username);?></span>
</div>
<div class="col-md-2">
<div class="colorsByUser" :style="{backgroundColor: randomColor(<?php echo $value->id;?>)}"></div>
</div>
</div>
<?php }
}?>
</div>
</div>
</div>
HTML代码,它应该显示$ .ajax()内容:
<div class="row" id="toprow">
<div class="col-md-6">
<div id="titlerow">User's Aggregators</div>
</div>
<div class="col-md-6">
<input class="searchbar" id="search" placeholder="Search..."></input>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div v-for="agr1 in agr1" id="agregators">{ agr1.id }</div>
</div>
</div>
$ .ajax()函数:
displayAgregators:function(userid) {
var self = this;
console.log(userid);
var formData = new FormData();
formData.append('userid',userid);
$.ajax({
url: url + "/displayAgregators",
type: "POST",
data: {
id: userid
},
dataType: "json",
success:function(response){
console.log(response);//
this.agr1=response;
console.log(this.agr1);
},
error:function(){
}
});//end $.ajax() request
}//end displayAgregators function