CODEWITHSUNDEEP
jqueryajax
Sanjay Yadav
Sanjay Yadav

Reputation: 3

How to combined two form data by jquery object

I have two forms with data and I am trying to merge this data for sending to my Api. Single form data is sending but I have no idea how to merge the data from both forms and send to my api.

$(document).ready(function () {
    $("#place_order").click(function () {
        var person2 = new Object();
        person2.Title = $('#Title').val();
        person2.FirstName = $('#FirstName').val();
        person2.LastName = $('#LastName').val();

        debugger;
        /* #check1 is form id , for first form , please let me know how two use second form id #check2 */
        var person = $('#check1').serialize();

        $.ajax({
            url: 'http://192.168.1.102:1512/qlikapi/RegisterUser',
            type: 'Post',
            data: person,
            success: function(data, textStatus, xhr) {
                alert(data.ErrorMessage);
                if (data.Success) {
                    document.location.reload();  
                }
            },
            error: function (xhr, textStatus, errorThrown) {
                console.log('Error in Operation');
            }
        });
    });
});

Upvotes: 0

Views: 856

Answers (3)

sandrooco
sandrooco

Reputation: 8716

Merging two objects works as follows:

var a = {someProp: "hi"};
var b = {someOtherProp: "sup?"};

var merged = $.extend({}, a, b);
//Merged will be
{   someProp: "hi",
    someOtherProp: "'sup?"
}

Reloading pages in a success callback isn't really the purpose of $.ajax calls by the way...

Upvotes: 1

Ashish Patel
Ashish Patel

Reputation: 941

$(document).ready(function () {
    $("#place_order").click(function () {
        var person2 = new Object();
        person2.Title = $('#Title').val();
        person2.FirstName = $('#FirstName').val();
        person2.LastName = $('#LastName').val();

        debugger;
        /* #check1 is form id , for first form , please let me know how two use second form id #check2 */
        var person = {};
        var person1 = {};

         $.map($('#check1').serializeArray(), function(n, i){
           person[n['name']] = n['value'];
         });

         $.map($('#check2').serializeArray(), function(n, i){
            person1[n['name']] = n['value'];
         });

        var mergedFormObj = $.extend({},person,person1);

        $.ajax({
            url: 'http://192.168.1.102:1512/qlikapi/RegisterUser',
            type: 'Post',
            data: mergedFormObj,
            success: function(data, textStatus, xhr) {
                alert(data.ErrorMessage);
                if (data.Success) {
                    document.location.reload();  
                }
            },
            error: function (xhr, textStatus, errorThrown) {
                console.log('Error in Operation');
            }
        });
    });
});

Make sure both object properties are unique.

Upvotes: 2

Mehmood
Mehmood

Reputation: 931

If you are more specific about the forms , use

$('#detailsform,#levelForm').serialize();

the above line will return a string value. like customId=08071992&cort=01&empId=7777

you can avoid unwanted fields by adding the attribute disabled="disabled" to the input fields.

If you don't have second form you can create it by using FormData.

I hope this will help you.

Upvotes: 1

Related Questions