CODEWITHSUNDEEP
javascriptphpjqueryhtml
Coder
Coder

Reputation: 1139

On submit - page to refresh back to certain point on the webpage?

I have a contact form that is part of a homepage and when the user clicks 'contact us' the contact form pops out. What I would like to achieve is that when the user clicks the submit button on the contact form the page will refresh and then bring the user straight back to the contact form.

Is there a way in which this can be done using javascript/jquery/php maybe using an ID as an anchor point?

I have looked online to see if there are any direct answers to this and unfortunately I haven't had any luck so any help you can give would be great. Also some example code would be awesome :)

Upvotes: 0

Views: 89

Answers (1)

PierreN
PierreN

Reputation: 988

Wich such code it can work : 

$("#submit_form_button").click( function() {
    // we wait 1 second, so that the form has been submitted in ajax...
    setTimeout(function(){ location = window.location.href + "?action=display_form" }, 1000);

  // put "?action=display_form" or "&action=display_form" according the fact the page has already or not a ?xxx=yyy parameter
});

And replace submit_form_button with the ID of the submit button

So after the form is submitted, the page refreshes with the new parameter action=display_form, and then in your page you can add the following code : 

var getUrlParameter = function getUrlParameter(sParam) {
    var sPageURL = decodeURIComponent(window.location.search.substring(1)),
        sURLVariables = sPageURL.split('&'),
        sParameterName,
        i;

    for (i = 0; i < sURLVariables.length; i++) {
        sParameterName = sURLVariables[i].split('=');

        if (sParameterName[0] === sParam) {
            return sParameterName[1] === undefined ? true : sParameterName[1];
        }
    }
};


$( document ).ready(function() {
    if (getUrlParameter('action') =="display_form") {
         // i launch the JS code for redisplay me form here 
         // (using jquery to set the contact form CSS property to 'display: block;')
    }
});

Upvotes: 1

Related Questions