Javascript Yii2-将单击事件分配给函数返回值中的锚定标记
我对Yii2和web编程还不熟悉,所以请原谅我的知识不足,甚至愚蠢的请求 我已经将我的站点划分为4个div容器。在一个容器(#untenrechts(edited:lowerright))中,我使用网格视图,如果我单击“customer_name”(edited),我想刷新另一个容器(#obenlinks(edited:#upperleft)),使用所选客户的详细视图(edited),而不重新加载整个页面,只刷新容器 目前,它只能通过手动重新加载来显示所选客户的所选详细信息(已编辑) 我在获取匿名函数返回值中的语法时遇到问题。我就是不明白,这里如何使用onclick事件 我搜索了很多,得到的最好结果是: 但这是我的问题。此解决方案不是返回值的一部分。所以我希望这里的一些友好的人能帮助我找到正确的方法或者理解这一点 谢谢转发 编辑:我必须道歉,因为我发布了关于寻找项目详细信息的问题,但我需要客户详细信息。在代码上没有太大的区别,但是为了理解我的问题。为了更好地理解,我还将div容器名称改为英文。我更新了我的问题 我现在尝试实现给定的建议,并发布(希望)所有相关代码。现在我得到一个404错误 遗憾的是,我需要更多的帮助来理解这句话:Javascript Yii2-将单击事件分配给函数返回值中的锚定标记,javascript,php,jquery,yii2,Javascript,Php,Jquery,Yii2,我对Yii2和web编程还不熟悉,所以请原谅我的知识不足,甚至愚蠢的请求 我已经将我的站点划分为4个div容器。在一个容器(#untenrechts(edited:lowerright))中,我使用网格视图,如果我单击“customer_name”(edited),我想刷新另一个容器(#obenlinks(edited:#upperleft)),使用所选客户的详细视图(edited),而不重新加载整个页面,只刷新容器 目前,它只能通过手动重新加载来显示所选客户的所选详细信息(已编辑) 我在获取匿
return Html::a($model->company_name, ['#.'], ['data'=>['customers'=>$model->id],'class' => 'customer_details']);
该链接始终尝试调用“/site/#”。我试过其他地址,但总是出现同样的错误
_LIST.PHP
<?php
use yii\widgets\ActiveForm;
use yii\grid\GridView;
use yii\widgets\ListView;
use yii\widgets\DetailView;
use yii\widgets\Pjax;
use yii\helpers\Html;
use yii\helpers\ArrayHelper;
use backend\models\Customers;
use yii\db\Expression;
use yii\helpers\Url;
/*
* To change this license header, choose License Headers in Project Properties.
* To change this template file, choose Tools | Templates
* and open the template in the editor.
*/
$this->registerJs("
$(document).on('click','a.customer_details',function(){
$.ajax({
url:'/customers/view',
data:{id:id},
success:function(data){($'#obenlinks').html(data)},
error:function(xhr,statusCode,errorText){alert(errorText)}
});
});
", yii\web\View::POS_READY);
?>
<div class="row" style="position:relative; left: 30px;">
<div id="upperleft" class="col-md-6" style="background-color:lightgreen; overflow: scroll; width:550px; height:300px; border: 1px solid black">
<?php Pjax::begin(); ?>
<?= DetailView::widget([
'model' => $model2,
'attributes' => [
'id',
'customer_number',
'company_name',
'customer_type',
'firstname',
'lastname',
'customer_since',
'street_name',
'street_number',
'zipcode',
'city',
],
]) ?>
<?php Pjax::end();?>
</div>
<div id="upperright" class="col-md-6" style="background-color:lightblue; overflow: scroll; width:550px; height:300px;border: 1px solid black">
EMPTY DIV CONTAINER
</div>
</div>
<div class="row" style="position:relative; left: 30px;">
<div id="lowerleft" class="col-md-6" style="background-color:lightgrey; overflow: scroll; width:550px; height:300px;border: 1px solid black">
EMPTY DIV CONTAINER
</div>
<div id="lowerright" class="col-md-6" style="background-color:orange; overflow: scroll; width:550px; height:300px;border: 1px solid black">
GRIDVIEW ALL CUSTOMERS
<?php Pjax::begin(); ?> <?= GridView::widget([
'dataProvider' => $dataProvider,
'columns' => [
'customer_number',
[
'label' => 'Firmenname',
'attribute' => 'company_name',
'format' => 'raw',
'value' => function ($model) {
if ($model->company_name == "Privat"){
return " ";
}
else {
return Html::a($model->company_name, ['#.'], ['data'=>['customers'=>$model->id],'class' => 'customer_details']);
}
},
],
[
'label' => 'Privatkunde',
'attribute' => 'firstname',
'format' => 'raw',
'value' => function ($model) {
return Html::a($model->firstname . ' ' . $model->lastname, ['customers/view', 'id' => $model->id]);
}
],
[
'label' => 'Projekte',
'attribute' => 'projects.project_name',
'format' => 'raw',
'value' => function ($model) {
$selectproject='<ul id="selectproject">';
foreach ($model->projects as $row) {
$selectproject.= "<li value='$row->id'>".Html::a($row->project_name, ['/projects/view', 'id' => $row->id])."</li>";
}
$selectproject.='</ul>';
return $selectproject;
},
],
],
]); ?>
<?php Pjax::end(); ?>
</div>
</div>
这是选项的第三个参数,它将作为name=>value
对提供的所有选项呈现为要在url
参数中添加的结果标记的属性
应该是
return Html::a(
$model->project_name,
['/projects/view', 'id' => $model->id],
['onclick'=>"YourJavascriptStatement()"]
);
因此,如果您想将onclick
属性添加到锚点,它应该进入Html::a()
函数的第三个参数,作为name=>value
对,取属性名(onclick)和值(javascript函数或语句)
现在看看你的问题,你需要
通过分配一个公共类将单击事件绑定到锚,并进行ajax调用,该调用应发送当前单击链接的project\u id
,在success函数中,它应更新显示DetailView
的div的HTML
将GridView
中的projektname
列定义更新为以下内容
[
'label' => 'Projektname',
'attribute' => 'project_name',
'format' => 'raw',
'value' => function ($model) {
return Html::a($model->project_name, '#.' , ['data'=>['project'=>$model->id],'class'=>'project_details']);
},
],
将以下内容添加到视图文件\u list.php
的顶部。将url更新到相关路径
$js=<<<JS
$(document).on('click','a.project_details',function(e){
e.preventDefault();
$.ajax({
url:'/controller/action', //change this to the relevant controller and action names
data:{project_id:id},
success:function(data){$('#yourDetailViewDivId').html(data)},
error:function(xhr,statusCode,errorText){alert(errorText)}
});
});
JS;
$this->registerJs($js, yii\web\View::POS_READY);
创建一个视图,该视图应具有DetailView
,并显示所选模型的详细信息
应类似于以下添加表属性
<?=
DetailView::widget([
'model' => $model,
'options' => ['class' => 'table'],
'attributes' => [
//add your model attributes here you want to show
],
]);
?>
首先,您没有添加当前显示详细信息的DetailView
代码,请添加与问题相关的完整代码,其次,您正试图将onclick
事件绑定到GridView
中填充的锚定,并且您希望该锚定的工作方式是使用GridView
中与项目相关的信息刷新/更新具有DetailView
的div,是否正确?首先,感谢您的回复-我现在添加了详细视图。第二:我有一个视图(_list.php),有4个div,分别命名为upper/lower和left/right。我试图在div“左上角”中显示一个项目的detailview,该项目在gridview的“右下角”中显示并单击,而无需手动刷新整个页面或重定向到新页面。我将在白天更准确地修改我的问题。更新后您遇到的问题是因为我没有在onclick的代码中添加e.preventDefault()
,请再次复制锚的代码块,并查看控制台中的内容,然后,如果您希望获得客户的详细信息,您只需要更新您在ajax中发送给控制器的变量名,操作rest就是您支持的所有sameThanks。这是一个很大的帮助。
$js=<<<JS
$(document).on('click','a.project_details',function(e){
e.preventDefault();
$.ajax({
url:'/controller/action', //change this to the relevant controller and action names
data:{project_id:id},
success:function(data){$('#yourDetailViewDivId').html(data)},
error:function(xhr,statusCode,errorText){alert(errorText)}
});
});
JS;
$this->registerJs($js, yii\web\View::POS_READY);
public function actionDetails()
{
$request = Yii::$app->request;
if ($request->isAjax && $request->isPost) {
$project_id = $request->post('project_id');
//add your model code here
$project = Projects::find()->where(['=', 'id', $project_id])->one();
return $this->renderAjax('viewname', ['model' => $project]);
}
Yii::$app->end();
}
<?=
DetailView::widget([
'model' => $model,
'options' => ['class' => 'table'],
'attributes' => [
//add your model attributes here you want to show
],
]);
?>