Simple HTML/PHP Form

[That Guy]

So I’m working on a simple intranet page for work, it will be using a bootstrap template and be hosted on a private github repo.

Its all text apart from the 1 form I need to quickly track customers parcels when then are on the phone.

I just need 2 boxes next to each other on the form, one to enter tracking number and the other to enter a postcode, along with a button that says “Track”

This will be using the URL below with the two variables. I think I need to use the PHP GET function from the research I have done but not sure?

https://dx-track.com/track/DX.aspx?consno=[TRACKING_NUMBER]&postcode=[POST_CODE]

Anyone able to advise on this please?

 

[Peter UK]

So when you submit the form you want it to go to that page with the values filled in already?

If that's the case you don't need PHP at all, you can do it with simple HTML, I'm not a frontend guy but this should get you pretty much there:

<form action="https://dx-track.com/track/DX.aspx">
<label for="consno">Tracking Number: </label>
<input type="text" name="consno" id="consno">
<label for="postcode">Postcode: </label>
<input type="text" name="postcode" id="postcode">
<input type="submit">
</form>

 

[Dup]

Something like the below should do it, it'll direct to the DHL site and leave your intranet however this will be the case unless they have an API you casn use to return the tracking info.

<form id="trackingForm" action="https://dx-track.com/track/DX.aspx" method="get">
    <label for="consno">Consignment No:</label>
    <input type="text" name="consno" id="consno">
    <label for="postcode">Postcode:</label>
    <input type="text" name="postcode" id="postcode">
    <input type="submit" value="Submit">
</form>

Just add on the Bootstrap classes to make it look nice.

Doh, almost the same ar Peters! haha.

 

[That Guy]

Absolutely amazing thanks for your help peeps!

 

[Peter UK]

Doh, almost the same ar Peters! haha.

To be fair I'm not sure there's many other ways you can write this!

 

[That Guy]

Thank you for the above examples I have used them to make 4 different tracking forms, and they all work perfect there is one I am struggling to create, I’m certain its an easy one but I cannot get my head around it.

It’s to track using this URL layout:

https://www.collectplus.co.uk/track/[TRACKING-NUMBER]

So its just that tracking number at the end that changes, I think this is confusing me because the URL layout doesn’t use any ? or = symbols its just a straight URL if that makes sense.

Thanks in Advance

 

[visibleman]

Could be tidier but something like the below should work -

<form name="cpForm" id="cpForm">
    <label for="trackingNo">Tracking No:</label>
    <input type="text" name="trackingNo" id="trackingNo">
    <input type="submit" value="Submit">
</form>
<script>
    document.querySelector("#cpForm").addEventListener("submit", function(e) {
        e.preventDefault(); // Prevent Default Submit
        var eltrackingNumber = document.getElementById("trackingNo");
        if (eltrackingNumber.value.length !== 0) window.location.replace("https://www.collectplus.co.uk/track/" + eltrackingNumber.value);
    });
</script>