我想提交一个表单,其字段是一个包含未知数量元素的数组。
class DynamicForm extends Model
{
/** var string[] */
public elements[];
}
在视图中有表单提交,我想添加一个按钮,其中有一个' onclick' Javascript函数,它以innerHtml的形式添加一个新字段。不幸的是,我找不到在我的javascript表达式中嵌入一些PHP代码的方法。我现在就在这里:
<?php
$form = ActiveForm::begin([
'id' => 'test-form',
'layout' => 'horizontal',
'fieldConfig' => [
'errorOptions' => [
'role' => 'alert',
],
'horizontalCssClasses' => [
'label' => 'col-sm-3',
'offset' => 'col-sm-offset-3',
'wrapper' => 'col-sm-9',
'error' => '',
'hint' => '',
],
],
]);
$formField = $form->field($model, 'elements[]', []);
$JsFunction = new \yii\web\JsExpression(
"function addField() {
document.getElementById(\"test-form\").innerHTML += \"<?php echo $formField; ?>\";
};
addField();"
);
echo Html::button(
'Add element',
[
'class' => 'btn btn-primary',
'onclick' => $JsFunction,
]
);
?>
奇怪的是,如果我在innerHTML中添加一个像"<p>hello!</p>"
这样的字符串,它就可以完美地运行。另一个奇怪的事情是,如果我把HTML代码放在&#39; php echo&#39;命令生成,
'<input type=\"text\" id=\"dynamicform-elements\" class=\"form-control\" name=\"DynamicForm[elements][]\">'
它仍然有效!
虽然我认为为Yii::ActiveForm
输入手动HTML代码并不是一个很好的做法,但这就是为什么我希望PHP能够为它完成这项工作。
提前谢谢!
答案 0 :(得分:0)
在视野中;
$this->registerJs("addField(". $formField .")", 3);
$this->registerJsFile('/js/file.js', ['position' => 3]);
在file.js
中"function addField(variable) {
document.getElementById("test-form").innerHTML += variable;
};
在JavaScript文件中,您可以使用const的constu创建类,以便更好地自定义类。 e.g
var class = function (config) {
this.var1= config;
function addField() {
document.getElementById("test-form").innerHTML += this.var1;
}
};
并在View PHP中;
$this->registerJs("var addField = new Class(".\yii\helpers\Json::encode($same_array).")", 3);
答案 1 :(得分:0)
我终于设法解决了这个问题,这是PHP的html生成代码的一些字符的问题。如果我这样做:
<html>
<head>
<style>
#example1 {
background-position: right bottom;
background-repeat: no-repeat, repeat;
padding: 100px;
z-index: 10;
}
#slider {
position: absolute;
z-index: 0;
}
</style>
</head>
<body>
<div id="example1">
</div>
<div id="slider">
<img src="flwr.jpg" alt="Paris">
<img src="paper.jpg" alt="Paris">
<img src="flower.jpg" alt="Paris">
</div>
<script>
</script>
</body>
</html>
......完美无缺。