[英]How to submit the dynamical input field into the database?
我正在动态显示对我有用的输入字段。
问题是,
我必须提交表格。 我已经尝试了如下一些代码,但它不起作用。
我正在使用 Codeigniter。
控制器代码
public function register(){
$save = array(
'pp_fileStatus' => $this->input->post('pp_fileStatus');
'reasonDate' => $this->input->post('reasonDate');
'reasonAmt' => $this->input->post('reasonAmt');
);
$afterxss=$this->security->xss_clean($save);
if ($afterxss)
{
$this->db->insert('tbl_register',$afterxss);
$response['error'] = "true";
$response['msg'] = "Successfully";
}else{
$response['error'] = "false";
$response['msg'] = "Sometning wrong! please check the internet connection and try again";
}
echo json_encode($response);
}
我正在动态添加字段并增加名称。 请让我知道我必须在这里使用什么名称
$save = array(
'pp_fileStatus' => $this->input->post('pp_fileStatus');
'reasonDate' => $this->input->post('reasonDate');
'reasonAmt' => $this->input->post('reasonAmt');
);
下面是动态添加输入字段的代码。
$(document).ready(function() { var maxField = 10; //Input fields increment limitation var x = 1; //Initial field counter is 1 var count = 2; var numberIncr = 1; // used to increment the name for the inputs var addrm = ''; //Once add button is clicked $(document).on('click', '#clicktoadd', function() { //Check maximum number of input fields if (x < maxField) { x++; //Increment field counter numberIncr++; $(".medication_info").append('<select name="pp_fileStatus' + numberIncr + '" class="form-control multipleselect pp_fileStatus dynamicVal"><option value="" disabled selected>Status</option><option value="1">Open</option><option value="2">Close</option><option value="3">Pending</option></select>'); } count++; }); $(document).on('change', '.pp_fileStatus', function(event) { if (($(this).val() == '1') || ($(this).val() == '3')) { $(".medication_info").append('<div class="addbankField input-wrapper padding0"><div class="form-group"> <input type="text" name="reasonDate' + numberIncr + '" class="form-control datetimepicker dynamicVal" placeholder="Date"></div></div><div class="addbankField input-wrapper"><div class="form-group"> <input type="text" name="reasonAmt' + numberIncr + '" class="form-control commnumber dynamicVal" placeholder="amt"></div></div><input type="hidden" name="remark' + numberIncr + '" class="form-control" placeholder="Remark">'); } else { $(".medication_info").append('<div class="addbankField input-wrapper lbpflex padding0"><div class="form-group"> <input type="text" name="reasonDate' + numberIncr + '" class="form-control datetimepicker dynamicVal" placeholder="Date"></div></div><div class="addbankField input-wrapper"><div class="form-group"> <input type="text" name="remark' + numberIncr + '" class="form-control dynamicVal" placeholder="Remark"></div></div><input type="hidden" name="reasonAmt' + numberIncr + '" class="form-control" placeholder="amt">'); } }); }); $('#register').on('submit', function(event) { event.preventDefault(); // adding rules for inputs with class 'comment' $('.dynamicVal').each(function() { $(this).rules("add", { required: true }) }); // test if form is valid if ($('#register').validate().form()) { $.ajax({ //url:"process.php", url: baseUrl + "/Customer_control/register", type: "POST", dataType: "json", data: $('#register').serialize(), success: function(data) { alert("success"); }, }); // AJAX Get Jquery statment } //alert('hellow'); }); $('#register').validate({ errorPlacement: function(error, element) { if (element.is("select")) { error.insertAfter(element.parent()); } else { error.insertAfter(element); } } });
<div id="clicktoadd"><a href="javascript:void(0);" class="btn btn-bg">Add More</a></div> <form action="#" method="post" id="register" name="register"> <div class="row"> <div class="medication_info"> </div> </div> <input type="submit" name="send" value="submit"> </form> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/jquery.validate.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/additional-methods.min.js"></script>
您可以将 arrays 用于 HTML 形式的多个名称,然后使用 PHP (CodeIgniter) 中的 Foreach 循环获取值。
以下是您应该如何更改代码: 更改您的这一行:
$(".medication_info").append('<select name="pp_fileStatus' + numberIncr + '" class="form-control multipleselect pp_fileStatus dynamicVal"><option value="" disabled selected>Status</option><option value="1">Open</option><option value="2">Close</option><option value="3">Pending</option></select>')
至:
$(".medication_info").append('<select name="pp_fileStatus[]" class="form-control multipleselect pp_fileStatus dynamicVal"><option value="" disabled selected>Status</option><option value="1">Open</option><option value="2">Close</option><option value="3">Pending</option></select>')
注意:我刚刚将select 字段名称更改为“pp_fileStatus []”并删除 numberIncr 变量
现在您可以像这样在 controller 中访问此字段名称值。
$pp_fileStatus = $this->input->post('pp_fileStatus');
这里 $pp_fileStatus 是一个数组,包含 pp_fileStatus 的所有值。
您也可以对其他表单字段执行相同操作。
因此,您可以通过将变量加一来摆脱为字段命名的麻烦。
希望这可以解决您的问题。
您可以像这样更新您的寄存器 function:
public function register(){
$insert_array = [];
$pp_fileStatus = $this->input->post('pp_fileStatus');
$reasonDate = $this->input->post('reasonDate');
$reasonAmt = $this->input->post('reasonAmt');
$remark = $this->input->post('remark');
foreach ($pp_fileStatus as $key => $value) {
$insert_array[] = array(
'pp_fileStatus' => $value,
'reasonDate' => $reasonDate[$key],
'reasonAmt' => $reasonAmt[$key],
'remark' => $remark[$key]
);
}
$this->db->insert_batch('tbl_register',$insert_array);
}
根据您的需要更新此 function
您需要为您的提交操作创建一个 function,在附加 DOM 后,您在文档加载和更改事件中调用( make available )。
简化示例:
$(document).ready(function() {
my_submit(); // enables your submit calls
$(document).on('change', '.pp_fileStatus', function(event) {
// your append code
my_submit(); // again, enables your submit calls
})
}
function my_submit(){
$('#register').on('submit', function(event) {
// your code
})
$('#register').validate({
// your code
})
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.