There are forms in several tabs of a document.
A user fill a form in one tab say "Finance Tab".
Form includes Labels, Radio, Textbox, Date
When go to final tab; We need to display what he have filled in Finance tab in form of table.
Say following is HTML of form which he filled, I am just entering demo values which have repetitive panels but have elements with different or same id or different data-type:
<div class="panel clonablePart" id="Money_panel1">
<label class="boldText">Amount</label>
<input type="text" id="gula.bugula">
<label class="boldText">Is amount correct</label>
<input type="radio" /> Yes <input type="radio" /> No
</div>
<div class="panel clonablePart" id="Money_panel2">
<label class="boldText">amount</label>
<input type="text" id="gula.bugula" data-forfinalScreen>
<label class="boldText">Is amount great?</label>
<input type="radio" data-forfinalScreen /> Yes <input type="radio" /> No
</div>
Please share your inputs how to do that in jQuery?
How can i pick values of all Inputs and Label in a DIV dynamically in jQuery?
Update 1: Please consider there are 50 fields which are to be displayed on final tab. If any changes in HTML required then i am open to do that.
You can select all the input elements at once and print values like below
//select all inputs in a div with id Money_panel1
$("#Money_panel1 :input").each(function( index ) {
//if it is a textbox get value
if( $(this).attr("type") == "text" )
alert( $( this ).val() );
//if it is radio/checkbox get whether its checked or not
else if( $(this).attr("type") == "radio" )
alert( $(this).is(":checked") );
});
If you want to select multiple items you can write jquery selector like
$("#Money_panel1 :input, #Money_panel1 label")
You can determine type of element using .prop("tagName") method if you are mixing labels and inputs.
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments