CODEWITHSUNDEEP
jqueryreturn
Azad Zain
Azad Zain

Reputation: 153

jQuery .html() does not return form values

I have this issue with a .html()

i got a link, that helped 50% of the issue.

jquery html() does not return changed values

$("input").each(function(){
        $(this).attr("value", $(this).val());
});

$("select").each(function(){
        $(this).find('option[value='+$(this).val()+']').attr("selected", "selected");
});

It worked, but only returns the value of inputs. How do i do it for textareas, radio buttons, check box, i searched a lot. Couldn't find more than the link above.

Upvotes: 0

Views: 528

Answers (2)

yuvi
yuvi

Reputation: 18437

Just use jQuery's serialize() function:

$("#myform").serialize();

example (note that the checkbox is only added if it is checked)

var result = $('#res'),
    btn    = $('#mybutton');

btn.on('click', function() {
  
  var data = $('#myform').serialize();
  result.text(data);
  
});
* {
   font-family: Ubuntu, sans-serif;  
}

label {
   display: block;
  margin: 5px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myform">

	<label for="text-input">example Text Input</label>
	<input type="text" name="text-input" id="text-input" />

	<label for="textarea">example Textarea</label>
	<textarea name="textarea" id="textarea"></textarea>

	<label for="checkbox">example Checkbox</label>
	<input type="checkbox" name="checkbox" id="checkbox">

</form>
<br>
<button id="mybutton">Serialize!</button>
<br>
<div id="res"></div>

Note that serialize returns the values as a string, but you can also use serializeArray to get them as a JavaScript array of objects

Upvotes: 2

DarkHorse
DarkHorse

Reputation: 2770

If you want to get all values for input,textbox,area select.. etc.. put them in form and use serializeArray() api. You will get all as jsonObject..

Upvotes: 0

Related Questions