I have the following form posted on a wordpress page.
I´d like to catch users without referrers to set the referrer on their own (that referrer part is all handled by a plugin... does not matter here).
The registration form Url is like:
http://myurl.com/register/
The code below just works fine. Inserted directly into the wp page editor (text).
Except it creates a Url like follows:
http://myurl.com/register/?id=testinput
How do i get the resulting Url to be formatted this way?:
http://myurl.com/register/sp/testinput
<h3>Your ID</h3>
<p>Please input your ID</p>
<form id = "submit_id_form" onsubmit="myIDFunction()">
<input type="text" name="id">
<input type="submit" value="Confirm">
</form>
<?php
function myIDFunction(){
var action_src = "http://myurl.com/register/" + document.getElementsByName("id")[0].value;
var submit_id_form = document.getElementById('submit_id_form');
submit_id_form.action = action_src ;
} ?>
</script>
This is the original form code (reference below) i`m trying to modify:
<form id = "your_form" onsubmit="yourFunction()">
<input type="text" name="keywords">
<input type="submit" value="Search">
function yourFunction(){
var action_src = "http://localhost/test/" +
document.getElementsByName("keywords")[0].value;
var your_form = document.getElementById('your_form');
your_form.action = action_src ;
}
</script>
I tried to append the /sp/ part and remove the appended question mark "?" in the code above.. but i´m totally stuck with coding. (I´m a "clicker" not a coder so to speak)
Thank you very much guys and gals :)
Original Code is from here
You have to return true from method called on onsubmit as
function yourFunction(){
var action_src = "http://localhost/test/" + document.getElementsByName("keywords")[0].value;
var your_form = document.getElementById('your_form');
your_form.action = action_src ;
return true;
}
Related
var solve = function () {
var str = document.getElementById('equ').value;
document.getElementById('demo').innerHTML=str;
}
<form onsubmit="return solve()">
<input type="equation" id="equ" name="equation">
<button>solve</button>
</form>
<p id="demo"></p>
I have form submit code.On the time of submit the input data print to #demo .but the page will be reloated. so the #demo data was empty. if i applied return false statement data will print.but not update with my url
.
My question is print the data to html page and also update the url
with given input data like 'index.html?equation=mydata'.
please give ah code for satisfy the both condition.
here is my fiddle
<form onsubmit="return solve()">
<input type="equation" id="equ" name="equation">
<button>solve</button> </form>
<p id="demo"></p>
Js
var solve = function () {
var str = document.getElementById('equ').value;
document.getElementById('demo').innerHTML=str;
console.log(str);
}
For your condition , I seem using javascript session localStorage is suitable
set your js session by setItem(key,value)
get your js session by getItem(key)
document.getElementById('demo').innerHTML= localStorage.getItem("demo");
var solve = function () {
var str = document.getElementById('equ').value;
localStorage.setItem('demo',str);
}
I got it working (in the fiddle) by setting the first HTML record as:
<form onsubmit="solve()">
i.e., the return was removed.
You still get another error I guess from the `document.getElementById('demo').innerHTML=str;', but this can be further investigated.
My Goal was to redirect a user after filling out a Google form on Wordpress. I have managed to do this and restyle the form with css. I have used the following tutorial: how-to-style-google-forms-and-redirect-it-to-your-desired-thankyou-page
The problem is that I can not get my custom javascript validation to work in Wordpress. I have tested the code locally and replicated it on JSFiddle.
<body>
<h1 id="heading">This Is Kip's Form Test</h1>
<form action="http://www.wikipedia.org" method="GET" onsubmit="return(validate());">
<ul id="special-list">
<li>First name:<input type="text" name="entry.198534167" value=""></li>
<li>Last name:<input type="text" name=","entry.641095175" value=""></li>
<li><input type="radio" name="sex" value="male" checked>Male</li>
<li><input type="radio" name="sex" value="female">Female</li>
</ul>
<input type="submit" value="Submit">
</form>
</body>
Javascript:
var errors = [];
function validate(){
var check_name = /^[a-zA-Z ]{2,30}$/;
var elements = ["entry.198534167","entry.641095175"];
var first_name = document.forms[0].elements[0].value;
var last_name = document.forms[0].elements[1].value;
if(!check_name.test(first_name)){
errors[errors.length] = "Your first name was not entered correctly. Use letters A - Z.";
document.forms[0].elements[0].focus() ;
}
if(!check_name.test(last_name)){
errors[errors.length] = "Your last name was not entered correctly. Use letters A - Z.";
}
if (errors.length > 0) {
reportErrors(errors);
return false;
}
return true;
}
function reportErrors(errors){
var msg = "Please Enter Valid Data...\n";
for (var i = 0; i<errors.length; i++) {
numError = i + 1;
msg += "\n" + numError + ". " + errors[i];
}
alert(msg);
}
I have tried linking the my javascript file in the head, enqueue in my child theme functions.php file, and lastly in the body of the page template file.
Lastly, I know that that my javascript page is being added because it shows up in the developer tools resources listing. I have also tried an alert message that works when the document is ready. However, the validation still does not work.
After running my javascript through jslint and making sure that there were no fatal flaws, I found my error in the html form. The code I provide in the jsfiddle worked because the function validate() was supplied in the form attribute onsubmit="".
On WordPress in the html I had onsubmit="submitted=true;". I believe this was the code copied from the Google Form. My fiddle had the correct html (I did not need the ;) and the WordPress code I had was incorrect.
this is my code
JS :
function addterm(){
var f=document.form;
f.method="post";
f.action='admin_addterm.jsp';
f.submit();
}
HTML :
<label>Add Terms:</label><input type="text" name="term" id="term" >
<input type="button" name="term_b" id="term_b" value ="Add" onclick="addterm();"/>
When I press the button it is supposed to go to another page which populates the database.
The above action doesnt redirect to the other page.Is something wrong with the code.I had used the same code previously but with a parameter(id) passed within the function addterm().
it's document.forms[N]
where N is the number of form you are trying to access
Please test with few online url , i thinks i have find issue in url path .
f.action='http://google.com/';
Try this, i also tested it
<script language="javascript">
function addterm() {
var f = document.forms[0];
f.method = "post";
f.action = 'admin_addterm.jsp';
f.submit();
}
</script>
Try this way :
function addterm(){
var f=document.forms[0];
// or var f=document.forms['your_form_name'];
f.method="post";
f.action='admin_addterm.jsp';
f.submit();
}
I'm trying to obtain an input class=input type=text to add to a link not related to the page's address. The resulting link+text-entry will be displayed in an iframe.
I tried the following (which I found on here):
function GET_IT() {
var link = document.getElementById("LINKHERE");
var hrefOrig = link.href;
var dd = document.getElementById("TEXT_ID");
dd.onchange = function(){ link.href = hrefOrig + dd.value; }
}
window.attachEvent("load", init, false);
with:
<form target="IFRAME" method="get">
<input class"input" type="text" size="25" id="TEXT_ID">
<input type="submit" value "Go" onClick="javascript: function('GET_IT');">
</form>
All it did was loop back the page that everything was entered into, in the iFrame...
Your JavaScript function should look something like this:
function GET_IT() {
var link = document.getElementById("LINKHERE");
var hrefOrig = link.href;
var dd = document.getElementById("TEXT_ID");
//Change the source of the iFrame with the new HREF...
document.getElementById('IFRAME ID').src = hrefOrig + dd.value;
}
This is the best answer I can give you without seeing more code. Check out this link for a more complete example that might help you:
Changing iframe src with Javascript
Fiddler Example:
http://jsfiddle.net/VkSRY/1/
Please excuse my inexperience as I am not a programmer just someone who dabbles at trying to make something work. I'm not sure of the correct terminology and complicated explanations will go straight over my head!
In essence I am trying to get part of the URL of a web page passed to a simple Form that is linked to a shopping cart. i.e. how do I get the filename into the form where I have xxxxxxx. Is it possible in Javascript?
<script type="text/javascript">
var url = window.location.pathname;
var filename = url.substring(url.lastIndexOf('/')+1);
document.write (filename);
</script>
<form action="http://www.mywebspace.com/cf/add.cfm" method="post">
<input type="hidden" name="userid" value="12345678">
<input type="hidden" name="product" value="xxxxxxx">
<input type="hidden" name="price" value="5.00">
<input type="Submit" value="Buy now!">
</form>
I've provided a snippet code that will work with your current HTML structure. Though I do suggest you give the product field an id to prevent the necessity to loop and search elements:
var url = window.location.pathname,
filename = url.substring(url.lastIndexOf('/')+1);
fields = document.getElementsByTagName('input');
for(var i = 0; i < fields.length; i++){
if(fields[i].name == 'product') {
fields[i].value = filename;
break;
}
}
If the form only exists once on a given page, this is an easy solution:
Change it to be:
<input type="hidden" id="productField" name="product" value="xxxxxxx">
In your javascript,
document.getElementById('productField').value = filename;
Yes this is possible.
Instead of doing document.write you need to update the form. Assuming your filename value is currently correct:
//js
document.getElementById( "name-of-file").value = filename;
<!- html -->
...
...