document getElementById textContent is not functioning – Javascript

I need a bit of help / guidance. I’m sending data from one page to another. The data is sent from one textbox to another (in different page).
The data gets sent correctly and received on the other page correctly; but the value does not get inserted inside the textbox when recived:

This is where i’m passing the data:

const form = document.getElementById('form');
const SyrdariyaTotal = document.getElementById('SyrdariyaTotal');

form.addEventListener('submit', function(e){
    e.preventDefault();

const SyrdariyaTotalValue = SyrdariyaTotal.value;

localStorage.setItem('Syrdariya', SyrdariyaTotalValue);
console.log(localStorage)
window.location.href = "test.html"

I’m receiving it correct as the console.log shows the data has been received correct:

<input id="Syrdariya" type="text" onchange="adddata()">

const abc = localStorage.getItem('Syrdariya');
    console.log(abc)

document.getElementById('Syrdariya').textContent = abc;

localStorage.removeItem( 'Syrdariya' ); // Clear the localStorage
localStorage.clear();

but on this line document.getElementById('Syrdariya').textContent = abc; the data is not retrieved; not sure why the data is not getting inserted inside the text box.
The console log shows the data ha been passed.

Any guidance will appreciate it please.

Thanks