G
G
Gorthaur2015-10-18 14:22:15
PHP
Gorthaur, 2015-10-18 14:22:15

How to display php script data in modal window?

Greetings! There is a form in a modal window on bootstrap, which sends data using the POST method to the handler in php, it reads, gives a response, and it must be displayed back in this form. It is not possible to take the answer and display it in this modal window. How to be? I don’t know Javascript and Ajax at all, I found similar solutions on the Internet and adjusted them for myself.
modal window code:

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" 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">X</button>
        <h4 class="modal-title" id="myModalLabel">Добавить площадку</h4>
      </div>
<div id="result">
      <div class="modal-body">
      <form method="post" id="forms" action="javascript:void(null);" onsubmit="FormSendOK()">
<table class="table">
<tbody><tr>
<th class="lable">  Адрес:</th>
<td class="input"><input size="50" name="address" type="text"></td>
</tr>
<tr>
<th class="lable">IP-сервера:</th>
<td class="input"><input size="15" name="IP" type="text"></td>
</tr>
<tr>
<th class="lable">  SID:</th>
<td class="input"><input size="15" name="SID" type="text"></td>
</tr>
<tr>
<th class="lable">  Тип площадки: </th>
<td class="input"><select name="tabletype">
<option value="1">Старая</option>
<option value="3" selected="selected">Новая</option>
<option value="4">Сторонняя</option>
<option value="2">Тестовая</option></select></td>
<input type="hidden" name="submit" value="submit" >
</tr>
</tbody>
</table>
</div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Закрыть</button>
       <button type="submit" id="submit"  class="btn btn-primary" name="submit" value="submit">Добавить</button>
</form>
</div>
    </div>
  </div>
</div>

Script code
<script>
    var SendContactForm = {
       type: 'POST',
       resetForm: 'true',
       url: 'action3.php',
       success:    function(){
       }
      }
    function FormSendOK() {
        $(\"#forms\").ajaxSubmit(SendContactForm);
        $(\"#result\").html();
     }
</script>

handler piece:
if (count($msg) === 0) {
$answer="Данные добавлены!";
}
print ("$answer");

Answer the question

In order to leave comments, you need to log in

1 answer(s)
I
Ilya Levin, 2015-10-19
@gorthaur

You can see that jQuery is included, while you use ajaxSubmit (), although, as far as I know, it is not in standard jQuery (apparently, this is some kind of plugin?). jQuery has ajax() for this purpose , and it, in turn, has a success() callback function that can accept a server response. Judging by the code, the plugin you are using also has something similar (the success function in the "script code").
How it would look like using the built-in jQuery functionality:
Note that doing $(".modal-content").html(data) is bad practice, as you may have more than one element on the page with this class. It is better to assign an id to the block in which you will display the result and access it via $("#...").

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question