why jquery serialize() can't parse user defined attributes?

Question

My Code is

    $("#section-form").submit(function (e) {
        e.preventDefault();
        var get_data = JSON.stringify($('#common-element-form').serializeArray());
        console.log(get_data);
        var common_element_data = JSON.parse(get_data);
        $(common_element_data).each(function (idx, val) {
            console.log(common_element_data);
        });

    });

<form id="common-element-form">

                <div class="form-group input select" id="campus-select-parent-div">
                    <label for="campus-type" class="col-sm-3 control-label text-right">Campus Type</label>

                    <div id="container-campus-select" class="col-sm-9">

                    <select class="form-control" name="campus-select" id="campus-select"><option value="">Select</option><option value="1">Collectorate Balika Biddya Niketan</option><option value="27">qwe</option></select></div>
                </div><br><br><br>

                <div class="form-group input select">
                    <label for="shift-select" class="col-sm-3 control-label text-right">Shift Type</label>

                    <div id="container-shift-select" class="col-sm-9 ">

                        <select name="shift-select" id="shift-select" class="form-control">
                        <option value="">Select</option><option value="10">Day</option><option value="29">Night</option></select>
                    </div>
                </div><br><br>
                <div class="form-group input select">
                    <label for="medium-select" class="col-sm-3 control-label text-right">Medium Type</label>

                    <div id="container-medium-select" class="col-sm-9 "><input class="form-control" id="medium-select" type="text" medium-element-id="16" value="700"></div>
                </div>
            </form>

But it's showing

Uncaught Error: Syntax error, unrecognized expression: campus-select=1&shift-select=10

That means it can't parse the input

<input class="form-control" id="medium-select" type="text" medium-element-id="16" value="700">

any suggestion ??

Preethi Mano · Accepted Answer · 2016-08-09 07:19:16Z

1

Try this

   $(document).ready(function() { 
      $("#section-form").submit(function(e) {
         var get_data = $("#common-element-form").serializeArray();
         $.each(get_data, function (index, elem) {
           alert("name: " + elem.name)
           alert("value: " + elem.value)
           alert($('[name='+ elem.name +']').data("medium-element-id"))
         });
         e.preventDefault();
      });
   });

You can't able to get the user defined attribute value from SerializeArray().Instead try some alternatives like

var data_arr=$('input').map(function(){ return $(this).data('medium-element-id');}).get(); 
console.log(data_arr);

And also change your medium-element-id attribute as data attribute

edited Aug 9, 2016 at 7:19

answered Aug 9, 2016 at 6:45

Preethi Mano

4551 gold badge7 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Preethi Mano Over a year ago

your medium-select input field doesn't have the name attribute. that is the actual problem

Amran Over a year ago

i've fixed that. But now problem is SerializeArray() can't parse user defined attributes . @Preethi Mano

Amran Over a year ago

I need the value of medium-element-id attribute .But SerializeArray() is not producing it :( @Preethi Mano

Preethi Mano Over a year ago

You can't able to achieve that through SerializeArray().Instead try some alternatives like var data_arr=$('input').map(function(){ return $(this).data('medium-element-id');}).get(); console.log(data_arr); But it should be the data attribute

Amran Over a year ago

it's working .can you post this as answer ? I can accept this

Collectives™ on Stack Overflow

why jquery serialize() can't parse user defined attributes?

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related