Updating the URL in the address bar after pushing a button on a web page.

I have been googling this for hours and cant find the exact search terms to fix the issue.

So i have a mega with a W5100 sending a webpage.

On that webpage, there are a number of buttons. For example this:

client.println(F(“1 ml dosage pump 1 <a href=”/~setvar?Dosepump=1">Dose

"));

The page that holds this HTML code is called by going to http://192.168.0.180/~Admin

So the user goes to that page “http://192.168.0.180/~Admin” and pushes that button. It then leaves this in the address bar:
http://192.168.0.180/~setvar?Dosepump=1

So if the user presses refresh on the browser, it resends that request and does another dose. This is a BAD thing for this particular application.

How can i change that URL so that if the user pushes a button, the URL is then updated back to “http://192.168.0.180/~Admin” so that if refresh is pushed it doesnt resend that request?

I have looked at meta refresh, but if you set the value too low it just constantly refreshes the page, and if you set it too high, the risk of pushing F5 becomes too great, plus a constantly repeating page loading looks pretty bad, and i would also have to put in a custom meta refresh for each page and at the moment there are 6 pages. My code is modular so adding another page is done with about 4 extra lines of code, but having to customize my header writing code for each page is pretty hectic.

if its any use, this gets sent to the browser for every new page thats loaded.

void sendStart(EthernetClient &client, char *heading, byte refresh)
{ // sends the HTML start to each page, stored here to save space.

char temp[40];
char url[40];
client.println(F(“HTTP/1.1 200 OK”));
client.println(F(“Content-Type: text/html”));
client.println();
client.print(F(""));
client.print(heading);
client.println(F(""));
if(refresh) {

// meta refresh URL is created dynamically from the stored IP address pulled from EEPROM for this particular unit.

strcpy(url, “http://”);
strcat(url, dtostrf( eePROM[EE_IP0] , 0, 0, temp ));
strcat(url, “.”);
strcat(url, dtostrf( eePROM[EE_IP1] , 0, 0, temp ));
strcat(url, “.”);
strcat(url, dtostrf( eePROM[EE_IP2] , 0, 0, temp ));
strcat(url, “.”);
strcat(url, dtostrf( eePROM[EE_IP3] , 0, 0, temp ));
strcat(url, “/index.html”);

client.print(F("<meta http-equiv=“refresh” content="")); // need to get rid of this for “Settings” pages.
client.print(metaRefresh);
client.print(F("; url="));
client.print(url);
client.println("">");

} else

{
// client.print("<meta http-equiv=“refresh” content=“0;url=/~Admin”>");
// this doesnt work - kept for posterity at things that i tried but didn’t work
}

client.println(F(""));
client.print(F("<body bgcolor="#AAAAAA" text="#FFFFFF">"));
client.println(F("

<font face=“Arial”>"));
client.println(heading);
client.println(F("

"));
}

make an (invisible) inline frame and set the target of your href to this iframe.

This will keep the URL unchanged.
something like

<p class='value'><a href='?pulse2' target='i'>RelaisA</a>&nbsp;&nbsp;<a href='?pulse3' target='i'>RelaisB</a></p>
<iframe name='i' style='display:none' ></iframe>

Thank you, i will see if i can work out how to do that and set the target.
I am not much of a HTML coder im afraid.

it's nothing more than naming the iframe and set the target of the href to the name of the iframe.

btw, as I see a lot of client.println(F( ...
you should take a look on this also:

https://werner.rothschopf.net/microcontroller/202011_arduino_webserver_optimize_en.htm

Wow thank you noiasca, that client.print(F( was doing a great job of saving memory but that optimization stuff is fantastic.

As for the iframe, so i put the buttons inside the iframe? Sorry i litereally know about 4 commands of HTML and most of my html code is copied/based and adjusted to suit.

I did manage to heavily optimize the file sending code from the SD card and im getting around 30kb a second on large file transfers, but using F has shot me in the foot.

you’ve written that you have your button written as

client.println(F("1 ml dosage pump 1 <a href=\"/~setvar?Dosepump=1\"><button>Dose</button></a>

"));

and therefore you would add to the href the target i:

client.println(F("1 ml dosage pump 1 <a href=\"/~setvar?Dosepump=1\" target='i'><button>Dose</button></a>

"));

and i guess you know how to add the line with the iframe

You can use the PRG-pattern (Post/Redirect/Get)

or use some javascript and the fetch-api.

noiasca:
you’ve written that you have your button written as

client.println(F("1 ml dosage pump 1 <a href=\"/~setvar?Dosepump=1\"><button>Dose</button></a>

"));




and therefore you would add to the href the target i:



client.println(F(“1 ml dosage pump 1 <a href=”/~setvar?Dosepump=1" target=‘i’>Dose

"));




and i guess you know how to add the line with the iframe

I am pretty sure i know how to add the iframe line. I have been using an older copy of “Dreamweaver” to write the basic code, but i stayed away from iframes as i was told that they are horrible, and been using divs instead.
Thank you for your help so far though, i moved all my F( to PSTR code and my website is incredibly fast now.