使用php在弹出窗口中显示表单的图像

时间:2017-04-13 05:28:16

标签: javascript php jquery html ajax

我需要使用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>

0 个答案:

没有答案