Home » Php » php – Why does this semicolon appear if I use jQuery serialize() on inputs with square brackets in the name?

php – Why does this semicolon appear if I use jQuery serialize() on inputs with square brackets in the name?

Posted by: admin July 12, 2020 Leave a comment

Questions:

I have the following HTML:

<input type="checkbox" id="options_1" value="options_1" name="options[]">  
<input type="checkbox" id="options_2" value="options_2" name="options[]">  
<input type="checkbox" id="options_3" value="options_3" name="options[]">  

I check the first two options and send it to the server via ajax in jQuery:

$.ajax({
    type: "POST",
    url: "myfile.php",
    data: {
        'options':$('input[name="options[]"]').serialize()
    },
    dataType: 'json',
    beforeSend: function(){
           //do some stuff
    },
    success: function(msg){
        //do some stuff
    }
});

Firebug shows me the data that has been posted:

options options%5B%5D=options_1&options%5B%5D=options_2
So far, so good.

In myfile.php I get the POST-Variable like this:

$options = $_POST['options'];

Now when I echo $options I get this:

"options[]=options_1&options;[]=options_2"

Where does this semicolon in front of the second pair of brackets come from? This is driving me crazy.

I already used utf8_decode on the POST data as well as urldecode and rawurldecode. Nothing changes. I also escaped the square brackets in the ajax call like this:

data: {
    'options':$('input[name="options\[\]"]').serialize()
},

That didn’t help either. Any ideas anyone?

How to&Answers:

I had this exact problem, and I was only able to get it to work by using “.serializeArray()”, I hope this was what you were looking for.

data: {
    'options':$('input[name="options[]"]').serializeArray()
},

For me this outputs standard string in the same format as GET requests.

Answer:

I recommend to remove [] from html names, it’s bad design. There can be a problem on jQuery side or PHP too.
I can see no other problems in your code.

What characters are allowed in the HTML Name attribute?
What are valid values for the id attribute in HTML?

Answer:

Why do you use the brackets[] and the same name for each input element?
If I get you right you can serialize by a wrapping element..

<form id="options">
    <input type="checkbox" id="options_1" value="options_1" name="option1" />  
    <input type="checkbox" id="options_2" value="options_2" name="option2" />  
    <input type="checkbox" id="options_3" value="options_3" name="option3" />  
</form>

So you can serialize like

data: {
    'options':$('#options').serialize()
},

Answer:

You might want to read this and try this:

data: {
        'options':$('input[name="options[]"]').replace('%5B%5D', '[]') 
    },

or this

$.param(obj, true);

The true in the $.param indicates the traditional method of serializing an object should be used. The traditional method does not use square brackets when it encounters the same parameter name.