I was having this problem with a more complex chunk of code, so I started messing with a html "joke" with the movie The Seven, and realized it was the same problem. Why doesn't it do anything when I click the button? I've tried it adding a function and script as well, get same problem. I want it to show the text inside the (formerly blank) input box when you click the button.
<html>
<body>
The Box:<input type="text" id="thebox" value="" size=10>
<br><input type="button" value="What's in the booooox?" onclick="document.getElementById('thebox').innerHTML='head of gwyneth paltrow';">
</body>
</html>
innerHTML, as the name suggests, refers to the HTML content of an element. You need to use value
The Box:<input type="text" id="thebox" value="" size=10>
<br><input type="button" value="What's in the booooox?" onclick="document.getElementById('thebox').value='head of gwyneth paltrow';">
See it in action
Related
I have this code, I use formaction attribute to return in home.html
but it's not working because of required attribute.
<form action="post">
Name:
<input type="text" name="name" required>
<br>
Email:
<input type="email" name="name" required>
<button name="Send" id="send">Send</button>
<button name="Return" id="return" formaction="home.html">Return</button>
</form>
The formaction attribute working fine. I can use the Network tab in my browser's developer tools to observe that when I click Return (in the live demo in your question) the form is submitted to home.html.
The required fields are still required (so I have to fill them in before that happens), but that is to be expected.
It sounds like your goal is to provide an exception and not need the user to enter any data when submitting the form to Return.
That isn't possible without adding a bunch of JS but you're approaching the problem from the wrong angle in the first place.
It looks like you want something for the user to click on that will abort filling in the form and just go to a different URL. There's no data submission involved.
That isn't a job for a submit button.
Use a link instead.
Return
You can apply CSS if you want it to look like a button, but I wouldn't recommend it. The visual appearance of the button implies that the form data will be sent somewhere, and that isn't what you are doing.
You should refer to homepage at the form tag
<form action="home.html" method="POST">
and for the submit
<input type="button" name="Return" id="return">
I was trying to write my code here but for whatever reason the site prohibited me to. My code is essentially two texts with a button in the middle. Whatever you write in the first text it will be copied to the other text once you hit the button. I want to edit the code so that it does what it does and ALSO accepts values from the second text and copies to the first one. Thanks.
<html>
<head> <meta charset="utf-8"> </head>
<body>
<input type="text" value="" id="from" />
<button onclick="document.getElementById('to').value = document.getElementById('from').value">copy</button>
<input type="text" value="" id="to" />
</body> </html>
Use an on change for each of the text boxes. I'm a jQuery user but if you did it with standard JS you could do something like ... this is not full code ...
<textarea id='t1' name='t1' onChange="document.getElementbyId('t2').value=document.getElementbyId('t2').value"></textarea>
<textarea id='t2' name='t2' onChange="document.getElementbyId('t1').value=document.getElementbyId('t2').value">
</textarea>
Clicking the button would also trigger the change event. If you want it to copy the contents ONLY when the button is clicked, you could set a variable that stores the textarea id last changed and use that to determine which way to do the copy when the button is clicked.
Let say we have the following form code
<form action="post" method="post" name="form">
Your Name : <input name="name" type="text" id="name">
<input type="submit" name="Submit" value="Submit">
</form>
what if i want it to be viewed as image
Why ! in fact i've text-area where i will put some HTML codes and i want the output of that code appears normally as web-browser view but as image , means no way to click on it or operate just appears as image
I do not know if it possible or not but i wonder it it can be and here is example for exactly how this forms i wants to appears
output of the html codes appears as image
so any method any help any function or class can do like this ?!
Thanks
You can do it two ways
Put and transparent block element over it (position: absolute and so on)
disable every input element (disabled:disabled attribute)
see:
http://www.w3schools.com/tags/att_input_disabled.asp
I was looking for a fix to stop IE refreshing the page instead of submitting my single line form, when a user hits enter instead of clicking go.
I found this solution, which works well, but I was wondering if anyone could explain why it works?
The solution I used is to add a hidden text input within the form tags, like this
`<form name="SearchForm" id="SearchForm" method="get" action="">
/*This is the hidden text input*/
<input type="text" style="visibility:hidden;display:none;" name="ieSearchEnter">
</input>
<fieldset>
<span><input type="text" name="Search" id="Search"/></span>
<div class="field actions">
<input type="submit" name="Go" id="Go" class="submit" value="Go"/>
</div>
</fieldset>
</form>`
which i found here.
Thanks!
Are you really setting the ACTION value to an empty string, or did you just do that for your code sample?
I don't think IE is really "refreshing the page"-- I think it's automatically submitting your form.
Here's a simple test page: http://www.enhanceie.com/sandbox/simpleform.asp. When you hit enter, you'll see that the URL is updated to pass the user's value.
IIRC, there is code in IE's form-handling that says that if you have form containing a single test field, then hitting ENTER will submit that form. In your workaround, you've added an additional text field so that optimization is not applied.
I think maybe your server-side code is REQUIRING that the form submission contains "Go=Go" or it ignores the submitted value (Search=Whatevertheuserhadtyped) and simply re-displays the form. If you change the server-side script such that it does not require Go=Go, then your problem should go away.
Ok so I am new here and was wondering if someone a little more advance then me can help me out.
I have text box on my website with code for user(s) to copy the code that's in the text box and paste the code in Orkut scrapbook which will generate a imagine.
I am using onclick so when user clicks on code it highlight it and then they can copy.
The problems is that you can delete or remove text from within box, if your not careful.
I DONT want the user to be able to delete code in text box. How can I prevent this from happening without removing the onclick scrip.
Please if you could when reply maybe include the sample code above and highlight the new added code so I can see where to make my changes.
I hope I explained this well for anyone to understand!
You can add readonly="readonly" to your textbox tag. Example:
<input type="text" name="someNAme" readonly="readonly" >
you can also try with:
<input type="text" name="someNAme" disabled="disabled" >
Here is a totally editable textbox, and a not editable textbox. The difference is that in the second textbox, there is a readonly attribute, which prevents the user from editing the text. (Run the code snippet!)
function copy(what) {
var copyText = document.getElementById(what);
copyText.select();
copyText.setSelectionRange(0, 99999)
document.execCommand("copy");
}
<textarea id="selectable">This is totally editable!</textarea>
<button onclick="copy('selectable')">Copy this !</button>
<br/>
<br/>
<textarea id="unselectable" readonly>This is not editable!</textarea>
<button onclick="copy('unselectable')">Copy this !</button>