Print Page - [SOLVED] Formdata with serialize

Title: [SOLVED] Formdata with serialize
Post by: jega on June 24, 2024, 02:21:47 AM

Hi

Having a problem with getting some dadta in a form with serialize.

$('#fmTest').form('load',row); //datagrid row data val1 = 1, val2 = 2, val3 = 3, val4 = 4

<form id="fmTest" class="easyui-form">
   <input id="val1" name="val1" class="easyui-textbox">
   <input id="val2" name="val2" class="easyui-textbox">

   <input id="val3" name="val3" class="easyui-textbox valData">
   <input id="val4" name="val4" class="easyui-textbox valData">

</form>

Using var formData = $('#fmTest').serialize(); results in "val1=1&val2=2&val3=3&val4=4"

But i only want val3 and val4

Added class "valData" to val3 and val4

var formData = $('.valData').serialize(); results in nothing

If i remove easyui-textbox from class the result is "val3=3&val4=4"

How can i get this to work ? (My project is not only 2 fields, but 20, so i don't want to do a getValue from each, one by one)

Title: Re: Formdata with serialize
Post by: jarry on June 24, 2024, 08:31:23 PM

Please wrap the field with a new element.

Code:

<form id="fmTest" method="post">
	<div>
		<input id="val1" name="val1" class="easyui-textbox">
	</div>
	<div>
		<input id="val2" name="val2" class="easyui-textbox">
	</div>
	<div class="valData">
		<input id="val3" name="val3" class="easyui-textbox valData">
	</div>
	<div class="valData">
		<input id="val4" name="val4" class="easyui-textbox valData">
	</div>
</form>

Call this line to get the specified field values.

Code:

const formData = $('.valData').find('.textbox-value').serialize();
console.log(formData);

Title: Re: Formdata with serialize
Post by: jega on June 25, 2024, 12:08:55 AM

H jarry

Thanks, it works.

And works with only one wrapped div and works with all types

   <div class="valData">
      <input id="val3" name="val3" class="easyui-textbox" value="3">
      <input id="val4" name="val4" class="easyui-textbox" value="4">
<input id="val5" name="val5" class="easyui-combobox" value="5">
<input id="val6" name="val6" class="easyui-datebox" value="yyyy-mm-dd">
   </div>

Result "val3=3&val4=4&val5=5&val6=yyyy-mm-dd"

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: jega on June 24, 2024, 02:21:47 AM