jquery - Displaying POST response in Dialog -


hello i'm creating webpage test api , i'm sending form nodejs backend , backend return json response me. far sending request works fine , can see request lands on vps console, want create feedback on webpage well. how can create alert contains information response json? above code:

<html> <head>   <script src="https://code.getmdl.io/1.1.3/material.min.js"></script>   <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>   <link rel="stylesheet" href="https://code.getmdl.io/1.1.3/material.indigo-pink.min.css">   <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=material+icons"> </head> <body>    <!-- shows header, in smaller screens. -->   <div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">     <header class="mdl-layout__header">       <div class="mdl-layout__header-row">         <!-- title -->         <span class="mdl-layout-title">title</span>         <!-- add spacer, align navigation right -->         <div class="mdl-layout-spacer"></div>         <!-- navigation. hide in small screens. -->         <nav class="mdl-navigation mdl-layout--large-screen-only">           <a class="mdl-navigation__link" href="">link</a>           <a class="mdl-navigation__link" href="">link</a>           <a class="mdl-navigation__link" href="">link</a>           <a class="mdl-navigation__link" href="">link</a>         </nav>       </div>     </header>     <div class="mdl-layout__drawer">       <span class="mdl-layout-title">title</span>       <nav class="mdl-navigation">         <a class="mdl-navigation__link" href="">link</a>         <a class="mdl-navigation__link" href="">link</a>         <a class="mdl-navigation__link" href="">link</a>         <a class="mdl-navigation__link" href="">link</a>       </nav>     </div>     <main class="mdl-layout__content">      <div class="page-content">        <form action="#">          <center><p> <div class="mdl-textfield mdl-js-textfield">            <input class="mdl-textfield__input" type="text" id="email">            <label class="mdl-textfield__label" for="email">email...</label>          </div></p>          <p><div class="mdl-textfield mdl-js-textfield">           <input class="mdl-textfield__input" type="password" id="password">           <label class="mdl-textfield__label" for="password">password...</label>         </div></p>         <p><div class="mdl-textfield mdl-js-textfield">           <input class="mdl-textfield__input" type="text" id="username">           <label class="mdl-textfield__label" for="username">username...</label>         </div></p>         <p><div class="mdl-textfield mdl-js-textfield">           <input class="mdl-textfield__input" type="text" id="name">           <label class="mdl-textfield__label" for="name">name...</label>         </div></p>         <p><div class="mdl-textfield mdl-js-textfield">           <input class="mdl-textfield__input" type="text" id="surname">           <label class="mdl-textfield__label" for="surname">surname...</label>         </div></p>         <p> <div class="mdl-textfield mdl-js-textfield">          <input class="mdl-textfield__input" type="text" id="sex">          <label class="mdl-textfield__label" for="sex">sex...</label>        </div></p>        <p> <div class="mdl-textfield mdl-js-textfield">          <input class="mdl-textfield__input" type="text" id="age">          <label class="mdl-textfield__label" for="age">age...</label>        </div></p>        <p><div class="mdl-textfield mdl-js-textfield">         <input class="mdl-textfield__input" type="text" id="school">         <label class="mdl-textfield__label" for="school">school...</label>       </div></p>       <p> <div class="mdl-textfield mdl-js-textfield">        <input class="mdl-textfield__input" type="text" id="bio">        <label class="mdl-textfield__label" for="bio">bio...</label>      </div></p>      <p><button onclick="register()" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect" >       sign up!     </button></p>     <p><span id="msg-reg">result:</span></p>     <script type="text/javascript">       var register = function()        {         var email = $("#email").val(),         password = $("#password").val(),         username = $("#username").val(),         name = $("#name").val(),         surname = $("#surname").val(),         sex = $("#sex").val(),         age = $("#age").val(),         school = $("#school").val(),         bio = $("#bio").val();         $.ajax({           url: 'http://158.129.31.201:8000/newuser',           type: 'post',           data: {email: email, password: password, username:username, name:name, surname:surname, sex:sex, age:age, school:school, bio:bio, point:{type:"point", coordinates: [12.123456, 13.134578]},  type: 'register'}         }).then(function(data) {           $("#msg-reg").text(data);         });       };     </script>   </center> </form> </div> </main> </div>  </body> </html> 

$(function() {      $( "#btnopenmyaspx" ).button().click(function() {                      $( "#divforaspxpage" ).dialog({                           autoopen: true,                height: 500,                           width: 650,               modal: true,               close:function(){                     $(this).dialog('destroy');                           }                   });                      $.get("/newpage.aspx",function(data){                                $( "#divforaspxpage" ).html(data);            });         });    }); 

this trick used load pages in dialogs, can same way need, see more here http://bresleveloper.blogspot.co.il/2012/05/jquery-modal-dialog-with-aspx-page.html


Comments

Popular posts from this blog

magento2 - Magento 2 admin grid add filter to collection -

Android volley - avoid multiple requests of the same kind to the server? -

Combining PHP Registration and Login into one class with multiple functions in one PHP file -