嘿,我还是PHP新手,正在创建一个表单,在表单中,我有一个从JQuery创建和循环的数组。因此,最初表单中只有1个输入字段,但用户最多可以创建5个输入字段。而且,如果表单失败,那么我想发回用户输入,因此他们不必重新填写。但是什么也没有发回,在查询字符串中它只是发回了“ kname = Array”。然后,即使他们将其扩展为5,form也会将其重置为1个输入字段。
这是html:
<label for="names" id="name"> Names:
<input type="text" name="name[]" class="names" required value="<?php if
(isset($_GET['name']) && $_GET['name'] !== '') {echo $_GET['name'];} ?>">
</label>
<span id="warning"></span>
<button id="morenames">ADD MORE NAMES</button>
这是我的获取方法,然后通过PHP发送回去
获取
if (isset($_POST['name']) && $_POST['name'] !== '') {
$vName= $_POST['name'];
$allnames = '';
foreach ($vName as $vNames) {
$allnames .= $vNames. ' ';
}
if (filter_var($allnames , FILTER_SANITIZE_STRING) === null) {
$vValidation++;
}
} else {
$vValidation++;
}
如果验证失败,则将其发送回
$querystring = "kname=$vName";
$querystring .= "&";
$querystring .= "ksurname=$vSurname";
$querystring .= "&";
$querystring .= "kvalidation=failed";
header('Location: questionaire.php?' . $querystring );
exit();
jQuery代码(当我单击Enter时,我从其他人的堆栈溢出堆栈中获取了此代码,它也删除了该行,是否有可能删除此行,以便仅当他们单击删除按钮时才删除该行?)
$(document).ready(function() {
var max_fields = 5;
var wrapper = $("#name");
var add_button = $("#morenames");
var x = 1;
$(add_button).click(function(e){
e.preventDefault();
if(x < max_fields){
x++;
$(wrapper).append('<div><input name="name[]" class="names" required style="margin-bottom:5px;"><button id="delete">Delete</button></div>'); //add input box
}
else
{
alert('You Reached the limits')
}
});
$(wrapper).on("click","#delete", function(e){
e.preventDefault(); $(this).parent('div').remove(); x--;
});
});
任何帮助将不胜感激。
我放入了什么 什么被扑灭
答案 0 :(得分:0)
您不需要像这样直接将get参数放在输入上:
<input type="text" name="name[]" class="names" required value="<?php if
(isset($_GET['name']) && $_GET['name'] !== '') {echo $_GET['name'];} ?>">
但这会从url中获取参数,然后按照以下步骤从js创建输入
var max_fields = 5;
var wrapper = $("#name");
var add_button = $("#morenames");
var x = 1;
// init inputs
init();
$(add_button).click(function (e) {
e.preventDefault();
if (x < max_fields) {
x++;
$(wrapper).append('<div><input name="name[]" class="names" required style="margin-bottom:5px;"><button id="delete">Delete</button></div>'); //add input box
} else {
alert('You Reached the limits')
}
});
$(wrapper).on("click", "#delete", function (e) {
e.preventDefault();
$(this).parent('div').remove();
x--;
});
function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function (m, key, value) {
vars[key] = value;
});
return vars;
}
function init() {
var names_p = getUrlVars();
console.log(names_p);
Object.keys(names_p).forEach(function (key) {
x++;
$(wrapper).append(`<div><input name="name[]" class="names" value="${names_p[key]}" required style="margin-bottom:5px;"><button id="delete">Delete</button></div>`); //add input box
})
}
您的html变为:
<label for="names" id="name"> Names:
<input type="text" name="name[]" class="names" required value="">
</label>
<span id="warning"></span>
<button id="morenames">ADD MORE NAMES</button
完整代码:
<?php
if (isset($_GET['name']) && $_GET['name'] !== '') {
$vNameas= $_GET['name'];
foreach ($vNameas as $vName) {
$allnames .= $vName. ' ';
}
$querystring = "kname=" . implode ( "_" , $vNameas );
header('Location: ?' . $querystring );
exit();
}
?>
<form method="get" action="">
<label for="names" id="name"> Names:
<input type="text" name="name[]" class="names" required value="">
</label>
<span id="warning"></span>
<button id="morenames" type="button">ADD MORE NAMES</button>
<input type="submit" value="send">
</form>
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<script>
var max_fields = 5;
var wrapper = $("#name");
var add_button = $("#morenames");
var x = 1;
// init inputs
init();
$(add_button).click(function (e) {
e.preventDefault();
if (x < max_fields) {
x++;
$(wrapper).append('<div><input name="name[]" class="names" required style="margin-bottom:5px;"><button id="delete">Delete</button></div>');
//add input box
}
else {
alert('You Reached the limits')
}
}
);
$(wrapper).on("click", "#delete", function (e) {
e.preventDefault();
$(this).parent('div').remove();
x--;
}
);
function getUrlVars() {
var vars = {
};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function (m, key, value) {
if(key === 'kname') vars[key] = value;
}
);
return vars;
}
function init() {
var names_p = getUrlVars();
console.log(names_p);
if( names_p['kname']) {
names_p['kname'].split('_').forEach(function (key) {
x++;
$(wrapper).append(`<div><input name="name[]" class="names" value="${key}" required style="margin-bottom:5px;"><button id="delete">Delete</button></div>`);
console.log(key);
}
)
}
}
</script>