There is a new user registration form, which by default sends the processing result to the confirm.php page. And I want to make sure that the result is triggered and displayed in a pop-up window without switching to another page. Here I sketched Fidl , but I can not understand which way to go next.

 function closeSelf() { self.close(); return true; } $('.confirmation').submit(function() { $.ajax({ success: function(data) { $(".confirmation").magnificPopup({ items: { src: '#confirmation', type: 'inline' } }); } }); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form action="/system/wpacert" method="post" enctype="multipart/form-data" onsubmit="return closeSelf()" name="certform" action="confirm.php"> <input type="text" value="Имя" /> <input type="password" value="Пароль" /> <div>Сертификат: <input type="file" name="cert1" /> </div> <div> <input class="confirmation" type="submit" value="Добавить" /> </div> </form> <div id="confirmation" class="mfp-hide"> <h2>Результат</h2> <p>Имя</p> <p>Пароль</p> <p>Сертификат №</p> </div>

  • So open the MA after a successful registration, what's the problem? I do not see problems. - ikerya
  • one
    @ikerya the problem is that there is a transition to the next village, but I need to stay on the same, but at the same time, so that the query worked out - Vasya

2 answers 2

A similar question was discussed in this topic https://stackoverflow.com/questions/7845866/how-to-set-the-input-value-in-a-modal-dialogue

 $('#modal-from-dom').bind('show',function() { $(".modal-body #wall-post").val($("#linkURL").val()); }); <html>

Sample page

 <html> <head> <title>Example</title> <script src="scripts/jquery.min.js"></script> <script src="scripts/bootstrap-modal.js"></script> <link rel="stylesheet" href="scripts/bootstrap.min.css"> <link rel="stylesheet" href="main.css" /> <script type="text/javascript"> $(document).ready(function() { $('#modal-from-dom').bind('show',function() { $(".modal-body").html($("#linkURL").val()); }); }); </script> </head> <body> <!-- The Modal Dialog --> <div id="modal-from-dom" class="modal hide fade"> <div class="modal-header"> <a href="#" class="close">&times;</a> <h3>Add Link</h3> </div> <div class="modal-body"> <!-- <form id='post-on-wall' method='POST' action='savePost.php' enctype='multipart/form-data'>" <input type='text' class='label-inline' name='linkURL' id='wall-post' value=linkURL> </form> --> </div> <div class="modal-footer"> <a href="#" class="btn primary">Add Link</a> </div> </div> <div class="container"> <div class="wall-post"> <textarea class='label-inline' name='linkURL' id='linkURL'></textarea> <button data-controls-modal="modal-from-dom" data-backdrop="true" data-keyboard="true" class="btn">Add Link</button> </div> </div> </body>

In your case, do you want the data entered by the user in the form to appear in the modal window, or would the response from the server be displayed?

If the latter, then you must use AJAX.

Update:

I understand your task. Quickly edited an example.

 <!DOCTYPE html> <html> <head> </script> <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ $(function() { $( "#dialog" ).dialog(); }); $.ajax({url: "/system/wpacert", success: function(result){ $("#dialog").html(result); }}); }); }); </script> </head> <body> <div id="dialog" title="Basic dialog"></div> <button>Получить результат</button> </body> </html>
  • everything is correct, so that the response from the server is displayed - until I come to this option jsfiddle.net/vGAsL/64 - Vasya
  • Try an edited example and let us know about the results. If something does not work out - ask questions. - Anton Kovylin
  • In general, this method does not work, nor does the modal window appear and the page at all reloads - Vasya
  • one
    Judging by the description, you have not loaded the scripts. Corrected Update option. Try it - Anton Kovylin
  • I tried it - a pale, barely noticeable pop-up window with the words "basic dialog" appears and the page reloads, i.e. ajax does not work ... - Vasya

@ikerya the problem is that there is a transition to the next village, and I need to stay on the same, but at the same time, so that the request worked

When using a form, do not redirect will fail. Use $ .get || $ .post || $ .ajax