I am currently experimenting with the EasyUI library and facing difficulties in getting the Data grid feature to function properly. Below is a glimpse of my progress so far:
Header
<script type="text/javascript" src="assets/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.easyui.min.js"></script>
HTML
<div id="user_control_datagrid"></div>
JavaScript
$( document ).ready(function() {
console.log( "ready!" );
$( ".user_control_search" ).click(function( event ) {
event.preventDefault();
console.log("FORM SEARCH CLICKED");
var formData = $('#user_control_form').serializeArray();
console.log("Form Data: ", formData);
$('#user_control_datagrid').datagrid({
url:'user.php',
queryParams:formData,
columns:[[
{field:'code',title:'Code',width:100},
{field:'name',title:'Name',width:100},
{field:'price',title:'Price',width:100,align:'right'}
]]
});
});
});
However, I keep encountering an error message each time I attempt to execute this code:
Uncaught TypeError: $(...).datagrid is not a function
If anyone could offer guidance on what might be amiss and how best to rectify this issue, it would be greatly appreciated.
Many Thanks