Browser Error:
Use Mozilla 2+ or Chrome 4+ or IE 9+ browsers for Canvas support!!
// init $(document).ready(function(){ $('#action').val('3'); $("#show_jscode_btn").attr("disabled", false); $("#show_phpcode_btn").attr("disabled", false); $('#loadData_btn').attr("disabled", false); $('#hideData_btn').attr("disabled", true); $('#loadGrid_btn').attr("disabled", false); $('#hideGrid_btn').attr("disabled", true); $.ajaxSetup ({ cache: false }); }); // Function for Login button $('#loginBtn').click(function(){ var form_data = {'action': 1, 'username': $('#username').val(), 'password':$('#password').val()} var errors=''; if (form_data.username ==''){ errors += '<div style="color:red">Please enter a Username !!</div>'; } if(form_data.password ==''){ errors += '<div style="color:red">Please enter a Password !!</div>'; } if (errors != ''){ $('#loginResults').html(errors) return false; } $.ajax({ type: 'POST', url: 'ajax/sample.php', data: form_data, dataType: 'json', success: function(response) { if (response.status=='success'){ $('#loginResults').html('<;div style="text-align:center; color:green">'+response.rows.data+'</div>'); window.location.href = 'php_sample.php' }else{ $('#loginResults').html('<;div style="text-align:center; color:red">'+response.rows.data+'</div>'); $('#username').val(''); $('#password').val(''); } } }); }); // Function for Logout button $('#logoutBtn').click(function(){ $('#action').val('2'); $('#loginform').submit(); }); // Sample 2 - Function to load AJAX JSON data from PHP page $('#loadData_btn').click(function(){ var jsonData; $.ajax({ type: 'POST', url: 'ajax/sample.php', data: 'action=3', dataType: 'json', success: function(response) { if (response.status=='success'){ $('#ajaxData').html(response.rows); }else{ $('#ajaxData').html('<div style="text-align:center; color:red">'+response.rows+'</div>'); } } }); $('#loadData_btn').attr("disabled", true); $('#hideData_btn').attr("disabled", false); }); // Sample 2 - Function to hide AJAX JSON data $('#hideData_btn').click(function(){ $('#ajaxData').html(''); $('#loadData_btn').attr("disabled", false); $('#hideData_btn').attr("disabled", true); }); // Sample 3 - Function that builds and loads jqGrid from sample.php page $('#loadGrid_btn').click(function(){ $("#list2").jqGrid({ url: "ajax/sample.php", datatype: "json", mtype: "POST", postData: { action: 4 }, jsonReader: { repeatitems: false, root: "rows", }, colNames:['id','Company', 'Price', 'Change','perchange','Last Updated'], colModel:[ {name:'companyid',index:'companyid', key:true, width:100,editable:true,editoptions:{size:10}, align:'center'}, {name:'company',index:'company', width:100, cellattr: function (rowId, tv, rawObject, cm, rdata) { return 'style="white-space: normal;'}, editable:true}, {name:'price',index:'price', width:100,editable:true,editoptions:{size:10}, formatter:'currency', formatoptions:{decimalSeparator:".", thousandsSeparator: ",", decimalPlaces: 2, prefix: "$"}}, {name:'change',index:'change', width:100,editable:true,editoptions:{size:25}, formatter:'currency', formatoptions:{decimalSeparator:".", thousandsSeparator: ",", decimalPlaces: 2, prefix: "$"}}, {name:'perchange',index:'perchange', width:100, align:"right",editable:true,editoptions:{size:10}, formatter:'integer', formatoptions:{suffix: " %"}, align:'center'}, {name:'LastUpdated',index:'LastUpdated', width:200, align:"right",editable:true,editoptions:{size:10}, formatter: 'date', formatoptions: { srcformat: 'Y-m-d', newformat: 'm/d/Y'}, align:'center'}, ], rowNum: 4, scrollerbar:true, loadonce: true, pager: '#pager2', sortname: 'companyid', sortorder: "asc", height: "75", shrinkToFit: true, forceFit: true, autowidth: true, onSelectRow: function(id) { var getID = $(this).jqGrid('getCell', id, 'companyid'); }, viewrecords: true, caption:"PHP/MySQL/JSON Data to jqGrid Example" }); // Function Dynamically resizes grid $(window).bind('resize', function() { var width = $('#gridData').width(); if (width == null || width < 1){ width = $('#gridData').attr('offsetWidth'); } width = width - 2; if (width > 0 && Math.abs(width - $("#list2").width()) > 5) { $("#list2").setGridWidth(width); } }).trigger('resize'); $('#loadGrid_btn').attr("disabled", true); $('#hideGrid_btn').attr("disabled", false); }); // Sample 3 - Function that unloads jqGrid $('#hideGrid_btn').click(function(){ $("#list2").GridUnload(); $(window).unbind('resize'); $('#loadGrid_btn').attr("disabled", false); $('#hideGrid_btn').attr("disabled", true); }); // Function to Select code sample function selectCode(){ var selID; if ($('#jscode').css('display') == 'block'){ selID ='jscodetext'; }else{ selID ='phpcodetext'; } deselect(); if (document.selection) { var range = document.body.createTextRange(); range.moveToElementText(document.getElementById(selID)); range.select(); }else if (window.getSelection) { var range = document.createRange(); range.selectNode(document.getElementById(selID)); window.getSelection().addRange(range); } } function deselect(){ if (document.selection) document.selection.empty(); else if (window.getSelection) window.getSelection().removeAllRanges(); } // Function to display code sample function displayJSCode() { deselect(); $("#jscode").show(); $("#phpcode").hide(); $("#show_jscode_btn").attr("disabled", true); $("#show_phpcode_btn").attr("disabled", false); } function displayPHPCode() { deselect(); $("#jscode").hide(); $("#phpcode").show(); $("#show_jscode_btn").attr("disabled", false); $("#show_phpcode_btn").attr("disabled", true); }
<?PHP session_start(); require_once('../conn/tek.php'); require_once('../functions/password.php'); require_once('../functions/functions.php'); ini_set('display_errors', '1'); error_reporting (E_ERROR); $action=0; // Get our action type from the post data if ($_SERVER['REQUEST_METHOD']=='POST' && isset($_POST['action'])) $action= $_POST['action']; $_POST=sanitize($_POST); switch ($action) { // Action = 0 We have no action case 0: $json_data = array('status'=>'failure','rows'=>'A server error occured'); break; // Action = 1 Sample 1 Login button Pushed. Connect to MySQL DB and and check username and password case 1: $username=trim($_POST['username']); $password=trim($_POST['password']); $whereArr['username'] = $username; $loggedIn=checkLogin($username,$password); if($loggedIn){ $rows['data'] = 'Successfully Logged In User: '.$username; $_SESSION['sample_auth'] = '29altwm3fsetkig'; $json_data = array('status'=>'success','rows'=>$rows); }else { $rows['data'] = 'Login Results: Wrong Username or Password'; $json_data = array('status'=>'failure','rows'=>$rows); } break; // Action = 2 Logut Button Pushed. case 2: session_destroy(); header("location:../php_sample.php"); break; // Action = 3 Sample 2 Button Pushed. Open raw HTML file and return JSON Object case 3: $html_data=file_get_contents('test.html'); if ($html_data){ $json_data = array('status'=>'success','rows'=>$html_data); }else{ $json_data = array('status'=>'failure','rows'=>'A server error occured'); } break; // Action = 4 Sample 3 Button Pushed. Connect to MySQL DB and return Company table as JSON object case 4: $result = $db->query("SELECT * FROM company"); if ($result){ $rows = array(); while($row = $result->fetch(PDO::FETCH_ASSOC)) { $rows[] = $row; } $json_data = array('status'=>'success','rows'=>$rows); }else{ $json_data = array('status'=>'failure','rows'=>'A server error occured'); }; break; } header('Content-Type: application/json'); echo json_encode($json_data);