I have a textarea that shows a random joke. I want the joke to post to Twitter using this link with the submit button: https://twitter.com/intent/tweet?text=
but I cannot for the life of me figure out how to get the text that's been generated in the textarea to be picked up in the link. I know there's an easy way to make this happen, but nothing I've tried has worked. Any help would be greatly appreciated!!! Here's the code I've got:
<form name="quoteForm">
<textarea wrap="virtual" name="quoteHere" rows="6" cols="40">Your joke is loading... unless your JavaScript is disabled
</textarea><br> <input type=button value="Previous" onClick="prevQuote();">
<input type=button value="Next" onClick="nextQuote();">
<input type=button value="Random" onclick="randQuote();"><br>
<p>
<input type="submit" value="Tweet This Joke"></p>
</form>
If you want to put the data in the query string then you need to make a GET request (which you are already doing), not a POST request (which you say you want to do).
If you want to send the data to https://twitter.com/intent/tweet then you need to put that URL in the action attribute of the <form> element. Since you have no action it will submit to the URL of your current page instead.
If you want the data to be associated with the query string parameter text then you need to name the textarea text and not, as you have, quoteHere.
The name attribute of textarea was changed from quoteHere to text.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<form name="quoteForm" action="https://twitter.com/intent/tweet" onsubmit="submit();">
<textarea wrap="virtual" name="text" rows="6" cols="40">Your joke is loading... unless your JavaScript is disabled
</textarea><br> <input type=button value="Previous" onClick="prevQuote();">
<input type=button value="Next" onClick="nextQuote();">
<input type=button value="Random" onclick="randQuote();"><br>
<p><input type="submit" value="Tweet This Joke"></p>
</form>
</body>
</html>
Related
I got a form where I'm not allowed to edit the form directly. However I'm able to add etc. Is it possible to add autocomplete="off"-attribute without editing directly into the form?
This is my form:
<form action="/action_page.php">
<input type="text" name="firstname">
<input type="submit" value="Submit">
</form>
Hope that was understandable.
I suggest you to use <button> for the submit instead of <input> and give the tag an id .
Try this javascript:
function off_ac(){
document.getElementById('text_input').autocomplete = 'off';
}
<form action="/action_page.php">
<input id="text_input" type="text" name="firstname">
<input type="submit" value="Submit">
</form>
Autocomplete will be overruled by most browsers. A workaround is to change the text Field to text area. Set it to one row high and x letter Width, and it will look almost like a text Field.
I recently started HTML and made my first Website. I made bunch of lines of codes, and the last line is: <input type="submit" name="register" value="Register" action="Registered.html">. I wanted to this submit button named as "Register" to get me to the my "Registered.html" file but something isn't right. The button shows up, and it's valued as "Register" but `action="Registered.html" doesn't work. I hope you understand me, if you can, fix this for me.
The form element takes the action attribute, not the input:
<form action="Registered.html">
<input type="submit" name="register" value="Register">
</form>
<form action="/action_page.php">
First name:<br>
<input type="text" name="firstname" value="Mickey">
<br>
Last name:<br>
<input type="text" name="lastname" value="Mouse">
<br><br>
<input type="submit" value="Submit">
</form>
notice the action is at the form..
refer https://www.w3schools.com/html/tryit.asp?filename=tryhtml_form_submit
In general form elements are used to send data to a server. It wraps around the elements which specifies the data, input or button elements, for instance. If you add a name and a value attribute to your input and button elements, you will send this name-value-pair to your server.
If you don’t need to send any (additional) data to your server, just use anchor elements:
Register
<form>
<input type="submit" formaction="Registered.html" value="Register">
</form>
The formaction attribute of the input tag is not supported in Internet Explorer 9 and earlier versions.
I am following a tutorial, and now I have this simple code
<form>
<input name=“q”>
<input type=“submit”>
</form>
, this should show a button, but it appears to be a text box. The most weird thing is, I copy paste the exactly same text to my textedit(cover my original ), and it works fine as a button. However, when I try to delete a letter( such as the t in sumbit) and then retype it, it won't work again.
Don't use smart quotes when writing HTML. It won't get interpreted correctly so it just goes with the default input type of of text.
Change
<input name=“q”>
<input type=“submit”>
to
<input name="q">
<input type="submit">
Browser did not parse the html because the wrong quotation marks
original
<form>
<input name=“q”>
<input type=“submit”>
</form>
new
<form>
<input name="q">
<input type="submit">
</form>
I want a html button with parameter functionality.
new/?sorting=desc is the url that it should link to. But when I try, the parameter is not passed. How should it be done? I tried both the methods below but none worked.
<FORM METHOD="GET" ACTION="./?sorting=desc">
<INPUT TYPE="submit" VALUE="Äldst först">
</FORM>
I want buttons that behave like these links:
Äldst först
Nyast först
If you want something to act as a link, then you should use a link.
That said:
When you submit a GET form, the query string is removed from the action and a new one is generated from the data in the form.
You need to store the data in hidden inputs.
<form action="/social/tracking/new/">
<input type="hidden"
name="sorting"
value="desc">
<input type="submit"
value="Nyast först">
</form>
<form action="/social/tracking/new/">
<input type="hidden"
name="sorting"
value="asc">
<input type="submit"
value="Sort the other way">
</form>
If you are using jQuery, you can use the code below.
This will fill a hidden input with the correct value when you click on one of the submit buttons.
<form method="get" action="./">
<input type="hidden" name="sorting" id="sorting" value="" />
<input type="submit" value="Äldst först" id="sort_desc" />
<input type="submit" value="Nyast först" id="sort_asc" />
</form>
<script>
$('#sort_desc').click(function(){
$('#sorting').val('desc');
});
$('#sort_asc').click(function(){
$('#sorting').val('asc');
});
</script>
I think its not possible. A form is used to send data (mostly) via POST or GET. Your goal is to open a specific URL. I would create a standard and would style it like a button. Whats the reason you want to use a button?
I have this piece of code:
<div>
<form name='profileForm' id='profileForm' action='' method='get'>
<input type='submit' name='ProfileBtn' id='ProfileBtn' class='buttonC' value='My Profile' />
</form>
<br />
<form name='logoutForm' id='logoutForm' action='' method='get'>
<input type='submit' name='LogOutBtn' id='LogOutBtn' class='buttonC' value='Logout' />
</form>
</div>
When I render the above the "profileForm" does not appear (although the profileBtn DOES appear).
the seconed form has no problems, which is weird because they are both similar.
It's probably an easy question but I have no idea what's the problem.
This just happened to me using Chrome -- it was because I had a form within a form. It looks like Chrome just stripped out the <form> open and close tag because my form was within another form. When I moved one form outside of the other, then both <form> tags were rendered in the html as intended.
Crackermann was getting at this in his answer too.
It's hard to give a direct solution without seeing your full html, but I'm guessing this is your problem - you need to make sure your form is not within another form. Really simple example to illustrate this:
Form within another form, notice if you run this code in Chrome and inspect <form id="form2"> is not rendered:
<html>
<head></head>
<body>
<form id="form1">
<div>form within a form</div>
<form id="form2">
<input type="text" placeholder="name" /><br/>
<input type="text" placeholder="title" />
</form>
</form>
</body>
</html>
If you move form2 outside of form1, run the code in Chrome and inspect, then <form id="form2"> is rendered:
<html>
<head></head>
<body>
<form id="form1">
<div>form2 moved outside of form1</div>
</form>
<form id="form2">
<input type="text" placeholder="name" /><br/>
<input type="text" placeholder="title" />
</form>
</body>
</html>
well then somehow there was a weird problem with the forms, the button didn't show up because when i ran the website the the 'profileForm' just disappeared somehow (and didn't show up in the console).
what i did was adding a third Form before 'profileForm' which somehow solved this.
There is an unclosed HTML TAG like < form > in your code before these lines ,
Find and close that form
OR
just put </form> before your code.
Just put a empty form on top of your form.
Then all forms will be appear with form id
<form></form>
<form name='profileForm' id='profileForm' action='' method='get'>
<input type='submit' name='ProfileBtn' id='ProfileBtn' class='buttonC' value='My Profile' />
</form>
<form name='logoutForm' id='logoutForm' action='' method='get'>
<input type='submit' name='LogOutBtn' id='LogOutBtn' class='buttonC' value='Logout' />
</form>
Check that you don't an unclosed form element before your next form open.
If you do, browsers will generate the source without displaying the subsequent form open and form close pair.
Try viewing your Page Source
For Mac users
Option + Command + U
For Windows users
Ctrl + U
Then check for any unclosed <form> tag above your specified <form> tag and close it.
It works for me, hope it works for you too