Sending jquery ajax post to multiple tables with relations(foreign key) in one button submit
<p>Hey guys I am using Spring MVC framework on the server side, and JS/Jquery, ajax on the client side, database is Oracle.</p>

<p>I have a form wizard, with 3 steps in it, and this form will submit all of the filled in data to multiple tables.</p>

<p>Here is what's working -> Inserting to the main table(Business Info table), everything went into the table as expected.</p>

<p>Note: The table is set to auto incremental value using trigger and sequence method.</p>

<p>Note2: All of the JS below are under one button submit event, I separated them to show which one is working and which one is not.</p>

<pre><code>        submit.on('click',function() {

        var currentDate = new Date();

        var business_data = {
                ubiId : '',
                ubiName : business_name.val(),
                ubiStartDate : moment(business_start_date.val() + ' ' + '00:00 AM', "DD-MM-YYYY hh:mm A"),
                ubiAddress : business_address.val(),
                ubiCity : business_city.val(),
                ubiState : business_state.val(),
                ubiPostcode : business_postcode.val(),
                ubiPhone : business_phone.val(),
                ubiEmail : business_email.val(),
                ubiType : $('input:radio:checked', businesstype_list).val(),
                ubiRegisterAgency: $('input:radio:checked', agency_list).val(),
                ubiRegisterSsm: $('input:radio:checked', ssm_list).val(),
                ubiStatus: 'P1',
                ubiAppliedBy: Index.getUserInfo().cmsId,
                ubiApplyDate: currentDate,
                ubiSsmNo: ssm_no.val(),
                ubiOwnerId: matrik_number.val(), 
                ubiOwnerYearstartBusiness: $('input:radio:checked', yearstart).val(),
                ubiOwnerPhone: student_phoneno.val(),
                ubiOwnerEmail: student_emailadd.val(),
                ubiOwnerStudyyear: $('#student_studyyear').val(),
                ubiOwnerFac: $('#student_faculty_code').val(),
                ubiLecturerId : lecturer_name.val(),
                deanId : dean_name.val()
                //nature : nature_business.val()
        };

        console.log(business_data);

        $.ajax({
            type: "post",
            url: 'home/umkei/ssuForm/create',
            data: JSON.stringify(business_data),
            contentType : "application/json",
            beforeSend:function(){
                showMetronicLoading(el,msgLoading);
            },
            error: function(){
                Metronic.unblockUI(el);
                showMetronicAlert('danger','warning',msgInternetError);
            },
            success: function(){
                Metronic.unblockUI(el);
                //console.log(d);
                showMetronicAlert('success','check',msgSuccess);
            }
        });
    });
</code></pre>

<p>Here is the code in Spring controller,</p>

<pre><code>@RequestMapping("/ssuForm/create")
@ResponseStatus(HttpStatus.OK)
@ResponseBody
public UmkeiBusinessInfo createSsuForm(@RequestBody UmkeiBusinessInfo umkeiSsu) {

    UmkeiBusinessInfo createSsuForm = umkeiBusinessInfoService.create(umkeiSsu);

    return createSsuForm;
}
</code></pre>

<p>However there are some other fields in the form that are required to be pushed to other tables which linked to the primary key of this main table(Business Info PK --> UBI_ID column)</p>

<p>Another table is called Nature_Business which have Business_Id column that acts as a foreign key to the Business_info table(Ubi_id) column.</p>

<p>How do I get the value of the inserted primary key, and have it pushed to this other table?</p>

<p>Here is what I tried in Spring Controller(by create another action)</p>

<pre><code>@RequestMapping("/info/businessId/{ubiId}")
@ResponseStatus(HttpStatus.OK)
@ResponseBody
public String infoBusinessId(@PathVariable("ubiId") String q) throws SQLException {
    UmkeiBusinessInfo businessInfo = umkeiBusinessInfoService.findById(q);
    UmkeiBusinessInfo businessId = umkeiBusinessInfoService.findById(businessInfo.getUbiId());

        JSONObject o = new JSONObject();
        o.put("id", businessId.getUbiId());

    return o.toJSONString();
}
</code></pre>

<p>Then in my JS file(which is not working, I got 404 in the console of the browser</p>

<pre><code>$.ajax({
            url: 'home/umkei/info/businessId/'+ ubiId //(I think it has something to with this one??) I dont know what to insert here,
            dataType: 'json',
            beforeSend:function(){
                showMetronicLoading(el,msgLoading);
            },
            error: function(){
                Metronic.unblockUI(el);
                showMetronicAlert('danger','warning',msgInternetError + '. Failed to load business ID');
            },
            success: function(){
                Metronic.unblockUI(el);
            }
        });
</code></pre>

<p>Below is the one that I'm trying to insert</p>

<pre><code>    var nature = {
            ubtBusinessInfo: //here is where I need to insert the new id inserted from the above code,
            ubtBusinessListing: //here is the value which is selected by the user
    };

        //console.log(nature);

$.ajax({
    type: "post",
    url: 'home/umkei/ssuForm/create/nature',
    data: JSON.stringify(nature),
    contentType : "application/json",
    beforeSend:function(){
         showMetronicLoading(el,msgLoading);
    },
    error: function(){
        Metronic.unblockUI(el);
        showMetronicAlert('danger','warning',msgInternetError);
    },
    success: function(d){
        Metronic.unblockUI(el);
        showMetronicAlert('success','check',msgSuccess);
    }
});
</code></pre>

<p>Or, is it my approach is wrong? Please someone enlighten me. Thank you.</p>