如何使用javascript或jquery或ajax在php中增加字段数量,而无需重新加载整个页面
How to increment number of fields in php using javascript or jquery or ajax without reload whole page
>我在 yii 中有一个表单,其中有一个名为 certificate_name 的文本字段。现在我希望当我单击加号图标时,文本字段应该递增 1 并显示在上一个字段下方。
这是我的 php 代码:
<?php for ($i = 0; $i <= $_REQUEST['total_certi']; $i++) { ?>
<div class="pr-ser">
<div class="row">
<?php echo $form->labelEx($model4, 'certificate_name'); ?>
<?php echo $form->textField($model4, 'certificate_name', array('maxlength' => 300)); ?>
<?php echo $form->error($model4, 'certificate_name'); ?>
</div><!-- row -->
</div>
<?php } ?>
<p id="demo"></p>
<div class="row buttonsub">
<input type="button" id ="trainer_certi" onclick="myFunction()" value="Add" />
</div>
如果我递增整个div 而不是 fild,则没有问题。我可以管理这个。我的JavaScript代码如下:
<script>
function myFunction() {
var value = parseInt(document.getElementById('demo').value, 10);
value = isNaN(value) ? 0 : value;
value++;
document.getElementById('demo').value = value;
var total_certi = value;
alert(total_certi);
}
</script>
如果我在 $_REQUEST['total_certi']
中得到结果并且它在 for 循环中工作,那么我就完成了我的工作。
在这里,我可以在脚本中的警报中获得递增的值,但是如何将此值应用于php并在不重新加载页面的情况下增加字段数量?
您可以使用
ajax请求,但对于多文本字段,您需要写入/数组certificate_name[]
而不是certificate_name
。
这是为您工作和简单的代码 -
添加更多按钮 -
<a class="btn btn-primary add-more" href="#">Add More</a>
添加更多字段 JS 代码 -
$('.add-more').live('click', function(){
var url_path = ''; //your project base url
$.ajax({
url:url_path+'?r=ajax/addmore',
data:'req=add_more',
dataType:'html',
type:'POST',
async: true,
cache: false,
success:function(resp){
$('.pr-ser').append('<div class="row">'+resp+'</div>');
},
error:function(er){
alert("An error has occured, Please reload/refresh the page and try again.");
}
});
return false;
});
将代码写入 Ajax 控制器 -
public function actionAddmore(){
if(Yii::app()->request->isAjaxRequest){
$cert_name = CHtml::textField('certificate_name[]', '', array('maxlength'=>'300'));
echo $cert_name
}
}
如果你使用的是 Yii2 - 看看下面的扩展:Yii2 Dynamicform。我已经在我的项目中使用了它,它正是您正在尝试构建的。
相关文章:
- 创建新数据和加载现有数据需要单独的视图吗
- 钛 - HTTPClient:打开新的控制器加载
- 保持 JavaScript 在浏览器控制台中运行,即使在新的页面加载之后也是如此
- 路由到新页面时加载不起作用
- 如何在新窗口完成加载后执行某些内容
- 使用新标题重新加载 html 页面
- Primefaces在打开新页面时加载数据消息
- Wordpress音频播放器和平滑状态.在新页面重新加载播放器时调用什么回调函数
- 用新数据重新加载renderer3d
- 文本不被渲染后,新的页面加载- JQuery移动
- 需要在新标签中加载pdf/doc文件,而不是下载,只是想在浏览器中阅读
- 用新参数重新加载页面
- Js和CSS不检测新页面何时加载
- 在新页面上加载一个flash视频,它在上一页上的位置
- 在新窗口中加载代码编写器视图
- 在控制台中使用新脚本重新加载页面
- 如何在加载新页面后加载AJAX数据
- 如何使用jQuery在新窗口中加载页面,然后关闭它们
- Jquery没有看到新的HTML加载到对话框中
- 无法用新值重新加载JGrid