Динамически добавленные поля ввода прошли проверку и отправить не могут на другую страницу

Question

Динамически добавленные поля ввода прошли проверку и отправить не могут на другую страницу

Я начинающий, в динамически добавленные поля ввода Ссылка от: проверить динамически добавленные поля ввода, при прохождении валидации и отправке не может на другую страницу

Следуйте примеру скрипта.

<script src="js/jquery-3.1.1.min.js"></script>
<script src="js/jquery.validate.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var numberIncr = 1; // used to increment the name for the inputs

function addInput() {
$('#inputs').append($('<input class="comment" name="name'+numberIncr+'" />'));
numberIncr++;
}

$('form.commentForm').on('submit', function(event) {

// adding rules for inputs with class 'comment'
$('input.comment').each(function() {
$(this).rules("add",
{
required: true
})
});

// prevent default submit action
event.preventDefault();

// test if form is valid
if($('form.commentForm').validate().form()) {
console.log("validates");
} else {
console.log("does not validate");
}
})

// set handler for addInput button click
$("#addInput").on('click', addInput);

// initialize the validator
$('form.commentForm').validate();

});</script>

когда пройдена валидация, нажмите «Отправить», но не можете выполнить действие = «/ action_page_post.php»

И HTML код

<form class="commentForm" method="get" action="/action_page_post.ph">
<div>

<p id="inputs">
<input class="comment" name="name0" />
</p>

<input class="submit" type="submit" value="Submit" />
<input type="button" value="add" id="addInput" />

</div>
</form>

0

dynamic jquery-validate php submit-button

Решение

По вопросам рекламы [email protected]

Accepted Answer

Изменения, которые я сделал

изменено on('submit') в submitbutton.onclick
добавленной $('.commentForm').submit(); внутри условия if, которое выполняется, если проверка истинна

Причина: так как вы используете event.preventDefault(), это предотвратит поведение формы по умолчанию и поэтому не перейдет на следующую страницу. Таким образом, вы должны отправить форму вручную, используя $(form).submit();
Код ниже будет работать на обычной странице, но не на ТАК Фрагмент

$(document).ready(function() {
var numberIncr = 1; // used to increment the name for the inputs

function addInput() {
$('#inputs').append($('<input class="comment" name="name'+numberIncr+'" />'));
numberIncr++;
}

$('input.submit').click(function(event) {
// adding rules for inputs with class 'comment'
$('input.comment').each(function() {
$(this).rules("add",
{
required: true
});
});

// prevent default submit action
event.preventDefault();
// test if form is valid
if($('form.commentForm').validate().form()) {
console.log("validates");
$('.commentForm').submit();
} else {
console.log("does not validate");
}
})

// set handler for addInput button click
$("#addInput").on('click', addInput);

// initialize the validator
$('form.commentForm').validate();});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script>
<form class="commentForm" method="get" action="action_page_post.php">
<div>

<p id="inputs">
<input type="text" class="comment" name="name0" />
</p>

<input class="submit" type="submit" value="Submit" />
<input type="button" value="add" id="addInput" />

</div>
</form>

0

Другие решения

Других решений пока нет …

Источник