Как отключить кнопку сохранения и поле ввода при нажатии кнопки сохранения и перенаправить на новую страницу? - PullRequest
1 голос
/ 11 июля 2020

Это моя страница формы. Когда я нажимаю кнопку сохранения, поле ввода и кнопка сохранения должны быть отключены, а для отправки формы она направляется в сообщение. jsp и если я нажимаю кнопку редактирования, тогда поле ввода и кнопка сохранения должны быть включены и для редактирования содержимого должен перенаправить на страницу message1. jsp. Но ничего не происходит. Пожалуйста, скажите мне, что я делаю не так. Я новичок в этих вещах.

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html >
<head>
    <title>ed</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#btn1").click(function () {
                $("#tt1").attr('disabled', 'disabled');
                $("#btn1").attr('disabled', true);
                window.location.href = "message.jsp";
            });
           $('#btn2').click(function () {
              $('#tt1').removeAttr('disabled');
              $('#btn1').removeAttr('disabled');
      
          });
    });
  </script>  
</head>
<body>

<form id="answer">
  <input type="text" value="xyz" id="tt1" /><br />
  <button type="submit" id="btn1">Save</button>
  <button type="submit" id="btn2">Edit</button>
</form>
</body>
</html>

EDIT: Что я хочу при нажатии на кнопку сохранения все поля и кнопка сохранения отключаются и перенаправляются на Servletcontroller для отправки формы (в качестве примера я взял message. jsp), а затем перенаправляют в другое место в соответствии с кодом. И когда я снова открываю эту страницу все поля и кнопка сохранения должны быть отключены до тех пор, пока не будет нажата кнопка редактирования. РЕДАКТИРОВАТЬ 2: то, что я хочу, - это когда страница загружается в первый раз, все должно быть включено, после нажатия кнопки «Сохранить» поле n должно отключаться, и когда я снова открою эту страницу для редактирования, после нажатия на кнопку редактирования, то должны быть включены только отключенные поля.

1 Ответ

1 голос
/ 11 июля 2020

Если я правильно понял ваш вопрос, в настоящее время вы просто перенаправляете на другую страницу без отправки. Если вам нужно submit значение для следующей страницы, вы можете просто изменить action своей формы на требуемую страницу, а затем отправить свою форму на Эта страница со значениями. Также, если вам нужно, чтобы значение было доступно на другой странице, вам нужно использовать атрибут readonly вместо disabled.

Демо-код :

$(document).ready(function() {
  $("#btn1").click(function() {
    $("#tt1").attr('disabled', 'disabled');
    $("#btn1").attr('disabled', true);
    //change action to message.jsp
    $("#answer").attr('action', 'message.jsp');
  $("#answer").submit(); //submit
   
  });
  $('#btn2').click(function() {
    $('#tt1').removeAttr('disabled');
    $('#btn1').removeAttr('disabled');
   //change action to message1.jsp
   $("#answer").attr('action', 'message1.jsp');
  $("#answer").submit(); //submit
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="answer" action="">
  <input type="text" value="xyz" id="tt1"  /><br />
  <button type="submit" id="btn1" >Save</button>
  <button type="submit" id="btn2">Edit</button>
</form>

Обновление 1 :

Вы можете сохранить значения нажатой кнопки, используя localStorage и когда ваша страница снова загрузится, вы можете проверить значение save в localStorage и в зависимости от этого отключить или включить кнопку.

Ваш jquery код:

$(document).ready(function() {
  //check if there is any value in localStorage
  if (localStorage.getItem("save") != null) {
    //get that value
    var value = localStorage.getItem("save");
    alert(value);
    //if value is btn1
    if (value == "btn1") {
      //disable
      $("#tt1").attr('disabled', 'disabled');
      $("#" + value).attr('disabled', true);

    } else {
      //enable
      $('#tt1').removeAttr('disabled');
      $('#btn1').removeAttr('disabled');
    }
  }
  $("#btn1").click(function() {
    $("#tt1").attr('disabled', 'disabled');
    $("#btn1").attr('disabled', true);
    var save = "btn1";
    console.log(save);
    localStorage.clear(); //clear previous data
    localStorage.setItem("save", save); //add data to storage
    //change action to message.jsp
    $("#answer").attr('action', 'message.jsp');
    $("#answer").submit(); //submit

  });
  $('#btn2').click(function() {
    $('#tt1').removeAttr('disabled');
    $('#btn1').removeAttr('disabled');
    var save = "btn2";
    console.log(save);
    localStorage.clear(); //clear previous data
    localStorage.setItem("save", save); //add data to storage
    //change action to message1.jsp
    $("#answer").attr('action', 'message1.jsp');
    $("#answer").submit(); //submit
  });
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...