I want to create a form for my blog visitors like this:
<form name="myform" id="test">
<input type="text" name="url"/>
<input type="submit" value="submit"/>
</form>
If someone enters a URL: https://demo.website.com/page/blablabla.html
It will generate a URL: https://newwebsite.com/page/blablabla.html
So the point is: just change demo.website be newwebsite
Is this possible with javascript or jQuery?
Try this approach:
$("input[name='url']").on('change', function(e){
$(this).val($(this).val().replace("demo.website.","newwebsite."));
})
Working code would be somewhat like this
<form name="myform" id="test">
<input type="text" name="url" onblur="func(this)" />
<input type="submit" value="submit"/>
</form>
<script>
function func(elem){
var _url = elem.value;
var finUrl = _url.replace('demo.website','newwebsite');
console.log(finUrl);
}
</script>
Related
I want to change my form destination based on an input value.
How can I do this?
<form id="form" method="POST" action="x.php" onSubmit="">
<input type="url" id="address" value="google.com">
<input type="submit" id="go" value="Go">
</form>
Example: When I set http://google.com as address value, so send this form to google.com.
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#address").blur(function () {
var form = document.getElementById('form');
form.action = $("#address").val();
});
});
</script>
<form id="form" method="POST" action="x.php" onSubmit="">
<input type="text" id="address" value="google.com">
<input type="submit" id="go" value="Go">
</form>
I use
"How do I get the value of text input field using JavaScript?"
&
"How can I set the form action through JavaScript?" to write my code:
<script type="text/javascript">
function get_action(form) {
form.action = 'http://'+document.getElementById("address").value;
}
</script>
<form onsubmit="get_action(this);">
<input type="text" id="address" value="google.com">
<input type="submit" id="go" value="Go">
</form>
How to submit form using JavaScript and redirect to a URL ?
<form name="f1" method="get" action="aaa.php">
name : <input type="text" name="value_1" value=""/><br>
age: <input type="text" name="value_2" value=""/>
<input type="submit" name="submit" value="send"/>
</form>
please see image in this link:
http://image.ohozaa.com/i/4d0/zCzQIH.jpg
after press submit button , i want to redirect page to www.example.com/aaa/robert/21
How can i do that ?
Try this with html code
<form name="f1" method="get" action="aaa.php">
name : <input type="text" id="value_1" name="value_1" value=""/><br>
age: <input type="text" id="value_2" name="value_2" value=""/>
<input type="button" name="submit" onclick="checkredirect()" value="send"/>
And javascript
<script type="text/javascript">
function checkredirect(){
var value_1 = $('#value_1').val();
var value_2 = $('#value_2').val();
window.location = 'http://www.example.com/'+value_1+'/'+value_2;
return false;
}
</script>
Don't forget to add jQuery library
Maybe something like this:
HTML:
<form id="f1" class="js-redirect" method="get" action="aaa.php">
name : <input type="text" name="value_1" id="value_1" value=""/><br>
age: <input type="text" name="value_2" id="value_2" value=""/>
<input type="submit" name="submit" value="send"/>
</form>
N.B.: name attribute in form tags is deprecated, use id attribute. Input, select and textarea tags should have ids as well.
JS:
$('.js-redirect').on('submit', function() {
var newUrl = this.action.replace('.php', '/' + $('#value_1').val() + '/' + $('#value_2').val());
this.action = newUrl;
})
set header in php file
$dynamic = $_GET['value_1'];
$id =$_GET['value_2'];
header('location:www.example.com/aaa/'.$dynamic.'/'.$id);
Try this function on click button
function myFunction() {
document.getElementById("myForm").submit();
}
can anybody tell me how to make preview before submit in one form using javascript in php
i have an example like
<script type="text/javascript">
$(document).ready(function() {
`$('#db').hide();
});
function preview()
{
var add=document.getElementById('Address_Street').value;
if(add.trim()!="")
{
$('#db').show();
document.getElementById('p_Address_Street').value=add;
}
}
<body>
<form name="approval" id="approval" method="post" enctype="multipart/form-data" action="">
<input type="text" name="Address_Street" id="Address_Street" size="36" value="">
<input type="submit" value="Submit" >`
<input type="button" value="Preview" onclick="preview()">
</form>
<div id="db">
Address Street: <input type="text" name="p_Address_Street" id="p_Address_Street" size="36" value="" readonly="readonly">
</div>
</body>
can everybody tell me the right one please :(
Add id to your Preview button
<input id="Preview" type="button" value="Preview">
Then try this Js
$(document).ready(function() {
$('#db').hide();
$('#Preview').on('click', function(){
var add=$("#Address_Street").val();
if(add.trim()!="")
{
$('#db').show();
$('#p_Address_Street').val(add);
}
});
});
You have an error on this line
`$('#db').hide(); try to remove the ` char
And then, if you're using JQuery, stick to it.
var add = $('#Address_Street').val();
To debug, remove the if statement. Maybe the error is there.
The example:
http://jsfiddle.net/fa295/
I have seen on youtube when we upload any videos automatically, the title field of form gets filled with the name of the video file. How can i achieve this?
my form is
<form enctype="multipart/form-data" method="post" action="http://youshare.ca/music/writestorypost"><p>
<span class="form_label">Title</span><input type="text" value="" name="title" style="width:400px" class="inputText required"></p>
<p><label>Upload</label><input type="file" name="song">
<p><input type="submit" value="Submit" class="button"></p><input type="hidden" value="935" name="page_id">
</form>
Here's some jquery code to make it work:
$('#myfile').change( function(){
var fileValue = $(this).val();
$('#mytitle').val(fileValue);
});
And here's the modified HTML:
<form enctype="multipart/form-data" method="post" action="http://youshare.ca/music/writestorypost"><p>
<span class="form_label">Title</span><input id="mytitle" type="text" value="" name="title" style="width:400px" class="inputText required"></p>
<p><label>Upload</label><input id="myfile" type="file" name="song">
<p><input type="submit" value="Submit" class="button"></p><input type="hidden" value="935" name="page_id">
</form>
Click here for the working JSFiddle. If you've never used jQuery before, then tell me, as this may be confusing!
Edit: Here's the replacing code:
$('#myfile').change( function(){
var fileValue = $(this).val();
fileValue = fileValue.replace('_', ' ');
fileValue = fileValue.replace('-', ' ');
$('#mytitle').val(fileValue);
});
Here's the updated jsfiddle
Use this code:
//use this in your form tag
<input id="song" type="file" />
//use this in your destination(action)
document.title = document.getElementById("song").value ;
I'm currently working on a basic form. When you hit the submit button, it should first change the value of a field, and then submit the form as usual. It all looks a bit like this:
<form name="myform" id="myform" action="action.php">
<input type="hidden" name="myinput" value="0" />
<input type="text" name="message" value="" />
<input type="submit" name="submit" onclick="DoSubmit()" />
</form>
And this is how far I've come with the JavaScript code. It changes "myinput"'s value to 1, but it does not submit the form.
function DoSubmit(){
document.myform.myinput.value = '1';
document.getElementById("myform").submit();
}
You could do something like this instead:
<form name="myform" action="action.php" onsubmit="DoSubmit();">
<input type="hidden" name="myinput" value="0" />
<input type="text" name="message" value="" />
<input type="submit" name="submit" />
</form>
And then modify your DoSubmit function to just return true, indicating that "it's OK, now you can submit the form" to the browser:
function DoSubmit(){
document.myform.myinput.value = '1';
return true;
}
I'd also be wary of using onclick events on a submit button; the order of events isn't immediately obvious, and your callback won't get called if the user submits by, for example, hitting return in a textbox.
document.getElementById("myform").submit();
This won't work as your form tag doesn't have an id.
Change it like this and it should work:
<form name="myform" id="myform" action="action.php">
Here is simple code. You must set an id for your input. Here call it 'myInput':
var myform = document.getElementById('myform');
myform.onsubmit = function(){
document.getElementById('myInput').value = '1';
myform.submit();
};
No. When your input type is submit, you should have an onsubmit event declared in the markup and then do the changes you want. Meaning, have an onsubmit defined in your form tag.
Otherwise change the input type to a button and then define an onclick event for that button.
You're trying to access an element based on the name attribute which works for postbacks to the server, but JavaScript responds to the id attribute. Add an id with the same value as name and all should work fine.
<form name="myform" id="myform" action="action.php">
<input type="hidden" name="myinput" id="myinput" value="0" />
<input type="text" name="message" id="message" value="" />
<input type="submit" name="submit" id="submit" onclick="DoSubmit()" />
</form>
function DoSubmit(){
document.getElementById("myinput").value = '1';
return true;
}
My problem turned out to be that I was assigning as document.getElementById("myinput").Value = '1';
Notice the capital V in Value? Once I changed it to small case, i.e., value, the data started posting. Odd as it was not giving any JavaScript errors either.
I have done this and it works for me.
At first you must add a script such as my SetHolderParent() and call in the html code like below.
function SetHolderParent(value) {
alert(value);
}
<input type="submit" value="Submit" onclick="SetHolderParent(222);" />
You can use the onchange event:
<form name="myform" id="myform" action="action.php">
<input type="hidden" name="myinput" value="0" onchange="this.form.submit()"/>
<input type="text" name="message" value="" />
<input type="submit" name="submit" onclick="DoSubmit()" />
</form>
This might help you.
Your HTML
<form id="myform" action="action.php">
<input type="hidden" name="myinput" value="0" />
<input type="text" name="message" value="" />
<input type="submit" name="submit" onclick="save()" />
</form>
Your Script
<script>
function save(){
$('#myinput').val('1');
$('#form').submit();
}
</script>