I have page with multiple forms, which are hidden based on what link is active. One of these forms is using redactor and I want to send the user back to this page with the redactor form open on submit. By default the page refreshes on submit and it shows the default form for that page. I couldn't find anything about this in the docs. If anyone knows how to accomplish this please let me know. Thanks
To solve this you need to use window.location.hash with this you can send a hash variable to the URL when you click on the link to get to your form.
The urlHash works as follows:
var UrlHashVal = window.location.hash.substr(1); //get the hash value and store as a var
$('form').hide(); //hide all forms by default
$('form#' + UrlHashVal).show(); //show the form whose id matches the hash value
What this does is enable you to send a link to someone, like http://ucanstayatthe.ym.ca#myForm and it will open that page with form#myForm on display.
Now all we have to do is enable this urlHash to work within the page as well. On the page we show/hide the forms based on links. All we need to do is write the formID to the URL from the link. To do this simply add the fromID to your href eg. "#myForm". Now when you click that link it will display #myform at the end of the windowURL.
This solves all of the problems because now when the page refreshes on the Redactor submit, it will reload the URL including the hashValue that you have written to it. SO instead of reloading http://ucanstayatthe.ym.ca it will reload http://ucanstayatthe.ym.ca#myForm which in turn will show the correct from.
Bingo
Related
We are using Marketo form for lead capturing and using munchkin for lead tracking. Right now, we are facing an issue: when we browse the website for the first time the Marketo form is loading properly and submitted successfully but after the first submission the Marketo form does not show up agian. We are using WordPress for our website.
We are using this Marketo js: //app-sj17.marketo.com/js/forms2/js/forms2.min.js
Loading form as follows:
MktoForms2.loadForm("//app-sj17.marketo.com", "025-WCE-875", 1000, function(form) {
// Add an onSuccess handler
});
Putting it inside : <form id="mktoForm_1000" style="display:none;"></form>
Any help will be valuable.
Thanks
In the form editor there is a setting that affects this behaviour.
Go to the Settings tab in the form editor and look for the “If Known Visitor, Show” setting. Make sure that you have the “Form” option selected as opposed to the Custom HTML”. Please see the screenshot below.
Explanation: before the first form fillout your visitor is unknown, so the form is shown every time. However, after the form submission your visitor will be known, thus if you have this setting enabled, the form will be hidden afterwards.
I have the following code on a web page:
<a class="schedule-apt-btn" onclick="window.open('http://www.zocdoc.com/test');"> Appointment</a>
The URL that the window opens is populated dynamically and I want to be able to track clicks based on the URL. If the URL contains "zocdoc", i want to store that as one trigger. If the URL contains "hospital", I want to store that in another trigger.
How do I configure this? None of the preset event triggers (like Click URL) seem to work. Do i need to create a custom one? Any guidance would be great!
Enable the built in {{Click Element}} variable and then write a custom JS variable that return the onclick attribute (e.g. via {{Click Element}}.getAttribute('onclick')). You will probably have to disable "Check validation" if you use a link click trigger. The reason {{Click URL}} does not work is that there is no href, hence no click url (and on a link trigger that checks validation this would not be considered a valid link).
I am really hoping someone can help. Searched my heart out, but didn't seem to find anything on this.
What I want to do is:
User is in a page where cf7 is, and fills in details. I then redirect the user to a separate page using on_sent_ok: "location.replace('pageurl');"
How do I display the value of the user input name on the redirection page?
If you don't want to do any programming or need your client to be able to easily edit what is on each page of the form you can use the following plugin:
Contact Form 7 Multi-Step Forms
You can just add tags to the form builder that will separate pages. I chose this plugin because I wanted my client to be able to edit the form easily. If you use the code mentioned by purvik7373 you will need to make the updates to change form fields.
First change the on_sent_ok to:
on_sent_ok: 'my_custom_redirect();'
then create that my_custom_redirect() function in the page that displays the form:
<script>
function my_custom_redirect() {
var your_name = document.getElementById('YOUR_NAME_FIELD_ID').value; // get value from your input field (YOUR_NAME_FIELD_ID) id
var url = 'https://www.example.com/?name='+your_name+''; // your redirection url
window.location = url;
}
</script>
I have a form with a textarea and a submit button in one page
which asks the user to input/paste the url of any image in the textarea
Form link:
https://m.ak.fbcdn.net/sphotos-d.ak/hphotos-ak-frc1/t1.0-9/1538781_610742105669484_767973390_n.jpg
and after the user hits submit
it should redirect it to the next page and create a dynamic image preview in the next page with the entered url in the submitted form from the previous page
Image Page:
https://m.ak.fbcdn.net/sphotos-b.ak/hphotos-ak-prn2/t1.0-9/10157400_610742102336151_950503816_n.jpg
I can't figure out how to catch the image url in the next page and create a preview. Kindly help. Please accept my gratitude in advance.
Useing Javascript you can show image preview on same page.
TO show preview after form submit try to access '$form_state' or override node.tpl.php for particular content type and get text area value using node_load function and add it to IMG tag.
Cheers!!!
Once submited, you should be able to get the submited image from the "$form_state" array. You then put it in the "src" attribute of a html image tag.
I am looking for a way to wire up an ASP:LinkButton to appear as a link but in the background (100% in the code behind, no dummy pre-filled form in the markup) do a form post (target=_blank). I have a form action, method and parameters to pass that I will query for in the "click" event of the LinkButton. What is the best way to accomplish this?
Well there are LOTS of ways to do what i think you are trying to do :)
One problem; standard pop-up's don't fire event handler calls as they are mapped via post-back to the page i believe.
If you are happy with GET only submissions:
OPTION A:
Add your link button with no target set and setup a post back event handler for click
setup your URL and pass it back to the page into a JS function that will load right away eg or use jquery etc.
in the JS function you load the URL using window.open() with the target set to "_blank"
EFFECT:
User clicks the link, all code is server-side that works out the URL to show, page refreshes back to where it was and a popup window then loads showing the new URL
OPTION B:
Setup the link to have target="_blank"
make it call a new page or the same page with a querystring argument you can pre-process in the page_load()
in the new page or controlling block of code, do your calculations and Response.Redirect() to the new target
EFFECT:
User clicks the link, no page refresh just a new popup right away with a redirect to the new page. This is a cleaner solution i think!
IF you need POST support:
Dynamically create either elements or a string of HTML representing a form with all the needed input elements and output it into the popup window (using option b as a rough start template) and have a onload submit the form right away which will perform a POST to the URL you decided via server-side script giving the same effect as option b but with a form level POST.