I have a form that is pretty large, so to break it up I hide certain fields unless the information is required.
The problem is this. Lets say that I select that I a have a dog, put in some information in the newly shown fields, and then decide I don't want to say that I have a dog. If I select no to the dog question (the radio button that shows or hides the fields) the information I entered is still there. I need the information in those fields to be cleared when the fields are hidden.
this is the structure of my current HTMl [code]...
If the person says the have a dog, then all fields with class .dog_hidden will be shown, otherwise they are hidden. How can I select all form field types contained within a div of class="dog_hidden" and clear there value (either reset or set to an empty string " ") .
The goal is that every time the fields are hidden they need to be cleared or zeroed. Its important that this information never get put into the database (all fields with a value will be entered).
Do you know why js does not reset this multi select box? <select name="LOB" multiple="multiple" size="5" style="background:#fff3b3;width:150px" > <option value="DP" >DP</option> <option value="DTV" >DTV</option> <option value="HSD" >HSD</option> <option value="PPV" >PPV</option> <option value="RF" >RF</option> <option value="VOD" >VOD</option> </select>
Code: function clearForm(oForm) { var elements = oForm.elements; oForm.reset(); for(i=0; i<elements.length; i++) { field_type = elements[i].type.toLowerCase(); switch(field_type) { case "text": case "password": case "textarea": case "hidden":
elements[i].value = ""; break; case "radio": case "checkbox": if (elements[i].checked) { elements[i].checked = false; } break;
case "select-one": case "select-multi": //alert(elements[i].value); elements[i].selectedIndex = -1; break; default: break; }}}
I have a search form and added the "Clear All" Button functionality...but it clears the last part of the search form display preferences....how do I only clear the checkboxes at the top of the form only and not at the bottom of the form between the <DIV> tags? I have attached a copy of the JSP page.
i think this will help people a lot, cuz i couldn't find any simple answer by googling 3 hours...i need a very very simple jquery form field reset.here is the picture what i need:
HTML Code: <script type='text/javascript' src='http://code.jquery.com/jquery-1.6.4.min.js'></script> <script>
I was wondering if its possible to clear a form after the form has been submitted. Like if a user hits the back button, I'd like the form to be blank. Is this possible?
The javascript below works perfectly using Firefox, but not Opera or IE.I have a button which I would like to clear the text in the input field with.The "onFocus" on the input field works fine in all browsers, but when clicking the "cross.gif"-button, it only works in Firefox.javascript:
I need to learn how to clear form fields when a user clicks on them. Here is the site in question: [URL] They used to work, but then I changed the field value and now it doesn't work on some of the fields (whichever ones I changed). Here is a link to the .js file:[URL]
I've been struggling trying to get a small order form to work the way I want it to. Here is a link to the live page: [URL] And here is the code in question:
[Code]...
I have two questions...
Question 1 How can I make this piece of script act a little smarter. Look at the order form, I'm catering for up to 4 people and providing lunch for them. If they select 3 people and the spaghetti bol for lunch, it's only adding $10 where it should be adding $30. Obviously this is simple multiplication but since the values in my form are prices it makes it a little tricky. I'm guessing an onselect on the first part of the form which changes the pricing of the other items would be the way to go, but how do I do this?
Question 2 The "Total Price" is placed before the <form> tag by the script. This is ok but it's not where I want it. How can I position this text elsewhere in the document?
I have a grid that I'm adding rows to that include form text input boxes using addRowData. I know I can use the "editable:true" for that but I'd rather not at this time. Anyway I have the <div id=list1></div> surrounded by a <form></form>. Also statically I have a couple of text input boxes and a submit button. When I press the submit button the only parameters that show up in the POSTED data are the static ones. Is there a way to get the form elements "registered" with the form? I know I can always use javascript to extract the data and save it via an ajax call, but if there is a way to do it "correctly"
Example var myRow = {id:"0",call:"<input name='callt"+boxNo+"' id='call"+boxNo+"' class='calls' type='text'/>",amount:"<input name='amt"+boxNo+"' id='amt"+boxNo+"' type='text' value='"+defaultDep+"'/>",residual:"",calculate:"<input type='button' class='buttons' id='b"+boxNo+"'/>"}; $("#list1").addRowData(boxNo,myRow);
I'm using the jquery plugin found here. I love the look but I have a form that uses functions like this:
[Code]..
So, when you select a country and it retrieves the state/province text input, the jquery css is not applied to it. Is there something I need to add to the code above or to the jquery initialization code here:
I have a form that has it's HTML inserted into the database (yeah yeahI know..not my idea..I'm new here and just finding this out).Anyway, each form field has an embedded class in the HTML.The form is dynamically generated. Can be anywhere from 5 to 10 to 20to 50 fields.How can I loop over each form field and add a new class to the field
I'm relatively new to JavaScript. I would like to loop through all the elements within a form and grab their values and what type of input they are. So far I came up with:
I have a FORM with many elements, and some of them have names like "name1[]", "name2[]", etc..
I would like to create a button that, once clicked, will clone all the elements whose names end in "[]" (including labels, and select's options), giving them the same name (and possibly a different ID, but it's not important).
I am completely new to jQuery and almost new to javascript.
I came up with this code to clone the entire form:
<script type="text/javascript"> $(function(){ $('input.cloneMe').live('click',function(){ var f=$(this).closest('form').clone(true);
[Code]....
But how can i tell him to only clone the elements whose name ends in '[]' ?
i need to us instead of closest, but i really don't know what.
I need to pass user input from a form to one database field. I'm relatively new to JS but the idea I had was to have several form elements and use JS to collect the users input and send all the values through a hidden element. What's happening is the variable names are being sent rather than the values. The code below is only passing to the next page. Limitations: I am editing an intranet site built by a 3rd party so a lot of the files we've been given are encrypted. I cannot change the method to post.
I've put together what I think is an illustration of my problem at [URL] Quite simply, I need to be able to access the elements of the form without referring to them by ID as the whole form is intended to be cloned. I intended to do this using parentNode and childNodes[] together with the 'this' keyword. My understanding of 'this' in this context is that it should refer to the HTML element calling the function, i.e. one of the radio button inputs. However this gives the error "Error: this.parentNode is undefined"
Does "document.formName.elementName.disable" work on hidden form text elements? I have a form with some input fields that are associated with some hidden text fields and I would like to disable all of the categories inside the form when the page loads and only enable each category as it is needed. Code:
I'm working with a form that has both static and dynamic form elements (add textbox, etc), and while I can access the static elements via request.form, the dynamic elements cannot be accessed. I have the dynamic elements appended within a div that lies within a table.
Here is the javascript:
Code:
function add3<%=strGoalCount%><%=strObjCount%>() { var foo = document.getElementById('fooBar<%=strGoalCount%><%=strObjCount%>'); var numi = document.getElementById('theValue'); var num = (document.getElementById('theValue').value -1)+ 2;
So, what I want to happen is that there is an add vehicle link or button so that when someone hits it, it allows them to add in another vehicle. Of course it should also add some index to the id's of all the inputs as I will use the post data to add the vehicles to a database.
Now at first I thought I had found a solution, that works a little bit. But then when the PHP comes into effect things break.
Also, this is an aside: the truck vin row is controlled by jquery now. If the plan type selected is for a truck, it will show that row, if it's not then that row is hidden. I'm pretty sure I'll need to build a loop in the Jquery script that will allow that hide and show feature to work based on the index added to the truck row.
in my searching, the only thing I've really been able to find is that I might have to use AJAX, but that's not something I familiar with just yet.
