0

I have a page 2.html where if I submit an ID number, I get some output. It works with Ajax post, in which I send data along with the data parameter. At the same time, I have another page 1.html which has a list of IDs. What I want is if I click on an ID in 1.html, that click should pass that ID to 2.html, submit the form on 2.html and display that page.

The form in 2.html:

$("#form").on("submit", function(event) {
  $("#results").html("");
  $.ajax({
    data: {
      name: $("#nameInput").val()
    },
    type: "POST",
    url: "/similar"
  }).done(function(data) {
    /* ... */
  });
});

Then click in 1.html:

$("#id1").on("click", function(e) {});
guzmonne
  • 2,490
  • 1
  • 16
  • 22
Pratik Kadam
  • 23
  • 3
  • Not sure if I got it right, this might help you: https://stackoverflow.com/questions/29935771/how-to-ajax-post-after-a-form-submit – Christian Aug 23 '19 at 22:31

2 Answers2

0

does it have to be a POST? linking to another page with some variable is better done with a GET. Are you doing it for security purposes?

var href= "2.html?name=" + $('#nameInput').val();

then digest it on 2.html... php probably?

$nameVal = $_GET['name'];

or frontend js?

const urlParams = new URLSearchParams(window.location.search);
const myParam = urlParams.get('myParam');

read more about frontend query string here:

How can I get query string values in JavaScript?

dont forget to validate ALL input coming in ;)

Dan
  • 3,755
  • 4
  • 27
  • 38
0

There are several ways to do this, the best approach would be to save the value in session. 1) Using Session
Html5 now allows storing values in session. 

 // HTML5 session Storage
 sessionStorage.setItem("id","23");
 sessionStorage.getItem("id");

2) Using Cookies
You can use jquery to set/get values from Cookies.

$.cookie('id', '23', {expires: 1}); // expires in 1 day
var id = $.cookie('id');

3) Using Query String
The id from page 1 can be passed as GET parameter query to page2. eg: page2.htm?id=23

let searchParams = new URLSearchParams(window.location.search);
let param = searchParams.get('id');

4) Web Storage
With HTML5 web storage, web applications can store data locally within the user's browser. //HTML5 local storage localStorage.setItem("id","23"); localStorage.getItem("id");

Joshua S J
  • 61
  • 4