我需要在视图表单中动态添加字段。我有一个脚本功能..但我不知道如何将该脚本包含在 codeIgniter中。
我的控制器 -
class uploadfile extends CI_Controller {
function __construct()
{
parent::__construct();
$this->load->helper('url');}
//index function
function index()
{
//load file upload form
$this->load->view('upload_file_view');}}
我的观点 -
<script type="text/javascript" src="<?php echo base_url("assets/js/myscript.js");?>" ></script>
</head>
<body>
<label for="doc" class=" control-label">SUPPORT DOCUMENT</label>
<div class="multi-field-wrapper ">
<div class="multi-fields">
<div class="multi-field">
<input id="doc" type="text" class="form-control" name="attachment[]">
</div> </div>
<button type="button" class="add-field">Add field</button> </div>
和我的脚本路径 - C:\ xampp \ htdocs \ samplecod \ assets \ js
答案 0 :(得分:3)
我找到了一种在视图页面中添加多个字段的简便方法
`<div class="form-group">
<div class="row colbox">
<div class="col-sm-offset-2 col-lg-8 col-sm-8 text-left">Description</div>
<div class="field_wrapper">
<input type="textarea" name="descrip[]" value="" size="35px" /><input type="text" name="voucher_no[]" value="" size="7px"/><input type="text" name="price[]" value=""size="7px"/>
<a href="javascript:void(0);" class="add_button" title="Add field"><img src="<?php echo base_url('images/add-icon.png'); ?>"/></a>
</div></div></div>`
对于此表单,这是脚本:
<script type="text/javascript">
$(document).ready(function(){
var maxField = 20; //Input fields increment limitation
var addButton = $('.add_button'); //Add button selector
var wrapper = $('.field_wrapper'); //Input field wrapper
var fieldHTML = '<div><input type="text" name="descrip[]" value="" size="35px"/><input type="text" name="voucher_no[]" value="" size="7px"/><input type="text" name="price[]" value="" size="7px"/><a href="javascript:void(0);" class="remove_button" title="Remove field"><img src="<?php echo base_url('images/remove-icon.png'); ?>"/></a></div>'; //New input field html
var x = 1; //Initial field counter is 1
$(addButton).click(function(){ //Once add button is clicked
if(x < maxField){ //Check maximum number of input fields
x++; //Increment field counter
$(wrapper).append(fieldHTML); // Add field html
}
});
$(wrapper).on('click', '.remove_button', function(e){ //Once remove button is clicked
e.preventDefault();
$(this).parent('div').remove(); //Remove field html
x--; //Decrement field counter
});
});
</script>