We have to send some data to open a new URL and avoid showing what data is sending, we can send the data in the background. To prevent sent data from showing at the URL, the following steps:
In HTML, in a tag or button tag, data-p=”URL” is the URL where to redirect or process the code. You can add various data like data-action, data-param, etc. to carry data as you need it. You can add any class as you require, but class=”menu” is required for the code.
Hyperlink code:
<a href="#" data-action="CustomGenerate" data-param="30" data-p="URL" class="menu ">New Link</a>
Button code:
<button data-action="CustomGenerate" data-param="30" data-p="URL" class="menu ">New Link</button>
In Javascript code:
1st line: $(document).ready(function() will load the function when the page is loaded, so it need not call the function like onClick
2nd line: $(‘.menu’).on(‘click’ will run the function when class=”menu” is clicked, so that class=”menu” is important on the link.
$(document).ready(function() {
$('.menu').on('click', function(e) {
e.preventDefault(); // Prevent default form submission behavior
const $this = $(this); // Use jQuery's `this` reference for better readability
const path = $this.data('p'); // Assume 'p' is the path, which should be predefined in data attribute
const form = $('<form>').attr({
method: 'POST',
action: path
});
// Iterate over each data attribute and add it as a hidden input
$.each($this.data(), function(key, value) {
form.append(
$('<input>').attr({
type: 'hidden',
name: key,
value: value
})
);
});
$('body').append(form);
form.submit();
});
});
recent comments