jQWidgets Forums

jQuery UI Widgets Forums Grid Grid paging – losing server side order on second and subsequent pages

This topic contains 1 reply, has 2 voices, and was last updated by  Dimitar 9 years, 10 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author

  • harryb1965
    Participant

    I have the following code, and all works fine on first page but when I page down, the Lessons order goes all out of whack

    <!DOCTYPE html>
    <html lang=”en”>
    <head>

    <script type=”text/javascript”>

    var user_id = sessionStorage.getItem(‘user_id’);
    var user_level = Number(sessionStorage.getItem(‘user_level’));

    if(typeof(sessionStorage.user_id) == “undefined”) {
    window.location.href = ‘Login.html’;
    }

    var theme = localStorage.getItem(‘theme’);

    var initialiserow = function () {

    $(“#aDescription”).val(“”);
    $(“#aLesson_No”).val(0);
    $(“#check_followup”).prop( “checked”, false );

    return;
    }

    var url = “Course_Details.php?type=LESSLIST”;
    // prepare the data
    var source =
    {
    datatype: “json”,
    datafields: [
    { name: ‘ID’ },
    { name: ‘Description’ }

    ],
    url: url,
    };
    var courseAdapter = new $.jqx.dataAdapter(source);

    // Create a jqxDropDownList
    $(“#courselist”).jqxDropDownList({
    selectedIndex: 0, source: courseAdapter, displayMember: “Description”, valueMember: “ID”, width: 250, height: 25
    });

    var source =
    {
    datatype: “json”,
    datafields: [
    { name: ‘ID’, type: ‘number’ },
    { name: ‘Lesson_No’, type: ‘number’ },
    { name: ‘Course_No’, type: ‘number’},
    { name: ‘Description’, type: ‘string’ },
    { name: ‘Course’, type: ‘string’ },
    { name: ‘Followup’, type: ‘string’ },
    { name: ‘Last_Added’, type: ‘int’ }
    ],
    url: ‘Lesson_Details.php’,
    cache: false,
    root: ‘Rows’,
    ID: ‘Course_No’,
    beforeprocessing: function(data)
    {
    source.totalrecords = data[0].TotalRows;

    },
    addrow: function (rowid, rowdata, position, commit) {
    addRecord = {};

    addRecord[‘Description’] = $(“#aDescription”).val();
    addRecord[‘Lesson_No’] = $(“#aLesson_No”).val();
    addRecord[‘Course_No’] = $(“#courselist”).jqxDropDownList(‘getSelectedItem’).value;
    var Checked = $(“#check_followup”).prop(‘checked’);
    console.log(Checked)
    if (Checked) {
    addRecord[“Followup”] = “Y”
    }
    else {
    addRecord[“Followup”] = “N”
    }
    console.log(addRecord);
    $.ajax({
    type: “POST”,
    url: ‘Lesson_Details.php’,
    data: { type: “ADD”, Description: addRecord[“Description”], Course_No: addRecord[“Course_No”], Lesson_No : addRecord[“Lesson_No”], Followup: addRecord[“Followup”] },
    dataType:’JSON’,
    success: function(response){
    console.log(response);
    if (response.success == true) {
    $(“#jqxgrid”).jqxGrid(‘updatebounddata’);
    }
    else {
    alert(response.statusMessage);
    }
    }

    });

    },

    updaterow: function (rowid, newdata, commit) {
    var selectedrowindex = $(“#jqxgrid”).jqxGrid(‘getselectedrowindex’);
    var dataRecord = $(“#jqxgrid”).jqxGrid(‘getrowdata’, selectedrowindex);
    dataRecord[‘Description’] = $(“#eDescription”).val();
    dataRecord[‘Lesson_No’] =$(“#eLesson_No”).jqxNumberInput(‘val’);
    var Checked = $(“#echeck_followup”).prop(‘checked’);
    if (Checked) {
    dataRecord[“Followup”] = “Y”
    }
    else {
    dataRecord[“Followup”] = “N”
    }
    console.log(dataRecord);
    $.ajax({
    type: “POST”,
    url: “Lesson_Details.php”,
    data: { type: “UPD”, ID: dataRecord[‘ID’], Course_No: dataRecord[‘Course_No’], Lesson_No: dataRecord[“Lesson_No”], Description: dataRecord[“Description”], Followup: dataRecord[“Followup”] },
    dataType:’JSON’,
    success: function(response){
    console.log(response);
    if (response.success == true) {
    commit(true);
    $(“#jqxgrid”).jqxGrid(‘updatebounddata’);
    }
    else {
    alert(response.statusMessage);
    }
    }
    });
    },
    filter: function()
    {
    // update the grid and send a request to the server.
    $(“#jqxgrid”).jqxGrid(‘updatebounddata’, ‘filter’);
    },
    sort: function () {
    // update the grid and send a request to the server.
    $(“#jqxgrid”).jqxGrid(‘updatebounddata’, ‘sort’);
    },

    beforeprocessing: function(data)
    {
    if (data != null)
    {
    source.totalrecords = data[0].TotalRows;
    }
    }

    };

    var lessonAdapter = new $.jqx.dataAdapter(source, {
    loadError: function(xhr, status, error)
    {
    alert(error);
    }
    });

    var toThemeProperty = function (className) {
    return className + ” ” + className + “-” + theme;
    }
    var groupsrenderer = function (text, group, expanded, data) {

    var count = 0;

    var text = data.groupcolumn.text + ‘: ‘ + group;
    for (i=0;i < data.subItems.length;i++) {
    count = count + 1;
    }

    return ‘<div style=”position: absolute;”><span>‘ + text + ‘, </span>’ + ‘<span>’ + “Lessons (” + count + ‘)</span></div>’;
    }

    var editrow = -1;

    // initialize jqxGrid
    $(“#jqxgrid”).jqxGrid(
    {
    theme: theme,
    width: 620,
    height: 500,
    source: lessonAdapter,
    showtoolbar: true,
    filterable: true,
    groupable: true,
    showgroupsheader: false,
    groupsexpandedbydefault: true,
    groupsrenderer: groupsrenderer,
    pageable: true,
    pagesize: 10,
    autoheight: true,
    virtualmode: true,
    rendergridrows: function()
    {
    return lessonAdapter.records;
    },
    rendertoolbar: function (toolbar) {
    var me = this;
    var container = $(“<div style=’margin: 5px;’></div>”);
    toolbar.append(container);
    container.append(‘<input id=”addrowbutton” type=”button” value=”Add Lesson” />’);
    container.append(‘<input style=”margin-left: 5px;” id=”deleterowbutton” type=”button” value=”Delete Lesson” />’);
    container.append(‘<input style=”margin-left: 5px;” id=”updaterowbutton” type=”button” value=”Update Lesson” />’);
    $(“#addrowbutton”).jqxButton();
    $(“#deleterowbutton”).jqxButton();
    $(“#updaterowbutton”).jqxButton();
    // update row.
    $(“#updaterowbutton”).on(‘click’, function () {
    var selectedrowindex = $(“#jqxgrid”).jqxGrid(‘getselectedrowindex’);
    var rowscount = $(“#jqxgrid”).jqxGrid(‘getdatainformation’).rowscount;
    if (selectedrowindex >= 0 && selectedrowindex < rowscount) {
    var id = $(“#jqxgrid”).jqxGrid(‘getrowid’, selectedrowindex);
    var dataRecord = $(“#jqxgrid”).jqxGrid(‘getrowdata’, selectedrowindex);
    $(“#eCourse”).val(dataRecord.Course);
    $(“#eDescription”).val(dataRecord.Description);
    $(“#eLesson_No”).val(dataRecord.Lesson_No);
    if (dataRecord[“Followup”] == “Y”) { $(“#echeck_followup”).prop( “checked”, true ); } else {$(“#echeck_followup”).prop( “checked”, false );}

    // open the lesson window when the user clicks a button.
    var offset = $(“#jqxgrid”).offset();
    $(“#editlessonWindow”).jqxWindow({ position: { x: parseInt(offset.left) + 60, y: parseInt(offset.top) + 60 } });
    // get the clicked rows data and initialize the input fields.

    // show the lesson window.
    $(“#editlessonWindow”).jqxWindow(‘open’);

    $(“#jqxgrid”).jqxGrid(‘ensurerowvisible’, selectedrowindex);
    }
    });
    // create new row.
    $(“#addrowbutton”).on(‘click’, function () {
    // open the lesson window when the user clicks a button.
    var datarow = initialiserow();

    var offset = $(“#jqxgrid”).offset();
    $(“#addlessonWindow”).jqxWindow({ position: { x: parseInt(offset.left) + 60, y: parseInt(offset.top) + 60 } });
    // get the clicked rows data and initialize the input fields.

    // show the lesson window.
    $(“#addlessonWindow”).jqxWindow(‘open’);

    });
    // delete row.
    $(“#deleterowbutton”).on(‘click’, function () {
    var selectedrowindex = $(“#jqxgrid”).jqxGrid(‘getselectedrowindex’);
    var rowscount = $(“#jqxgrid”).jqxGrid(‘getdatainformation’).rowscount;

    if (selectedrowindex >= 0 && selectedrowindex < rowscount) {
    var dataRecord = $(“#jqxgrid”).jqxGrid(‘getrowdata’, selectedrowindex );

    $.ajax({
    type: “POST”,
    url: “Lesson_Details.php”,
    data: { type: “DEL”, ID: dataRecord[“ID”] },
    dataType:’JSON’,
    success: function(response){
    console.log(response);
    if (response.success == true) {
    $(“#jqxgrid”).jqxGrid(‘updatebounddata’);
    }
    else {
    alert(response.statusMessage);
    }
    }
    });

    }
    });
    },
    columns: [
    { text: ‘Course_No’, datafield: ‘Course_No’, width: 90},
    { text: ‘Lesson_No’, datafield: ‘Lesson_No’, width: 80 },
    { text: ‘ID’, datafield: ‘ID’, width: 150, hidden: ‘true’},
    { text: ‘Course’, datafield: ‘Course’, hidden: ‘true’ },
    { text: ‘Description’, datafield: ‘Description’, width: 350 },
    { text: ‘Followup’, datafield: ‘Followup’, width: 80 }

    ],
    groups: [‘Course’],
    });
    // initialize the lesson window and buttons.
    $(“#addlessonWindow”).jqxWindow({
    width: 450, height: 900, resizable: false, isModal: true, autoOpen: false, modalOpacity: 0.01
    });
    // initialize the lesson window and buttons.
    $(“#editlessonWindow”).jqxWindow({
    width: 450, height: 900, resizable: false, isModal: true, autoOpen: false, modalOpacity: 0.01
    });

    // initialize the input fields.

    $(‘.text-input’).addClass(‘jqx-input’);
    $(‘.text-input’).addClass(‘jqx-rc-all’);
    $(“#aLesson_No”).jqxNumberInput({ decimalDigits: 0, width: ‘250px’, height: ’25px’, min: 1, max: 100, value: 1});
    $(“#eLesson_No”).jqxNumberInput({ decimalDigits: 0, width: ‘250px’, height: ’25px’, min: 1, max: 100, value: 1});
    if (theme.length > 0) {
    $(‘.text-input’).addClass(‘jqx-input-‘ + theme);
    $(‘.text-input’).addClass(‘jqx-widget-content-‘ + theme);
    $(‘.text-input’).addClass(‘jqx-rc-all-‘ + theme);
    }

    // initialize validator.
    $(‘#add-lesson-ajax’).jqxValidator({
    rules: [
    { input: ‘#aLesson_No’, message: ‘Lesson already exists’, action: ‘valuechanged’, rule: function () {
    Lesson_No = $(“#aLesson_No”).val();
    Course_No = $(“#courselist”).jqxDropDownList(‘getSelectedItem’).value;

    var retvalue = $.ajax({ type: “POST”,
    url: ‘Lesson_Details.php’,
    data: { type: “VAL”, ID: 0, Course_No: Course_No, Lesson_No: Lesson_No },
    async: false,
    dataType:’JSON’,
    success: function(status){
    }
    }).responseText;

    var data = JSON.parse(retvalue);

    return data[“success”];
    }},
    { input: ‘#aDescription’, message: ‘Description is required!’, action: ‘keyup, blur’, rule: ‘required’ }
    ]
    });
    $(‘#edit-lesson-ajax’).jqxValidator({
    rules: [
    { input: ‘#eDescription’, message: ‘Description is required!’, action: ‘keyup, blur’, rule: ‘required’ },
    { input: ‘#aLesson_No’, message: ‘Lesson already exists’, action: ‘valuechanged’, rule: function () {
    Lesson_No = $(“#aLesson_No”).val();
    Course_No = $(“#courselist”).jqxDropDownList(‘getSelectedItem’).value;

    var retvalue = $.ajax({ type: “POST”,
    url: ‘Lesson_Details.php’,
    data: { type: “VAL”, ID: $(“#eID”).val(), Course_No: Course_No, Lesson_No: Lesson_No },
    async: false,
    dataType:’JSON’,
    success: function(status){
    }
    }).responseText;

    var data = JSON.parse(retvalue);

    return data[“success”];
    }},
    ]
    });

    $(‘#add-lesson-ajax’).on(‘validationSuccess’, function (event) {

    addRecord = {};

    addRecord[‘Lesson_No’] = $(“#aLesson_No”).val();
    addRecord[‘Description’] = $(“#aDescription”).val();
    addRecord[‘Course_No’] = $(“#courselist”).jqxDropDownList(‘getSelectedItem’).value;
    var Checked = $(“#check_followup”).prop(‘checked’);
    if (Checked) {
    addRecord[“Followup”] = “Y”
    }
    else {
    addRecord[“Followup”] = “N”
    }
    console.log(addRecord);
    var commit = $(“#jqxgrid”).jqxGrid(“addrow”, null, addRecord);

    $(‘#add-lesson-ajax’).jqxValidator(‘hide’);
    $(“#addlessonWindow”).jqxWindow(‘hide’);

    });
    $(‘#add-lesson-ajax’).on(‘validationError’, function (event) {
    alert(‘Please correct the highlighted errors!’);
    });

    $(‘#edit-lesson-ajax’).on(‘validationSuccess’, function (event) {
    var selectedrowindex = $(“#jqxgrid”).jqxGrid(‘getselectedrowindex’);
    var editRecord = $(“#jqxgrid”).jqxGrid(‘getrowdata’, selectedrowindex);
    editRecord[‘Description’] = $(“#eDescription”).val();
    editRecord[‘Lesson_No’] = $(“#eLesson_No”).val();
    var Checked = $(“#echeck_followup”).prop(‘checked’);
    console.log(Checked);
    if (Checked) {
    editRecord[“Followup”] = “Y”
    }
    else {
    editRecord[“Followup”] = “N”
    }
    console.log(editRecord);
    var selectedrowindex = $(“#jqxgrid”).jqxGrid(‘getselectedrowindex’);
    var id = $(“#jqxgrid”).jqxGrid(‘getrowid’, selectedrowindex);

    var commit = $(“#jqxgrid”).jqxGrid(“updaterow”, id, editRecord);

    $(‘#edit-lesson-ajax’).jqxValidator(‘hide’);
    $(“#editlessonWindow”).jqxWindow(‘hide’);
    });
    $(‘#edit-lesson-ajax’).on(‘validationError’, function (event) {
    alert(‘Please correct the highlighted errors!’);
    });

    $(“#addLesson”).jqxButton({ theme: theme });
    $(“#editLesson”).jqxButton({ theme: theme });

    // update the edited row when the user clicks the ‘Save’ button.
    $(“#addLesson”).bind( “click”, function( event ) {
    $(‘#add-lesson-ajax’).jqxValidator(‘validate’);

    });
    $(“#editLesson”).bind( “click”, function( event ) {
    $(‘#edit-lesson-ajax’).jqxValidator(‘validate’);
    });

    </script>
    </head>
    <body>
    <div class=”row”>
    <div class=”col-lg-12″>
    <h1 class=”page-header”>Lesson Details </h1>

    </div>
    </div>
    <!– /.row –>
    <div id=’jqxWidget’ style=”font-size: 13px; font-family: Verdana; float: left;”>
    <div id=”jqxgrid” style=”font-size: 12px; font-family: Verdana; float: left;”></div>
    </div>
    <div id=”addlessonWindow”>
    <div>Add Lesson</div>
    <div style=”overflow: hidden;”>
    <form id=”add-lesson-ajax” target=”aform-iframe” method=”post” action=”Less_Details.php?type=ADD” style=”font-size: 12px; font-family: Verdana; width: 200px;” >
    <table class=”table”>
    <tr>
    <td align=”left”>Course:</td>
    <td align=”left”><div id=”courselist”></div></td>
    </tr>
    <tr>
    <td align=”right”>Lesson Number:</td>
    <td align=”left”><div id=”aLesson_No”></div></td>
    </tr>
    <tr>
    <td align=”right”>Description:</td>
    <td align=”left”><input id=”aDescription” type=”text” class=”form-control” maxlength=”40″ size=”40″/></td>
    </tr>
    <tr>
    <td align=”right”>Add Followup after Lesson:</td>
    <td><input type=”checkbox” id=”check_followup” ></td>
    </tr>
    <tr>
    <td align=”right”></td>
    <td style=”padding-top: 10px;” align=”left”><input style=”margin-right: 5px;” type=”button” id=”addLesson” value=”Save” /></td>
    </tr>

    </table>
    </form>
    <iframe id=”aform-iframe” name=”aform-iframe” class=”demo-iframe” frameborder=”0″></iframe>

    </div>
    </div>
    <div id=”editlessonWindow”>
    <div>Edit Lesson</div>
    <div style=”overflow: hidden;”>
    <form id=”edit-lesson-ajax” target=”aform-iframe” method=”post” action=”Lesson_Details.php?type=UPD” style=”font-size: 12px; font-family: Verdana; width: 200px;”>
    <table class=”table”>
    <tr>
    <td align=”left”>Course:</td>
    <td align=”left”><input id=”eCourse” type=”text” size=”40″ readonly/></td>
    </tr>
    <tr>
    <td align=”right”>Lesson Number:</td>
    <td align=”left”><div id=”eLesson_No”></div></td>
    </tr>
    <tr>
    <td align=”right”>Description:</td>
    <td align=”left”><input id=”eDescription” class=”form-control” type=”text” maxlength=”40″ size=”40″/></td>
    </tr>
    <tr>
    <td align=”right”>Add Followup after Lesson:</td>
    <td><input type=”checkbox” id=”echeck_followup” value=”echeck_followup” /></td>
    </tr>
    <tr>
    <td align=”right”></td>
    <td style=”padding-top: 10px;” align=”right”><input style=”margin-right: 5px;” type=”button” id=”editLesson” value=”Save” /></td>
    </tr>
    </table>
    </form>
    <iframe id=”aform-iframe” name=”aform-iframe” class=”demo-iframe” frameborder=”0″></iframe>

    </div>

    </body>
    </html>

    <?php
    include_once(‘Connect.php’);
    include_once ‘UtilFunctions.php’
    $pagenum = $_GET[‘pagenum’];
    $pagesize = $_GET[‘pagesize’];
    $start = $pagenum * $pagesize;
    $query = “SELECT SQL_CALC_FOUND_ROWS concat(cd.ID , ‘ – ‘ ,cd.Description) as Course, l.* from Lessons l inner join Course_Details cd on cd.ID = l.Course_No order by cd.ID, cd.Description ,l.Lesson_No LIMIT $start, $pagesize “;
    $result = $mysqli->query($query);
    $sql = “SELECT FOUND_ROWS() AS found_rows“;
    $rows = $mysqli->query($sql);
    $rows = mysqli_fetch_array($rows, MYSQLI_ASSOC);
    $total_rows = $rows[‘found_rows’];
    $filterquery = “”;

    // filter data.
    if (isset($_GET[‘filterscount’]))
    {
    $filterscount = $_GET[‘filterscount’];

    if ($filterscount > 0)
    {
    $where = ” WHERE (“;
    $tmpdatafield = “”;
    $tmpfilteroperator = “”;
    for ($i=0; $i < $filterscount; $i++)
    {
    // get the filter’s value.
    $filtervalue = $_GET[“filtervalue” . $i];
    // get the filter’s condition.
    $filtercondition = $_GET[“filtercondition” . $i];
    // get the filter’s column.
    $filterdatafield = $_GET[“filterdatafield” . $i];
    // get the filter’s operator.
    $filteroperator = $_GET[“filteroperator” . $i];

    if ($tmpdatafield == “”)
    {
    $tmpdatafield = $filterdatafield;
    }
    else if ($tmpdatafield <> $filterdatafield)
    {
    $where .= “)AND(“;
    }
    else if ($tmpdatafield == $filterdatafield)
    {
    if ($tmpfilteroperator == 0)
    {
    $where .= ” AND “;
    }
    else $where .= ” OR “;
    }

    // build the “WHERE” clause depending on the filter’s condition, value and datafield.
    switch($filtercondition)
    {
    case “NOT_EMPTY”:
    case “NOT_NULL”:
    $where .= ” ” . $filterdatafield . ” NOT LIKE ‘” . “” .”‘”;
    break;
    case “EMPTY”:
    case “NULL”:
    $where .= ” ” . $filterdatafield . ” LIKE ‘” . “” .”‘”;
    break;
    case “CONTAINS_CASE_SENSITIVE”:
    $where .= ” BINARY ” . $filterdatafield . ” LIKE ‘%” . $filtervalue .”%'”;
    break;
    case “CONTAINS”:
    $where .= ” ” . $filterdatafield . ” LIKE ‘%” . $filtervalue .”%'”;
    break;
    case “DOES_NOT_CONTAIN_CASE_SENSITIVE”:
    $where .= ” BINARY ” . $filterdatafield . ” NOT LIKE ‘%” . $filtervalue .”%'”;
    break;
    case “DOES_NOT_CONTAIN”:
    $where .= ” ” . $filterdatafield . ” NOT LIKE ‘%” . $filtervalue .”%'”;
    break;
    case “EQUAL_CASE_SENSITIVE”:
    $where .= ” BINARY ” . $filterdatafield . ” = ‘” . $filtervalue .”‘”;
    break;
    case “EQUAL”:
    $where .= ” ” . $filterdatafield . ” = ‘” . $filtervalue .”‘”;
    break;
    case “NOT_EQUAL_CASE_SENSITIVE”:
    $where .= ” BINARY ” . $filterdatafield . ” <> ‘” . $filtervalue .”‘”;
    break;
    case “NOT_EQUAL”:
    $where .= ” ” . $filterdatafield . ” <> ‘” . $filtervalue .”‘”;
    break;
    case “GREATER_THAN”:
    $where .= ” ” . $filterdatafield . ” > ‘” . $filtervalue .”‘”;
    break;
    case “LESS_THAN”:
    $where .= ” ” . $filterdatafield . ” < ‘” . $filtervalue .”‘”;
    break;
    case “GREATER_THAN_OR_EQUAL”:
    $where .= ” ” . $filterdatafield . ” >= ‘” . $filtervalue .”‘”;
    break;
    case “LESS_THAN_OR_EQUAL”:
    $where .= ” ” . $filterdatafield . ” <= ‘” . $filtervalue .”‘”;
    break;
    case “STARTS_WITH_CASE_SENSITIVE”:
    $where .= ” BINARY ” . $filterdatafield . ” LIKE ‘” . $filtervalue .”%'”;
    break;
    case “STARTS_WITH”:
    $where .= ” ” . $filterdatafield . ” LIKE ‘” . $filtervalue .”%'”;
    break;
    case “ENDS_WITH_CASE_SENSITIVE”:
    $where .= ” BINARY ” . $filterdatafield . ” LIKE ‘%” . $filtervalue .”‘”;
    break;
    case “ENDS_WITH”:
    $where .= ” ” . $filterdatafield . ” LIKE ‘%” . $filtervalue .”‘”;
    break;
    }

    if ($i == $filterscount – 1)
    {
    $where .= “)”;
    }

    $tmpfilteroperator = $filteroperator;
    $tmpdatafield = $filterdatafield;
    }
    // build the query.
    $query = “SELECT SQL_CALC_FOUND_ROWS concat(cd.ID , ‘ – ‘ ,cd.Description) as Course, l.* from Lessons l inner join Course_Details cd on cd.ID = l.Course_No “.$where. ” order by cd.ID, cd.Description , l.Lesson_No LIMIT $start, $pagesize”;
    $result = $mysqli->query($query);
    $sql = “SELECT FOUND_ROWS() AS found_rows“;
    $rows = $mysqli->query($sql);
    $rows = mysqli_fetch_array($rows, MYSQLI_ASSOC);
    $new_total_rows = $rows[‘found_rows’];
    $query = “SELECT SQL_CALC_FOUND_ROWS concat(cd.ID , ‘ – ‘ ,cd.Description) as Course, l.* from Lessons l inner join Course_Details cd on cd.ID = l.Course_No “.$where.” order by cd.ID, cd.Description , l.Lesson_No LIMIT $start, $pagesize “;
    $total_rows = $new_total_rows;
    }
    }

    if (isset($_GET[‘sortdatafield’]))
    {

    $sortfield = $_GET[‘sortdatafield’];
    $sortorder = $_GET[‘sortorder’];

    if ($sortorder != ”)
    {
    if ($_GET[‘filterscount’] == 0)
    {
    if ($sortorder == “desc”)
    {
    $query = “SELECT cd.Description as Course, l.* from Lessons l inner join Course_Details cd on cd.ID = l.Course_No ORDER BY cd.ID, cd.Description , l.Lesson_No LIMIT $start, $pagesize”;
    }
    else if ($sortorder == “asc”)
    {
    $query = “SELECT cd.Description as Course, l.* from Lessons l inner join Course_Details cd on cd.ID = l.Course_No ORDER BY cd.ID, cd.Description , l.Lesson_No LIMIT $start, $pagesize”;
    }
    }
    else
    {
    if ($sortorder == “desc”)
    {
    $filterquery .= ” order by cd.ID, cd.Description , l.Lesson_No LIMIT $start, $pagesize”;
    }
    else if ($sortorder == “asc”)
    {
    $filterquery .= ” order by cd.ID, cd.Description , l.Lesson_No LIMIT $start, $pagesize”;
    }
    $query = $filterquery;
    }
    }
    }

    $result = $mysqli->query($query);
    $courses = null;
    // get data and store in a json array
    while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) {

    $courses[] = array(
    ‘ID’ => $row[‘ID’],
    ‘Lesson_No’ => $row[‘Lesson_No’],
    ‘Description’ => $row[‘Description’],
    ‘Course_No’ => $row[‘Course_No’],
    ‘Course’ => $row[‘Course’],
    ‘Followup’ => $row[‘Followup’],

    );
    }
    $data[] = array(
    ‘TotalRows’ => $total_rows,
    ‘Rows’ => $courses
    );
    echo json_encode($data);


    Dimitar
    Participant

    Hello harryb1965,

    Please take a look at our PHP Grid Server Sorting, Paging and Filtering demo and the tutorial on the same topic: http://www.jqwidgets.com/jquery-widgets-documentation/documentation/phpintegration/php-server-side-grid-paging-and-sorting.htm. We hope these are helpful to you.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.