jquery — Перезагрузить Bootstrap Modal на PHP переменная недействительна

Возникли некоторые проблемы с обработкой ошибок модального загрузчика. В модале у меня два входа (оба обязательны). Я хочу отображать простое «обязательное» сообщение, если форма отправлена ​​без заполнения одного из полей.

Я попытался сделать это с PHP, и он работает на отдельной странице, но когда я помещаю его в модальное состояние, модальное окно закрывается при отправке, а затем, если вы снова открываете модальное, вы видите сообщения об ошибках. Я действительно хочу, чтобы модальное окно оставалось открытым или повторно открывалось, если поля ввода не действительны при отправке пользователем.

Любая помощь будет оценена! Спасибо!

HTML (начало модального):

<div class="modal fade" id="createModal" tabindex="-1" role="dialog" aria-labelledby="createModal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title" id="myModalLabel">Add a vCenter</h4>
</div>
<div class="modal-body">

PHP (чтобы отобразить ввод и сообщить о любых ошибках):

 if ( !empty($_POST)) {
// keep track validation errors
$vcenternameError = null;
$vcenterownerError = null;

// keep track post values
$vcentername = $_POST['vcentername'];
$vcenterowner = $_POST['vcenterowner'];

// validate input
$valid = true;
if (empty($vcentername)) {
$vcenternameError = 'Please enter vCenter Name';
$valid = false;
}

if (empty($vcenterowner)) {
$vcenterownerError = 'Please select vCenter Owner';
$valid = false;
}

// insert data
if ($valid) {

$sql = "INSERT INTO ";
$stmt = sqlsrv_query( $conn, $sql );
if( $stmt === false) {
die( print_r( sqlsrv_errors(), true) );
}
header("Location: index.php");
}
}
?>

HTML (остальная часть модальной):

<div class="panel-body">
<form class="form-horizontal" action="index.php" method="post">
<div class="<?php echo !empty($vcenternameError)?'error':'';?> form-group">
<div class="alert alert-warning">
Please input the FQDN of the vCenter and select an owner.
</div>
<label class="control-label">vCenter Name</label>
<div class="controls">
<input name="vcentername" type="text" placeholder="vCenter Name" value="<?php echo !empty($vcentername)?$vcentername:'';?>" class="form-control">
<?php if (!empty($vcenternameError)): ?>
<div class="alert alert-warning alert-dismissable">
<?php echo $vcenternameError;?>
</div>
<?php endif; ?>
</div>
</div>
<div class="<?php echo !empty($vcenterownerError)?'error':'';?> form-group">
<label class="control-label">vCenter Owner</label>
<div class="controls">

<div class="btn-group" data-toggle="button" role="group" aria-label="...">
<label class="btn btn-default">
<input type="radio" name="vcenterowner" value="Team1"> Team1
</label>
<label class="btn btn-default">
<input type="radio" name="vcenterowner" value="Team2"> Team2
</label>
<label class="btn btn-default">
<input type="radio" name="vcenterowner" value="Team3"> Team3
</label>
</div>
<?php if (!empty($vcenterownerError)): ?>
<div class="alert alert-warning alert-dismissable">
<?php echo $vcenterownerError;?>
</div>
<?php endif; ?>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<div class="form-actions">

<button type="submit" class="btn btn-success">Add</button>
<a class="btn btn-default" href="index.php">Back</a>
</div>
</form>
</div>
</div>
</div>
</div>

0

Решение

Вы можете использовать jQuery, чтобы снова открыть модал, если модал содержит ошибки при загрузке страницы:

    var modal = $('#createModal');
if(modal.find('div.alert-warning').length)
modal.modal();

Но для лучшего пользовательского опыта вы должны вызывать ваш PHP-скрипт с помощью запроса ajax: http://api.jquery.com/jquery.ajax/

1

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

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

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