Hi there,
I am using editor1.2.2, I have incorporated editor to datatables.1.9.4, all seems ok. when I click new, the modal portal to insert pops out, when I fill the form, press create, nothing happens, for edit, when I click edit button, nothing happens, no modal shows up, when I click the delete button, the modal asking to delete or not pops out, when I click it, it says: An error has occurred - Please contact the system administrator. I am a newby with using editor and datatables. please could any one help me out on what I am doing wrong. thanks.
here is the view source code:
<head>
<!-- includes for Editor operation -->
<style class="include" type="text/css">
@import "DataTables-1.9.4/media/css/jquery.dataTables.css";
@import "DataTables-1.9.4/extras/TableTools/media/css/TableTools.css";
@import "DataTables-1.9.4/extras/Editor/media/css/dataTables.editor.css";
</style>
<script class="include" type="text/javascript" charset="utf-8" src="DataTables-1.9.4/media/js/jquery.js"></script>
<script class="include" type="text/javascript" charset="utf-8" src="DataTables-1.9.4/media/js/jquery.dataTables.js"></script>
<script class="include" type="text/javascript" charset="utf-8" src="DataTables-1.9.4/extras/TableTools/media/js/TableTools.js"></script>
<script class="include" type="text/javascript" charset="utf-8" src="DataTables-1.9.4/extras/Editor/media/js/dataTables.editor.js"></script>
<script type="text/javascript" charset="utf-8" id="init-code">
var editor; // use a global for the submit and return data rendering in the examples
$(document).ready(function() {
editor = new $.fn.dataTable.Editor( {
"ajaxUrl": "DataTables-1.9.4/extras/Editor/examples/php/quotes.php",
"domTable": "quotationsID",
"fields": [ {
"label": "jobID:",
"name": "jobID",
"type": "text"
},{
"label": "Customer:",
"name": "custName",
"type": "text"
}, {
"label": "Quote Number:",
"name": "quNo",
"type": "text"
}, {
"label": "Quote Title:",
"name": "quItemdescrip1",
"type": "text"
}, {
"label": "2nd Item Description:",
"name": "quItemdescrip2",
"type": "text"
}, {
"label": "3rd Item Description:",
"name": "quItemdescrip3",
"type": "text"
}, {
"label": "4th Item Description:",
"name": "quItemdescrip4",
"type": "text"
}, {
"label": "5th Item Description:",
"name": "quItemdescrip5",
"type": "text"
}, {
"label": "Quantity 1:",
"name": "quQty1",
"type": "text"
}, {
"label": "Quantity 2:",
"name": "quQty2",
"type": "text"
}, {
"label": "Quantity 3:",
"name": "quQty3",
"type": "text"
}, {
"label": "Quantity 4:",
"name": "quQty4",
"type": "text"
}, {
"label": "Quantity 5:",
"name": "quQty5",
"type": "text"
}, {
"label": "Total Quote Value:",
"name": "quOrderValue",
"type": "text"
}, {
"label": "Site:",
"name": "custSite",
"type": "text"
}, {
"label": "Customer Contact:",
"name": "custCont",
"type": "text"
}, {
"label": "Price/Hr:",
"name": "quPriceHr",
"type": "text"
}, {
"label": "Project Manager:",
"name": "projectManager",
"type": "text"
}
]
} );
$('#quotationsID').dataTable( {
"sDom": '<"top"Tlirpf<"clear">>rt<"bottom"Tlilpf<"clear">>',
"sPaginationType": "full_numbers",
"bRetrieve":true,
"aaSorting": [[ 1, "desc" ]],
"iDisplayLength": 5,
"aoColumnDefs": [{
"aTargets": [7],
"sType": "uk_date",
"mDataProp": "jobID" , "sTitle": "ID",
"mDataProp": "custName" , "sTitle": "Customer",
"mDataProp": "quNo" , "sTitle": "Quote No",
"mDataProp": "quItemdescrip1", "sClass": "center", "sTitle": "Title" ,
"mDataProp": "quItemdescrip2", "sClass": "center" , "sTitle": "Title2",
"mDataProp": "quItemdescrip3", "sClass": "center" , "sTitle": "Title3",
"mDataProp": "quItemdescrip4", "sClass": "center" , "sTitle": "Title4",
"mDataProp": "quItemdescrip5", "sClass": "center" , "sTitle": "Title5",
"mDataProp": "quQty1", "sClass": "center" , "sTitle": "Qty1",
"mDataProp": "quQty2", "sClass": "center" , "sTitle": "Qty2",
"mDataProp": "quQty3", "sClass": "center" , "sTitle": "Qty3",
"mDataProp": "quQty4", "sClass": "center" , "sTitle": "Qty4",
"mDataProp": "quQty5", "sClass": "center" , "sTitle": "Qty5",
"mDataProp": "quOrderValue", "sClass": "center" , "sTitle": "OrderValue",
"mDataProp": "custSite", "sClass": "center" , "sTitle": "Site",
"mDataProp": "custCont", "sClass": "center" , "sTitle": "Contact",
"mDataProp": "quPriceHr", "sClass": "center" , "sTitle": "PriceHr",
"mDataProp": "projectManager", "sClass": "center", "sTitle": "Manager"
}],
"oTableTools": {
"sRowSelect": "multi",
"aButtons": [
{ "sExtends": "editor_create", "editor": editor },
{ "sExtends": "editor_edit", "editor": editor },
{ "sExtends": "editor_remove", "editor": editor }
]
}
} );
} );
</script>
<!-- Includes required for the example page's behaviour - not needed for Editor itself -->
<!--<style type="text/css">
@import "support/examples.css";
@import "../../../media/css/demo_page.css";
@import "../../../examples/examples_support/syntax/css/shCore.css";
</style>
<script type="text/javascript" language="javascript" src="../../../examples/examples_support/syntax/js/shCore.js"></script>
<script type="text/javascript" language="javascript" src="support/examples.js"></script>-->
<script src="webassist/progress_bar/jquery-blockui-formprocessing.js" type="text/javascript"></script>
<script src="ajaxCalls/ajaxCalls.js" type="text/javascript"></script>
<script src="customJavascripts/customJavascripts.js" type="text/javascript"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Home :: Quotations</title>
<link href="responsiveDependentFiles/boilerplate.css" rel="stylesheet" type="text/css">
<link href="fluidGridLayoutCSS/mainSiteCSS.css" rel="stylesheet" type="text/css">
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
<link href="DataTables-1.9.4/media/css/jquery.dataTables.css" rel="stylesheet" type="text/css">
<link href="DataTables-1.9.4/media/css/jquery.dataTables_themeroller.css" rel="stylesheet" type="text/css">
<link href="Editor-1.2.2/media/css/dataTables.editor.css" rel="stylesheet" type="text/css">
I am using editor1.2.2, I have incorporated editor to datatables.1.9.4, all seems ok. when I click new, the modal portal to insert pops out, when I fill the form, press create, nothing happens, for edit, when I click edit button, nothing happens, no modal shows up, when I click the delete button, the modal asking to delete or not pops out, when I click it, it says: An error has occurred - Please contact the system administrator. I am a newby with using editor and datatables. please could any one help me out on what I am doing wrong. thanks.
here is the view source code:
<head>
<!-- includes for Editor operation -->
<style class="include" type="text/css">
@import "DataTables-1.9.4/media/css/jquery.dataTables.css";
@import "DataTables-1.9.4/extras/TableTools/media/css/TableTools.css";
@import "DataTables-1.9.4/extras/Editor/media/css/dataTables.editor.css";
</style>
<script class="include" type="text/javascript" charset="utf-8" src="DataTables-1.9.4/media/js/jquery.js"></script>
<script class="include" type="text/javascript" charset="utf-8" src="DataTables-1.9.4/media/js/jquery.dataTables.js"></script>
<script class="include" type="text/javascript" charset="utf-8" src="DataTables-1.9.4/extras/TableTools/media/js/TableTools.js"></script>
<script class="include" type="text/javascript" charset="utf-8" src="DataTables-1.9.4/extras/Editor/media/js/dataTables.editor.js"></script>
<script type="text/javascript" charset="utf-8" id="init-code">
var editor; // use a global for the submit and return data rendering in the examples
$(document).ready(function() {
editor = new $.fn.dataTable.Editor( {
"ajaxUrl": "DataTables-1.9.4/extras/Editor/examples/php/quotes.php",
"domTable": "quotationsID",
"fields": [ {
"label": "jobID:",
"name": "jobID",
"type": "text"
},{
"label": "Customer:",
"name": "custName",
"type": "text"
}, {
"label": "Quote Number:",
"name": "quNo",
"type": "text"
}, {
"label": "Quote Title:",
"name": "quItemdescrip1",
"type": "text"
}, {
"label": "2nd Item Description:",
"name": "quItemdescrip2",
"type": "text"
}, {
"label": "3rd Item Description:",
"name": "quItemdescrip3",
"type": "text"
}, {
"label": "4th Item Description:",
"name": "quItemdescrip4",
"type": "text"
}, {
"label": "5th Item Description:",
"name": "quItemdescrip5",
"type": "text"
}, {
"label": "Quantity 1:",
"name": "quQty1",
"type": "text"
}, {
"label": "Quantity 2:",
"name": "quQty2",
"type": "text"
}, {
"label": "Quantity 3:",
"name": "quQty3",
"type": "text"
}, {
"label": "Quantity 4:",
"name": "quQty4",
"type": "text"
}, {
"label": "Quantity 5:",
"name": "quQty5",
"type": "text"
}, {
"label": "Total Quote Value:",
"name": "quOrderValue",
"type": "text"
}, {
"label": "Site:",
"name": "custSite",
"type": "text"
}, {
"label": "Customer Contact:",
"name": "custCont",
"type": "text"
}, {
"label": "Price/Hr:",
"name": "quPriceHr",
"type": "text"
}, {
"label": "Project Manager:",
"name": "projectManager",
"type": "text"
}
]
} );
$('#quotationsID').dataTable( {
"sDom": '<"top"Tlirpf<"clear">>rt<"bottom"Tlilpf<"clear">>',
"sPaginationType": "full_numbers",
"bRetrieve":true,
"aaSorting": [[ 1, "desc" ]],
"iDisplayLength": 5,
"aoColumnDefs": [{
"aTargets": [7],
"sType": "uk_date",
"mDataProp": "jobID" , "sTitle": "ID",
"mDataProp": "custName" , "sTitle": "Customer",
"mDataProp": "quNo" , "sTitle": "Quote No",
"mDataProp": "quItemdescrip1", "sClass": "center", "sTitle": "Title" ,
"mDataProp": "quItemdescrip2", "sClass": "center" , "sTitle": "Title2",
"mDataProp": "quItemdescrip3", "sClass": "center" , "sTitle": "Title3",
"mDataProp": "quItemdescrip4", "sClass": "center" , "sTitle": "Title4",
"mDataProp": "quItemdescrip5", "sClass": "center" , "sTitle": "Title5",
"mDataProp": "quQty1", "sClass": "center" , "sTitle": "Qty1",
"mDataProp": "quQty2", "sClass": "center" , "sTitle": "Qty2",
"mDataProp": "quQty3", "sClass": "center" , "sTitle": "Qty3",
"mDataProp": "quQty4", "sClass": "center" , "sTitle": "Qty4",
"mDataProp": "quQty5", "sClass": "center" , "sTitle": "Qty5",
"mDataProp": "quOrderValue", "sClass": "center" , "sTitle": "OrderValue",
"mDataProp": "custSite", "sClass": "center" , "sTitle": "Site",
"mDataProp": "custCont", "sClass": "center" , "sTitle": "Contact",
"mDataProp": "quPriceHr", "sClass": "center" , "sTitle": "PriceHr",
"mDataProp": "projectManager", "sClass": "center", "sTitle": "Manager"
}],
"oTableTools": {
"sRowSelect": "multi",
"aButtons": [
{ "sExtends": "editor_create", "editor": editor },
{ "sExtends": "editor_edit", "editor": editor },
{ "sExtends": "editor_remove", "editor": editor }
]
}
} );
} );
</script>
<!-- Includes required for the example page's behaviour - not needed for Editor itself -->
<!--<style type="text/css">
@import "support/examples.css";
@import "../../../media/css/demo_page.css";
@import "../../../examples/examples_support/syntax/css/shCore.css";
</style>
<script type="text/javascript" language="javascript" src="../../../examples/examples_support/syntax/js/shCore.js"></script>
<script type="text/javascript" language="javascript" src="support/examples.js"></script>-->
<script src="webassist/progress_bar/jquery-blockui-formprocessing.js" type="text/javascript"></script>
<script src="ajaxCalls/ajaxCalls.js" type="text/javascript"></script>
<script src="customJavascripts/customJavascripts.js" type="text/javascript"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Home :: Quotations</title>
<link href="responsiveDependentFiles/boilerplate.css" rel="stylesheet" type="text/css">
<link href="fluidGridLayoutCSS/mainSiteCSS.css" rel="stylesheet" type="text/css">
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
<link href="DataTables-1.9.4/media/css/jquery.dataTables.css" rel="stylesheet" type="text/css">
<link href="DataTables-1.9.4/media/css/jquery.dataTables_themeroller.css" rel="stylesheet" type="text/css">
<link href="Editor-1.2.2/media/css/dataTables.editor.css" rel="stylesheet" type="text/css">