How to create form dynamically with multiple input parameters and immediate action submit with jQuery ajax response?

Question

I want to submit form action dynamically based on ajax response data, the parameters of input type values and action url should be dynamic.

$.ajax({
    url: "https://abcd.com",
    data: JSON.stringify(gatewayData),
    method: "POST",
    headers: {
        'Content-Type': 'application/json'
    },
    success: function(response) {

        if (response.success) {
            var parentDiv = $("#form_div");
            parentDiv.html("");
            var result = $("<form>", {
                'name': 'pgForm',
                'id': 'pgForm',
                'action': response.data.url,
                'method': 'post'
            }).append(parentDiv);
            $.each(response.data.formParam, function(key, value) {
                $('<input>').attr({
                    'type': 'hidden',
                    'id': key,
                    'name': key
                }).val(value).append(result);
            });
            $('<input>').attr({
                'type': 'hidden'
            }).val("submit").append(result);

            $("#pgform").submit();

        } 
    },
    error: function(e) {

    }
});

Answer 1

Team i had some alternate idea it works at my end. kindly find below code and suggest us to more standards.

$.ajax({
    url: "abcd.com",
    data: JSON.stringify(gatewayData),
    method: "POST",
    headers: {
        'Content-Type': 'application/json'
    },
    success: function(response) {

        if (response.success) {

            var formData="<form id=\"paytmForm\" method=\"POST\" name=\"redirect\" action=\"xyz.com">";
            $.each(response.data.gatewayFormParam, function( key, value ) {
                formData+="<input type=\"hidden\" name=\""+key+"\" id=\""+key+"\" value=\""+value+"\">";
            });
            formData+="</form>";
            $("#form_div").html(formData);
            $("#form_div").show();
            $("#paytmForm").submit();

        } 
    },
    error: function(e) {

    }
});