Develop Reference

Add hidden form variable to the end of the URL

I have searched Unbounce and Google for documentation, but can't find a way to make this work. Any help is greatly appreciated!
Use case:
I have a test page setup in Unbounce and it would be great when a user lands on the page and submits the form that the value being generated through the script below in the hidden field is added to the current URL upon submission.
It's important that if the user lands on the page from an advertising campaign that the value is added to URL and does not replace it.
Example:
User lands on testpage.com or testpage.com?qs=3134728&pcd=THANKS20&dclid=CNi4wvCv39cCFZdFNwodE_wALA
Unique ID is created with the following JavaScript and added to a hidden field:
<script type="text/javascript">
$(document).ready(function() {
var id = new Date().toISOString().replace(/[-tTzZ:.]/g, '');
$('#lead_id').val(id);
});
</script>
User clicks submit and and is redirected to a thankyou page with the value of the hidden field passed in the URL:
testpage.com/thank-you?lead_id=1234
testpage.com/thankyou?qs=3134728&pcd=THANKS20&dclid=CNi4wvCv39cCFZdFNwodE_wALA&lead_id=1234
I should also mention that I can not edit the html of the form so this would need to happen with JavaScript as Unbounce provides a space to add custom code.

Is the form method get? If it is post it wont append that to the URL for the hidden field.
Your approach seems right however if this is the HTML on page:
<form action="http://example.com" method="get" id="theForm">
<input type="hidden" value="xyz" />
<button type="submit">Send</button>
</form>
You can use some JS code like one of the following to modify this...however you'll want to verify that everything still works as expected:
document.getElementById('theForm').action = "http://another.example.com";
document.getElementById('theForm').method = "get";

Using an input to search a local webpage in HTML

I'm stuck on this problem for now a couple of days and I have no idea what to do. I want to navigate directly to another page from my own website only by writing the page name(without the ".html" or ".php" in the input.
Example: you write "index" in the textbox and once you click on the submit button it sends you to "http://www.website.com/index.html". Instead of doing that, it sends me to "http://www.website.com/?2016=index&.=html"
I got it totally wrong because it sends the input names and some symbols around them.
This is my HTML code:
<form id="newsearch" method="get" action="http://www.website.com/">
<p>Enter your confirmation number:</p>
<input type="text" id="searchvalue" class="textbox1" name="2016" size="50" maxlength="120"><input type="submit" class="button1" value=">">
<input type="hidden" id="hiddenvalue1" name="." value="html">
</form>

Your current code simply submits a form, so it is quite correctly adding the entered value as part of the query string ?2016=index&.=html".
To navigate to the location, add a submit handler to the form that cancels the default form navigation and instead sets window.location to the relevant value, perhaps something like this:
document.getElementById("newsearch").addEventListener("submit", function(e) {
e.preventDefault();
var searchText = document.getElementById("searchvalue").value;
var extension = document.getElementById("hiddenvalue1").value;
window.location = this.action + searchText + "." + extension;
// or if you don't want to use the form's action attribute to specify
// the domain you could hardcode it in the function:
// window.location = "http://www.website.com/" + searchText + "." + extension;
});
(Update: the above code would need to be in a script element that is after the form element, and/or in a DOMContentLoaded or window.onload handler.)

Adding Own amount on payment button

Does anyone know how I could go about inserting a custom amount in a payment button. The vender (Payfast) does not allow just a payment link where a customer can enter their own amount, the amount has to be specified in the link.
Here is the link:
<a href=”https://www.payfast.co.za/eng/process?cmd=_paynow&receiver=support%40payfast.co.za&?item_name=Black+Eye+Boxing+Gloves&amount=129.99″>
The amount of 129.99 I want to have replaced with the amount a customer enters into a field before pressing the link. Is this possible? The only other route seems to be severe hacking of sophisticated ecommerce plugins like woocommerce + name your price... I am sure there is a simple, elegant solution...

By default leave the href attribute in the tag empty and give it a id
<input type='text' name='payment' onblur="add_value(this.value);">
<a id='pay_button'>Pay</a>
<script type='text/javascript'>
function add_value(value)
{
var url = 'https://www.payfast.co.za/eng/process?md=_paynow&receiver=support%40payfast.co.za&?item_name=Black+Eye+Boxing+Gloves&amount='+value;
var elem = document.getElementById('pay_button');
elem.setAttribute("href", url);
}
</script>

Changing G+ url parameter without refreshing the page

I have a link that a user can share on fb and G+.
The user can modify that link and he did it with an ajax call so the page is not refreshing.
My gplus button code :
<link rel="canonical" href="{{ url }}" />
<g:plus action="share" style="height: 28px;" ></g:plus>
when the user changes the url I update the href attribute too :
$.post(url,{
someParams:"someValues"
},function(data){
.
.
.
// updating the href attribute with the new modified url
$('link[rel="canonical"]').attr("href",data.url);
}
The problem is that the G+ button still load the old url.
But only by refreshing I get the new one.
My question is how can i change the G+ url without refreshing the page ?

Is this what you want (obviously changing that prompt for your ajax callback logic)?
http://jsfiddle.net/coma/2783J/6/
HTML
<!-- Place this tag where you want the +1 button to render. -->
<div id="gplus"></div>
<button>change it!</button>
JS
$(function() {
var container = $('#gplus');
var render = function(url) {
container.html('<g:plusone href="' + url + '"></g:plusone>');
gapi.plusone.go('gplus');
};
$('button').click(function(event){
var url = prompt('Give me an URL');
render(url);
});
render(location.href);
});
Be aware that I'm loading the plusone.js in the external resources of that jsfiddle.
BTW, why did you use the Symfony2 tag?

Javascript Form Open URL in new tab

I have a piece of code that I have been getting help on and I have come across something that I find inconvenient. When I click the "Go" button it browses away from the current tab. I want to have the resulting URL from the form to open in a new tab. in addition I cannot hit the enter key because it will just load the whole form up in a new window. How do I correct the "enter" key usage problem and get my form to open the URL in a new tab. The forms function is to open a new URL that contains information I am searching for. Here is my code:
<script type="text/javascript">
function setSearchTermSN(n){
var SN_VALUE = encodeURIComponent(document.getElementById("sn").value);
location.href = "http://URL to site.com/perl/search?searchtype=sn&type=2&uid=" + SN_VALUE + "&visualtype=html%2Fen&tabset=person";
}
</script>
<form target="_blank">
Last Name: <input id="sn" type="text" value="" />
<input type="button" value="Go" onclick="setSearchTermSN()" />
</form>
the idea is to enter a last name such as Jones into the input box. Click go and the form would substitute " + SN_VALUE + " with Jones and the load the URL like this:
http://URL to site.com/perl/search?searchtype=sn&type=2&uid=Jones&visualtype=html%2Fen&tabset=person
the form currently does the substitution but it browses away from the search box which defeats the purpose of having it. I have tried the <form target="_blank"> but it still opens the URL in the same page.
credit for the above code goes to https://stackoverflow.com/users/904428/david

window.location only deals with the current document. You need to use window.open
Missed the other part about the enter key. You need a onkeyup event listener and check the event keycode for the return key and then run the same function as the click.

function setSearchTermSN(n){
var SN_VALUE = encodeURIComponent(document.getElementById("sn").value);
var newwindow = window.open("http://URL to site.com/perl/search?searchtype=sn&type=2&uid=" + SN_VALUE + "&visualtype=html%2Fen&tabset=person",'name');
return false;
}