JQuery AJAX пост останавливается при вызове - PullRequest
0 голосов
/ 02 октября 2018

Я новичок в веб-разработке и занимаюсь разработкой jsp веб-приложения для своего колледжа.Я хочу использовать ajax для операций вставки, обновления и удаления в таблице.Но когда выполнение достигает сценария ajax, выполнение просто останавливается и результат не отображается.Ниже мой код:

<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.Statement"%>
<%@page import="org.h2.tools.Server"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@page import="org.h2.Driver"%>

<link href="BSTemplate/4.1.3/css/bootstrap.min.css" rel="stylesheet">
<link href="Styles/login.css" rel="stylesheet">
<script src="BSTemplate/4.1.3/js/bootstrap.min.js"></script>
<script src="Scripts/JQuery/3.2.1/jquery.min.js"></script>
<script>
function post_(){    
    $.post("newjsp.ajax.jsp",
    {
      username: document.getElementById("username").value,
      password: document.getElementById("password").value
    },
    function(data,status){
        if(data.trim() ==="success")
            window.location="Home.jsp";
        else
            alert("Data: " + data.trim() + "\nStatus: " + status);
    });
}
</script>
<body>
<div id="login">
    <div class="container">
        <div id="login-row" class="row justify-content-center align-items-center">
            <center><img src="Img/Image1.png" alt="Image Cannot Be Displayed"/></center>
            <div id="login-column" class="col-md-6">
                <div id="login-box"  class="col-md-12">
                    <div id="login-form" class="form">
                        <h3 class="text-center text-info">Member Login</h3>
                        <div class="form-group">
                            <label for="username" class="text-info">Username:</label><br>
                            <input type="text" name="username" id="username" placeholder="User Name" tabindex="1" class="form-control" required="true" autofocus>
                        </div>
                        <div class="form-group">
                            <label for="password" class="text-info">Password:</label><br>
                            <input type="password" placeholder="Password"  required="true" name="password" id="password" tabindex="2" class="form-control">
                        </div>
                        <div class="form-group">
                            <input type="submit" name="submit" onclick="post_()" tabindex="3" class="btn btn-info btn-md" style="width:100px" value="Login">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>

Ответы [ 2 ]

0 голосов
/ 03 октября 2018

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<link href="BSTemplate/4.1.3/css/bootstrap.min.css" rel="stylesheet">
<link href="Styles/login.css" rel="stylesheet">
<script src="BSTemplate/4.1.3/js/bootstrap.min.js"></script>
<script src="Scripts/JQuery/3.2.1/jquery.min.js"></script>
<script>

function post_(){  

    $.post("newjsp.ajax.jsp",
    {
      username: document.getElementById("username").value,
      password: document.getElementById("password").value
    },
    function(data,status){
    alert(status);
        if(data.trim() ==="success")
            window.location="Home.jsp";
        else
            alert("Data: " + data.trim() + "\nStatus: " + status);
    }).fail(function(msg) {
    alert( "error"+JSON.stringify(msg) );
  });
}
</script>
<body>
<div id="login">
    <div class="container">
        <div id="login-row" class="row justify-content-center align-items-center">
            <center><img src="Img/Image1.png" alt="Image Cannot Be Displayed"/></center>
            <div id="login-column" class="col-md-6">
                <div id="login-box"  class="col-md-12">
                    <div id="login-form" class="form">
                        <h3 class="text-center text-info">Member Login</h3>
                        <div class="form-group">
                            <label for="username" class="text-info">Username:</label><br>
                            <input type="text" name="username" id="username" placeholder="User Name" tabindex="1" class="form-control" required="true" autofocus>
                        </div>
                        <div class="form-group">
                            <label for="password" class="text-info">Password:</label><br>
                            <input type="password" placeholder="Password"  required="true" name="password" id="password" tabindex="2" class="form-control">
                        </div>
                        <div class="form-group">
                            <input type="submit" name="submit" onclick="post_()" tabindex="3" class="btn btn-info btn-md" style="width:100px" value="Login">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>

Это работает.Пожалуйста, проверьте правильность загрузки библиотеки jquery.

0 голосов
/ 02 октября 2018

Загрузка js в правильном порядке,

сначала вам нужно загрузить библиотеку Jquery, а затем что-нибудь еще, потому что другая библиотека или код js будет работать только при загрузке jquery,

<script src="Scripts/JQuery/3.2.1/jquery.min.js"></script> 
<script src="BSTemplate/4.1.3/js/bootstrap.min.js"></script>

PS: сначала вы всегда должны проверять сообщения об ошибках, которые вы получаете

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...