Multipe Datatables - Add new row form overriding

Hi I have multiple datatables on single MVC view (Multiple partial views)

In partial view 1 :

   <div class="datatable-event-header">
        <button id="btnAddNewContactRow" value="Ok">Add New Contact</button> 
   </div>
<div id="divAddNewContactRow" class="datatableAddRow">
        <label id="lblAddContactError" class="error"></label>
        <label for="name">First Name</label><input type="text" name="FirstName" id="FirstName" class="required" />    
        <label for="name">Last Name</label><input type="text" name="LastName" id="LastName" class="required"/>    
        <label for="name">Email Address</label><input type="text" name="EmailAddress" id="EmailAddress" class="required"/>     
   </div>
   <table id="ContactDataTable" class="display">
         Some code
   </table>

Partial View 2 :

   <div class="datatable-event-header">
        <button id="btnAddNewEnvironmentRow" value="Ok">Add New Environment</button> 
   </div>
 <div id="divAddNewEnvironmentRow" class="datatableAddRow">
        <label id="lblAddEnvironmentError" class="error"></label>
        <label>Hello</label>    
   </div>
   <table id="EnvironmentsDataTable" class="display">
       Some code
 </table>

And my script :

$('#ContactDataTable').dataTable({
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": '/Contacts/ContactsAjaxHandler',
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "aoColumns": [
                                    { "sName": "FirstName" },
			                        { "sName": "LastName" },
			                        { "sName": "EmailAddress" }
		                        ]
    }).makeEditable(
                {
                    sUpdateURL: "/Contacts/UpdateContactsData",
                    sDeleteURL: "/Contacts/DeleteContactsData",
                    sAddURL: "/Contacts/AddContact",
                    sAddNewRowFormId: "divAddNewContactRow",
                    sAddNewRowButtonId: "btnAddNewContactRow",
                    sAddNewRowOkButtonId: "btnAddNewContactOk",
                    sAddNewRowCancelButtonId: "btnAddNewContactCancel",
                    sDeleteRowButtonId: "btnDeleteContact",                                    
                    
                    fnShowError: function (message, action) {
                        switch (action) {
                            case "update":
                                jAlert(message, "Update failed");
                                break;
                            case "delete":
                                jAlert(message, "Delete failed");
                                break;
                            case "add":
                                $("#lblAddContactError").html(message);
                                $("#lblAddContactError").show();
                                break;
                        }
                    },
                    fnStartProcessingMode: function () {
                        $("#Contact_processing_message").dialog();
                    },
                    fnEndProcessingMode: function () {
                        $("#Contact_processing_message").dialog("close");
                    }
                }).columnFilter(
                {
                    aoColumns: [
                                    { type: "text" },
                                    { type: "text" },
                                    { type: "text" }
				               ]
                });

 $('#EnvironmentsDataTable').dataTable({
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": '/Environments/EnvironmentsAjaxHandler',
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "aoColumns": [
                                    { "sName": "EnvironmentName" },
			                        { "sName": "AccessPathURL" }
		                        ]
    }).makeEditable(
                {
                    sUpdateURL: "/Environments/UpdateEnvironmentsData",
                    sDeleteURL: "/Environments/DeleteEnvironmentsData",
                    sAddURL: "/Environments/AddEnvironment",
                    sAddNewRowFormId: "divAddNewEnvironmentRow",
                    sAddNewRowButtonId: "btnAddNewEnvironmentRow",
                    sAddNewRowOkButtonId: "btnAddNewEnvironmentOk",
                    sAddNewRowCancelButtonId: "btnAddNewEnvironmentCancel",
                    sDeleteRowButtonId: "btnDeleteEnvironment",

                    fnShowError: function (message, action) {
                        switch (action) {
                            case "update":
                                jAlert(message, "Update failed");
                                break;
                            case "delete":
                                jAlert(message, "Delete failed");
                                break;
                            case "add":
                                $("#lblAddEnvironmentError").html(message);
                                $("#lblAddEnvironmentError").show();
                                break;
                        }
                    },
                    fnStartProcessingMode: function () {
                        $("#Environment_processing_message").dialog();
                    },
                    fnEndProcessingMode: function () {
                        $("#Environment_processing_message").dialog("close");
                    }
                }).columnFilter(
                {
                    aoColumns: [
                                    { type: "text" },
                                    { type: "text" }
				               ]
                });

Everything else works fine but when I click "btnAddNewContactRow" button it displays "divAddNewEnvironmentRow" content such as label "Hello" but not "divAddNewContactRow" content.

Please help me to fix this issue.

Thanks In Advance.