0

I have an input button that submits content from the front end for review in the back end. The problem is it doesn't show a confirmation message - it's not setup as a form otherwise this would be easy (I cannot change it to a form either).

The input button has a unique ID - I would like to add a small delay of say 5 seconds when the button is clicked AND it to show a message saying 'thanks the content has been submitted for review'. Is this possible with Javascript or PHP?

The code I have for the button is: 

<input type="button" class="button-primary" id="wdqs-post" value="Post">
RICKY DAWN
  • 31
  • 2
  • 8

2 Answers2

0

Is this what you want? Test

Example Test1:

HTML Test1:

<input type="button" value="Test" onclick="showAlert();"></input>

JAVASCRIPT Test1:

function showAlert() {
    setTimeout(function() {
        alert('thanks the content has been submitted for review');
    },5000);   // 5 seconds
}

Example handling the onclick with javascript and showing the alert before delay: Test2

JAVASCRIPT Test2:

document.getElementById("myButton").onclick=function(){showAlert()};

function showAlert() {
    alert('thanks the content has been submitted for review');

    setTimeout(function() {
        // DO OTHER STUFF
    },5000);   // 5 secon
}

Example showing the alert in a DIV: Test3

HTML Test3:

<input id="myButton" type="button" value="Test"></input>

<div id="alert" style="display: none;">
    thanks the content has been submitted for review.
</div>

JAVASCRIPT Test3:

document.getElementById("myButton").onclick=function(){showAlert()};

function showAlert() {
    document.getElementById("alert").style.display = "block";

    setTimeout(function() {
        // DO OTHER STUFF
    },5000);   // 5 secon
}

CSS Test3 (very simple):

#alert {
     border: 1px solid;
     height: 20px;
     width: 400px;
     position: absolute;
     left: 150px;
     top: 40px;
}
maqjav
  • 2,310
  • 3
  • 23
  • 35
  • Wow thanks for the quick reply - something like this is what I wan't but ideally not an alert, instead for it to show a hidden div or something. Also I cannot add a onclick function or anything to the button so it will need to be grabbed via ID if possible? – RICKY DAWN Jun 20 '13 at 09:09
  • I just tested this, is it possible to have the alert show straight away rather than after the delay? – RICKY DAWN Jun 20 '13 at 09:11
  • @RICKYDAWN I eddited the script handling the onclick with JS and showing the script before the delay. Give me a sec and I will show you how to show a hidden div. – maqjav Jun 20 '13 at 09:54
  • Perfect thanks for the help with this - a quick question on the section 'DO OTHER STUFF' what goes here, because I am not sure exactly where it goes or what the button does (apart from submit content to the admin) is there a line I can add there that basically says 'do whatever the button was going to do' :/ – RICKY DAWN Jun 20 '13 at 10:50
  • @RICKYDAWN you can remove that setTimeout function. I left it there if you want to do something else after showing the alert, and 5 seconds after your click the accept button in the alert message. – maqjav Jun 20 '13 at 10:55
  • I tried setting this up, but no luck - please can you see here: https://fapps.wrdadmin.co.uk/pruprotect/informationform/ It's the post button (you'll need to login with FB) – RICKY DAWN Jun 20 '13 at 10:56
  • I don't have a FB account :( – maqjav Jun 20 '13 at 10:59
  • Ahh ok - I'm getting this in the console:Uncaught TypeError: Cannot set property 'onclick' of null - I placed the script in the header, and I tried it in the footer. – RICKY DAWN Jun 20 '13 at 11:02
  • Maqjav - it works now, you are a star. I cannot thank you enough!! – RICKY DAWN Jun 20 '13 at 11:04
  • The page needs to be rendered. Add it in an onload function: ``. JS: `function load() {document.getElementById("myButton").onclick=function(){showAlert()};}` – maqjav Jun 20 '13 at 11:05
0
if(isset($_POST['rbutton']) == null)
{   echo "thanks";
    $time = 2; 
    $url = "http://localhost/method/index.php";  
    Header("Refresh: $time; url=$url");  
    exit();
}

you can use these kind of php code, it shows message and after 2 second delay, re-direct any page you want... (this if is optional you can check another thing or server response)

railgun
  • 1
  • 1