I Have an HTML Form And I Want to Find Out the IP and Country When Users Submit the Form.
I Can See the User's Information, But How Can I Send It Hidden?
What Do I Need To Add To My Form Or Javascript Code?
<div id="ip"></div>
<div id="address"></div>
<hr/>Full response: <pre id="details"></pre>
<script>$.get("http://ipinfo.io", function (response) {
$("#ip").html("IP: " + response.ip);
$("#address").html("Location: " + response.city + ", " + response.region);
$("#details").html(JSON.stringify(response, null, 4));
}, "jsonp");</script>
Example: For example, This is How I Can Get UTM Information. In the Same Way, I Want to be Able to Get the IP and Country Like This. I Use Webhook in My Post.
<input type="hidden" name="utm_source" value="">
<input type="hidden" name="utm_medium" value="">
<input type="hidden" name="utm_campaign" value="">
<script>var queryForm=function(e){var t=!(!e||!e.reset)&&e.reset,n=window.location.toString().split("?");if(n.length>1){var o=n[1].split("&");for(s in o){var r=o[s].split("=");(t||null===sessionStorage.getItem(r[0]))&&sessionStorage.setItem(r[0],decodeURIComponent(r[1]))}}for(var i=document.querySelectorAll("input[type=hidden], input[type=text]"),s=0;s<i.length;s++){var a=sessionStorage.getItem(i[s].name);a&&(document.getElementsByName(i[s].name)[0].value=a)}};setTimeout(function(){queryForm()},3e3);</script>
I assume that you have successfully received the data (ip, lcoation). In your JS you write the values into your HTML (id="ip", id="address"). Now you can collect the data again when sending it to your server.
const ip = document.getElementById('ip');
const address = document.getElementById('address');
const data = { ip: ip, address: address };
fetch('https://youDomain.tld/profile', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
})
.then(response => response.json())
.then(data => {
console.log('Success:', data);
})
.catch((error) => {
console.error('Error:', error);
});
And if you do it hidden means that you have to add some style to hide the div tags with the ip=ip and id=address. Inline style <div id="ip" style="display:none;"></div>