我需要使用php在弹出窗口中显示表单详细信息。当用户输入详细信息时必须显示弹出窗口,其中详细信息显示在弹出窗口中。详细信息显示正常..我希望图像在图像字段中代替文本。我无法在图像字段中显示图像而不是文本,这里是代码..
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var $title = $('#title')
var $image = $('#image')
var $filterDate = $('#filterDate')
var $description = $('#description')
$('#myForm').validate({
submitHandler: function(form) {
// some other code
// maybe disabling submit button
// then:
// $(form).submit();
$('.title').text($title.val())
$('.image').text($image.val())
$('.filterDate').text($filterDate.val())
$('.description').text($description.val())
$( ".modalDialog" ).dialog();
}
});
});
</script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<form method="post" align="center" id="myForm">
<div class="login">
<div class="login-form">
<h3>Title:</h3>
<input type="text" name="title" id="title" required/><br />
<h3>Image:</h3>
<input type="text" name="image" id="image" required/>
<br />
<h3>Date:</h3>
<input type="text" id="filterDate" name="date" required/>
<br />
<h3>Description:</h3>
<textarea rows="2" cols="40" name="description" id="description" required>
</textarea>
<br />
<button type="submit" id="myBtn">Open Modal</button>
</div>
</div>
</form>
<div class="modalDialog" title="Preview" style="display:none;">
<span class="title" ><?php echo $_POST['title'] ?><br /></span></p>
<p>Image :<span class="image"><img src="<?php echo $_POST['image'] ?>"/></span></p>
<p>Date : <span class="filterDate"></span></p>
<p>description : <span class="description"></span></p>
</div>