2015-05-08 1 views
0

Я новичок в jQuery. Я хочу открыть форму во всплывающем диалоговом окне. Когда пользователь отправляет данные формы, необходимо вставить в базу данных MySQL & сообщение об успешном завершении должно отображаться в диалоговом окне.Показать сообщение об успешном завершении в окне всплывающего окна после формы submit

Я мог бы сделать диалог с формой, но как загрузить сообщение о успехе?

<head> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css"> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
    <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script> 
</head> 
<body> 
    <button id="dialog_trigger">open the dialog</button> 
    <div id="dialog" style="display:none;" title="Dialog Title"> 
     <form id="form1"> 
      <input type='text' name='data' id='data'/> 
      <input type='submit' id='submit'/> 
     </form> 
    </div> 
    <script> 
     $("#dialog_trigger").click(function() { 
      $("#dialog").dialog("open"); 
     }); 
     $("#dialog").dialog({ 
      autoOpen: false, 
      position: 'center' , 
      title: 'EDIT', 
      draggable: false, 
      width : 350, 
      height : 200, 
      resizable : true, 
      modal : true, 
     }); 
     $("#submit").click(function() { 
     // help  
     }); 
    </script> 
</body> 

PHP:

$data=$_REQUEST['data']; 
$q= mysqli_query($c,"INSERT INTO report (data) VALUES ('$data')") or die(mysqli_error()); 
if($q){ 
    echo "Your report is submitted!"; //this should appear in popup dialog 
} 
+0

Улучшения блока кода форматирования, как это помогает улучшить читаемость. Названия языков или библиотек не требуются в заголовке, потому что они являются частью тегов. Кроме того, не добавляйте теги, которые не имеют отношения к вопросу. CSS-тег не нужен для этого. – Harry

ответ

0

Используйте jQuery form plugin или аналогичные представления данных с помощью AJAX вызова.

Вашей точка ввода данных должно возвращать некоторые JSON закодированного значения, например

echo json_encode(array('message' => 'Thank you for your submission')); 

Теперь из стороны JavaScript использовать возвращаемое сообщение для заполнения модального содержания, как

$("#message").text(message); 
Смежные вопросы