Я пробовал в течение 2 дней, но все равно не повезло!
я хочу
вот пример кода!
index.php
<form id="myform" method="post" action="result.php" target="_blank"> <input type="text" name="userId" id="userId"/> <input id="button" type="submit"/> </form> result.php
<div id="resultModal" class="modal fade" tabindex="-1"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true"> <i class="fa fa-times-circle"></i>ESC</button> <h4 class="modal-title">Show Result </h4> </div> <div class="modal-body"> </div> </div> </div> </div>
В модульном теле
<?php $selectedId = $_POST['userId']; echo $selectedId; ?>
И JQuery
<script type="text/javascript"> $('#myForm').on('submit', function(ev) { var userId = $('#userId').find("input").val(); $.ajax({ type: 'POST', url : $(this).attr('action'), data: userId, success: function () { // alert('form was submitted'); } }); }); </script>
Ну, это займет у меня некоторое время, но я думаю, что я нахожу ответ на ваш вопрос, или, по крайней мере, это решение является хорошей подсказкой для продолжения этого, что вы делаете.
Первый index.php: здесь вам нужно иметь форму с полем ввода и одной кнопкой, которую мы будем называть модальной, и отправить форму (используя Ajax для сообщения)
<form id="form" method="post"> <div id="userDiv"><label>UserId</label> <input type="text" name="userId" id="userId" placeholder="UserId"/> <br></div> <button type="button" id="btn" class="btn btn-info" data-toggle="modal" data-target="#myModal">Send Data</button> </form>
Тогда вам понадобится модальный, где вы будете размещать контент с удаленной страницы. В модальном теле вы добавляете еще один тег div с id = "bingo", чтобы найти его легко 🙂 вот так
<div class="modal fade" id="myModal" 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-label="Close"><span aria-hidden="true">×</span></button> <h4 class="modal-title" id="myModalLabel">MyModal</h4> </div> <div class="modal-body"> <div id="bingo"></div> </div> </div> </div> </div>
На этой странице также должен быть тег скрипта, который будет выполнять всю работу. Важно, чтобы он был помещен после тега скрипта, где вы загружаете файл jquery.
<script> $(document).ready(function(){ $("#btn").click(function(){ var vUserId = $("#userId").val(); if(vUserId=='') { alert("Please enter UserId"); } else{ $.post("result.php", //Required URL of the page on server { // Data Sending With Request To Server user:vUserId, }, function(response,status){ // Required Callback Function $("#bingo").html(response);//"response" receives - whatever written in echo of above PHP script. $("#form")[0].reset(); }); } }); }); </script>
И последнее, но не последнее. Result.php
<?php if($_POST["user"]) { $user = $_POST["user"]; // Here, you can also perform some database query operations with above values. echo "Your user id is: ". $user; } ?>
PS Надеюсь, я не путал где-нибудь с id, переменными или схожими, потому что я пытаюсь настроить решение на ваш пример. Я надеюсь, что это то, что вам нужно, или, по крайней мере, это будет ключом к выполнению вашей задачи. Все еще думайте, что это можно сделать на одной странице, но мне было интересно попытаться найти способ сделать эту работу … GL!