In WebPlus, I am trying to make the text in a form for a support page disappear on click, or disappear when the box has contents inserted. How could I do this?
HTML CODE at here.
Although I'm not familiar with WebPlus, it's just HTML at the end of the day.
First we need to add an ID to your Submit Button ( assume this is the button you want to click that will hide stuff?)
<input id="Submit" type="submit" style="position:absolute; left:137px; top:668px; width:81px; height:22px;" value="Submit">
What we'll need to do next is put some javascript into your form page's HTML that hides the textbox(es) you choose.
for example:
<script type='text/javascript'>
$(window).load(function(){
$('#Submit').click(function(){ //when submit button is clicked
$("#txt_32").hide(); //hide this element
$("#txt_33").hide(); //hide this element
//etc... hide the text boxes by grabbing them with their ID tag
});
});
</script>
After that, you'll probably want to unhide them. I'm not sure what the end goal is or what you're trying to do, but to get hidden elements to show you call .show() on the elements that we called .hide().
Related
Hi I have a following html markup
<h2>First Name Last Name</h2>
<form>
<div>
<input name="fname">
<input name="lname">
</div>
</form>
You click on a header to show the form fields and to edit them (blur hides the fields and shows the header again).
I have a problem because the first and last name are in the same header, so you click on one item to edit two fields.
I am submitting the form on a blur event for the input fields but when I click the last name, because blur is being called in the first name, I cannot edit the second field.
I am using AngularJS which is also presenting a problem because I cannot figure out which element is focused because document.activeElement returns the entire body.
Any help is much appreciated!
Assuming you're using ngBlur directive on the input element, you can mix it with ngFocus to keep elements visible as wanted: <input name="fname" ng-focus="showFields=true;" ng-blur="blurField($event);" >
Using a function for ngBlur, you will have access to the $event object which in turn will expose the elements you need (like target or related). Afterwards, you can trigger form submit depending on your needs.
A demo plunker is HERE.
Seems like a common question but could not find on this site. Must be due to my lack of experience in jquery or ajax.
I have a form like this:
<form id="form1">
+Add Item
</form>
when the person clicks "+Add Item" it pops up a new page which allows him to navigate and click the desired checkbox. Then it should insert in the above form something like:
<input type="hidden" name="item1_id" value="4">Item 1<br>
where value="4" would be the id of the checkbox checked.
any help would be greatly appreciated.
Don't use an anchor tag. Instead, create a div container for your pop up, which you can load dynamically:
$('#container').load('add-item.php');
Then add a listener to your item buttons append the result in your form:
$("#item_1").click(function() {
var $newinput = $("<input type='hidden' />");
$newinput.val(4);
$newinput.attr("name","item1_id")
$("#form1").append($newinput,"Item 1<br>");
});
Good Day
I am using an ASP.NET webform where I have wrapped the following button inside the form tags:
<form runat="server">
<button class="btn btn-primary" onclick="window.location='http://google.co.za';">Login</button>
</form>
ISSUE: The problem is that when clicking on the button, it just directs to the current page...does not redirect. However, when I remove the form tags, the button works. If I leave the form tags and I use an anchor tag to relocate, it works as well...It is just the button that is giving me issues.
Why is that?
I am using Twitter bootstrap as well(extra info..)
Thank you
Add type="button" attribute to your button tag. Without it button works as submit.
When I click on an image inside a label to select/deselect a checkbox, it changes its state accordingly in Firefox and Chrome. However, in IE8, the checkbox never responds if I click on an image and only changes its state if I click on the text.
jsFiddle is here (click on the white box image before the text in IE):
http://jsfiddle.net/dzTMD/3/
I'm not sure what the problem in IE8 but you can use background image within css instead of attaching it directly in html and this will work in IE. Here is fiddle with example
put the input field inside the label tag
example:
<label>
<input name="yn00" id="yn00_1" type="checkbox">
<div class="indicator"></div>
<span>My text for this label</span>
</label>
all elements will work inside the label, your img aswell..
just remember to use opacity to hide the input field .
IE8 will not fire events on display:none or visibility:hidden elements
I have a piece of code like this.
<form method="get" action="{$self}" name="addcommentform">
<textarea title="{$enterComment}" name="comment" class="commentarea" </textarea>
<input class="Button" type="submit" value="{$postComment}" />
</form>
How do I keep track of when what is the text entered in the form's textarea when the user navigates away from the page? I want to prompt the user with a warning message so he/she doesn't lose the text.
Thanks.
You could use the javascript/jquery blur event, and if the user hasn't clicked the desired button have it display the form values. This might help JQuery Blur Validation Problem
Stu
Take a look at this Javascript code snippet:
http://www.boutell.com/newfaq/creating/disableclose.html
This takes advantage of the window's onbeforeunload event which fires when the user is about to leave the page.