Jquery append and Push not a function-CodePudding

Jquery push and append not working.

I have this code

<form action="">
    <input type="text" name="text">
    <input type="text" name="textw">
    <button type="submit" name="submit">submit</button>
</form>
<p>teasdfas</p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
    $('form').on('submit', function(e) {
        e.preventDefault();
        let formata = $('form').serialize();
        formata.append('id', '1300');
        console.log(formata)
    })
</script>

The problem is that when I submit the form the console outputs

pay.php:12 Uncaught TypeError: formata.append is not a function
    at HTMLFormElement.<anonymous> (pay.php:12:17)
    at HTMLFormElement.dispatch (jquery.min.js:2:43064)
    at v.handle (jquery.min.js:2:41048)

saying append is not a function, also did with push and some regular objects and same output. Please how do i go on with this.

CodePudding user response：

Try serializeArray() insteade of serialize() then try to push

CodePudding user response：

Try This codes

<form action="">
<input type="text" id="text" name="text">
<input type="text" id="textw" name="textw">
<button type="submit"  name="submit">submit</button>
</form>
<p id="res">teasdfas</p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" type="text/javascript"></script>      
<script>
$(document).on('click', '.submitform', function(e) {
e.preventDefault();
var text=$('#text').val();
var textw=$('#textw').val();
var id='1300';
if (text==''){alert("Enter Text!");return false;}
if (textw==''){alert("Enter Textw!");return false;}
if (id==''){alert("Bad Boy!");return false;}
$.ajax
({
url: 'https://posturl.com/page.php',
data: {"text":text,"textw":textw,"id":id},
type: 'post',
success: function(returnedData){
$('#res').html(returnedData);
console.log(returnedData)
}
});
});
</script>