Thank you Will – I will give that a try.
Ken
I did a lot of further digging and testing, and I think the issue is that the insert into the first table isn’t sending the LpcMemberID in the post message since that field is an auto-increment field, and my understanding of the function gets its data from either the $_GET or $_POST data. Looking at the debug log I never see any value set for $cid other than _empty, so the setAfterCrudAction sql fails with an error (I had to enable error logs in my DB engine).
So the question is – is it even possible to get the last primary key value (LpcMemberID) in the script?
Will:
Good grief, all that because I forgot to capitalize an ‘m’!
All I had to do was correct the select statement for the proper case.
Thank you for your quick reply.
Ken
What is the secret to formatting code like you did in your post above? I did it once years ago and now can’t for the life of me figure out how to do it.
Can you post a sticky post somewhere with instructions on how to post things like that in this forum?
Hi Will:
I implemented the changes but I am getting an error. Here is my index.php file:
[code lang=”php”]
<code>&amp;lt;?php</code>
<code>session_start();</code>
<code>?&amp;gt;;</code>
<code>&amp;lt;!DOCTYPE html&amp;gt;</code>
<code>&amp;lt;html&amp;gt;</code>
<code>&amp;lt;head&amp;gt;</code>
<code>&amp;lt;title&amp;gt;Contact Notes&amp;lt;/title&amp;gt;</code>
<code>&amp;lt;link rel="stylesheet" type="text/css" media="screen" href="/jqSuite/css/jquery-ui.css" /&amp;gt;</code>
<code>&amp;lt;link rel="stylesheet" type="text/css" media="screen" href="/jqSuite/css/trirand/ui.jqgrid.css" /&amp;gt;</code>
<code>&amp;lt;link rel="stylesheet" type="text/css" media="screen" href="/jqSuite/css/ui.multiselect.css" /&amp;gt;</code>
<code>&amp;lt;style type="text"&amp;gt;</code>
<code>html, body {</code>
<code>margin: 0; /* Remove body margin/padding */</code>
<code>padding: 0;</code>
<code>overflow: hidden; /* Remove scroll bars on browser window */</code>
<code>font-size: 100%;</code>
<code>}</code>
<code>.ui-jqgrid {</code>
<code>font-size: 14px;</code>
<code>}</code>
<code>.ui-jqgrid .ui-jqgrid-btable tbody tr.jqgrow td {</code>
<code>white-space: normal !important;</code>
<code>height: auto;</code>
<code>}</code>
<code>.mylongdata {</code>
<code>height: 90px;</code>
<code>overflow-y: auto;</code>
<code>}</code>
<code>&amp;lt;/style&amp;gt;</code>
<code>&amp;lt;script src="/jqSuite/js/jquery.min.js" type="text/javascript"&amp;gt;&amp;lt;/script&amp;gt;</code>
<code>&amp;lt;script src="/jqSuite/js/trirand/i18n/grid.locale-en.js" type="text/javascript"&amp;gt;&amp;lt;/script&amp;gt;</code>
<code>&amp;lt;script src="/jqSuite/js/trirand/jquery.jqGrid.min.js" type="text/javascript"&amp;gt;&amp;lt;/script&amp;gt;</code>
<code>&amp;lt;script type="text/javascript"&amp;gt;</code>
<code>$.jgrid.no_legacy_api = true;</code>
<code>$.jgrid.useJSON = true;</code>
<code>$.jgrid.defaults.width = "700";</code>
<code>&amp;lt;/script&amp;gt;</code>
<code>&amp;lt;script src="/jqSuite/js/jquery-ui.min.js" type="text/javascript"&amp;gt;&amp;lt;/script&amp;gt;</code>
<code>&amp;lt;/head&amp;gt;</code>
<code>&amp;lt;body&amp;gt;</code>
<code><div></code>
<code>&amp;lt;?php include ("tblLandOwners.php"); ?&amp;gt;</code>
<code></div></code>
<code>&amp;lt;/body&amp;gt;</code>
<code>&amp;lt;/html&amp;gt;</code>
[/code]
In my grid.php file I added the following:
[code lang=”php”]
// Set the url from where we obtain the data
$grid-&amp;gt;setUrl(‘tblLandOwners.php’);
// Change some property of the field(s)
$grid-&amp;gt;setColProperty("ContactDate", array("label"=&amp;gt;"Contact Date","editrules"=&amp;gt;array("required"=&amp;gt;true),"datefmt"=&amp;gt;’M jS, Y’,"formatter"=&amp;gt;"date","searchoptions"=&amp;gt;array("sopt"=&amp;gt;array("eq","ne","le","lt","ge","gt")),"formatoptions"=&amp;gt;array("srcformat"=&amp;gt;"Y-m-d H:i:s","newformat"=&amp;gt;"M jS, Y")));
$grid-&amp;gt;setColProperty("ContactNoteID", array("editable"=&amp;gt;false,"hidden"=&amp;gt;true));
$grid-&amp;gt;setColProperty("LandOwnerID", array("label"=&amp;gt;"LandOwner","width"=&amp;gt;"200", "searchoptions"=&amp;gt;array("sopt"=&amp;gt;array(‘cn’,’bw’,’bn’,’nc’)),"editrules"=&amp;gt;array("required"=&amp;gt;true)));
$grid-&amp;gt;setColProperty("ContactNote", array("label"=&amp;gt;"Contact Note","width"=&amp;gt;"200", "searchoptions"=&amp;gt;array("sopt"=&amp;gt;array(‘cn’,’bw’,’bn’,’nc’)),"edittype"=&amp;gt;"textarea", "editoptions"=&amp;gt;array("rows"=&amp;gt;5, "cols"=&amp;gt;80),"editrules"=&amp;gt;array("required"=&amp;gt;true)));
$grid-&amp;gt;setColProperty("ContactMode", array("lable"=&amp;gt;"Contact Mode","editrules"=&amp;gt;array("required"=&amp;gt;true)));
$grid-&amp;gt;setColProperty("ContactedBy", array("label"=&amp;gt;"Contacted By","width"=&amp;gt;"200", "searchoptions"=&amp;gt;array("sopt"=&amp;gt;array(‘cn’,’bw’,’bn’,’nc’)),"editrules"=&amp;gt;array("required"=&amp;gt;true)));
$grid-&amp;gt;setColProperty("NextStep", array("width"=&amp;gt;"200", "searchoptions"=&amp;gt;array("sopt"=&amp;gt;array(‘cn’,’bw’,’bn’,’nc’)),"edittype"=&amp;gt;"textarea","editoptions"=&amp;gt;array("rows"=&amp;gt;5, "cols"=&amp;gt;80)));
$myformat = &amp;lt;&amp;lt;&amp;lt;WR
function MyFormatter(cellValue, options, rowdata){
var cellHtml = ‘<div class="mylongdata">’ + cellValue + ‘</div>’;
return cellHtml;
}
WR;
$grid-&amp;gt;setJSCode($myformat);
$grid-&amp;gt;setColProperty("ContactNote", array(‘formatter’=&amp;gt;’js:MyFormatter’));[/code]
The error is reported in the developer console:
[code lang=”javascript”]
Uncaught ReferenceError: MyFormatter is not defined
at HTMLDocument.&amp;lt;anonymous&amp;gt; ((index):39:6647)
at j (jquery.min.js:2:26860)
at Object.fireWith [as resolveWith] (jquery.min.js:2:27673)
at Function.ready (jquery.min.js:2:29467)
at HTMLDocument.I (jquery.min.js:2:29658)
[/code]
Ken
Hi Will:
Here is my code – most of it is from the Bootstrap 4 demo included in the 5.5.5 package.
Notice that when the page loads, the grid isn’t taking up the full witdth of the div – if you resize the screen to be narrower than the grid, then resize it larger, the grid will then fill the div horizontally.
For the vertical direction, I want the grid to fill the div, but I want the div to be a fixed size based on the viewport size with no scroll bar. The grid itself can have a scrollbar, and the bottom nav should always be visible at the bottom of the div. Actually, it would be great if I could hide the bottom nav and only have the top nav, but I’m not sure that’s possible.
index.php
<?php
require_once ‘../../jq-config.php’;
// include the jqGrid Class
require_once ABSPATH.”php/PHPSuito/jqGrid.php”;
// include the driver class
require_once ABSPATH.”php/PHPSuito/DBdrivers/jqGridPdo.php”;
// Connection to the server
$conn = new PDO(DB_DSN,DB_USER,DB_PASSWORD);
// Tell the db that we use utf-8
$conn->query(“SET NAMES utf8”);
// Create the jqGrid instance
$grid = new jqGridRender($conn);
// Write the SQL Query
$grid->SelectCommand = ‘SELECT OrderID, Freight, OrderDate, ShipCity FROM orders’;
// Set output format to json
$grid->dataType = ‘json’;
// Let the grid create the model
$grid->setColModel();
// Set the url from where we obtain the data
$grid->setUrl(‘grid.php’);
// Set some grid options
$grid->setGridOptions(array(
“rowNum”=>10,
“rowList”=>array(10,20,30),
“sortname”=>”OrderID”
));
// Change some property of the field(s)
$grid->setColProperty(“OrderDate”, array(
“formatter”=>”date”,
“formatoptions”=>array(“srcformat”=>”Y-m-d H:i:s”,”newformat”=>”m/d/Y”),
“search”=>false
)
);
// Enable navigator
$grid->navigator = true;
// Enable excel export
$grid->setNavOptions(‘navigator’, array(“excel”=>false,”add”=>true,”edit”=>true,”del”=>true,”view”=>true));
// add a custom button via the build in callGridMethod
// note the js: before the function
$buttonoptions = array(“#pager”,
array(“caption”=>”Pdf”, “title”=>”Export to Pdf”, “onClickButton”=>”js: function(){
jQuery(‘#grid’).jqGrid(‘excelExport’,{tag:’pdf’, url:’grid.php’});}”
)
);
$grid->callGridMethod(“#grid”, “navButtonAdd”, $buttonoptions);
// Enjoy
$grid->renderGrid(‘#grid’,’#pager’,true, null, null, true,true);
grid.php
<?php
require_once ‘../../jq-config.php’;
// include the jqGrid Class
require_once ABSPATH.”php/PHPSuito/jqGrid.php”;
// include the driver class
require_once ABSPATH.”php/PHPSuito/DBdrivers/jqGridPdo.php”;
// Connection to the server
$conn = new PDO(DB_DSN,DB_USER,DB_PASSWORD);
// Tell the db that we use utf-8
$conn->query(“SET NAMES utf8”);
// Create the jqGrid instance
$grid = new jqGridRender($conn);
// Write the SQL Query
$grid->SelectCommand = ‘SELECT OrderID, Freight, OrderDate, ShipCity FROM orders’;
// Set output format to json
$grid->dataType = ‘json’;
// Let the grid create the model
$grid->setColModel();
// Set the url from where we obtain the data
$grid->setUrl(‘grid.php’);
// Set some grid options
$grid->setGridOptions(array(
“rowNum”=>10,
“rowList”=>array(10,20,30),
“sortname”=>”OrderID”
));
// Change some property of the field(s)
$grid->setColProperty(“OrderDate”, array(
“formatter”=>”date”,
“formatoptions”=>array(“srcformat”=>”Y-m-d H:i:s”,”newformat”=>”m/d/Y”),
“search”=>false
)
);
// Enable navigator
$grid->navigator = true;
// Enable excel export
$grid->setNavOptions(‘navigator’, array(“excel”=>false,”add”=>true,”edit”=>true,”del”=>true,”view”=>true));
// add a custom button via the build in callGridMethod
// note the js: before the function
$buttonoptions = array(“#pager”,
array(“caption”=>”Pdf”, “title”=>”Export to Pdf”, “onClickButton”=>”js: function(){
jQuery(‘#grid’).jqGrid(‘excelExport’,{tag:’pdf’, url:’grid.php’});}”
)
);
$grid->callGridMethod(“#grid”, “navButtonAdd”, $buttonoptions);
// Enjoy
$grid->renderGrid(‘#grid’,’#pager’,true, null, null, true,true);
Thank you Will- That’s exactly what I was looking for.
Ken
Hi Will:
You nailed it – this is exactly what I was looking for – It didn’t occur to me to look through the Searching/Filtering demos – Thank you so much for pointing me in the right direction.
Ken
Thank you for the update Will. I know that keeping documentation up to date is pretty much always the last thing on the list, but, for me at least, it’s one of the most important things and should be a higher priority.
Ken
Will:
Yes, that’s what I’d like to try and accomplish.
For example, in your demo html file, somehow add in a parameter to only pull records from the table where the productID = 8. So when the button is clicked, the grid only shows that row from the table.
Ken
Thanks, Will. That solved my problem.
Ken
Thanks, Will – I’ll give it a try and let you know…
Hello Guriddo? Anyone care to help me out here?
Will:
The fact that the setSelect commands only is excuted once is the problem. In essence that means you can only filter the entire table on only one column at a time. In other words, in my code above, the initial table yeilds around 5,000 rows (no filters appliaed). The user selects an option from the Platform column, the table refreshes with only those platforms that match the selected option. However, the Location drop-down still contains all of the locations, whereas it should only contain those locations that match the selected Platform. And so on…
What I am looking for is a way to filter the table based on all of the setSelects combined, in sequence of them being selected. I am sure it can be accomplished with javascript, I just can’t quite figure out how to do it. All of the examples in the forum for dependent drop-downs are for the editing forms – I want to make the setSelects (or some other javascript based method) dependent on each other simply to filter the table.
Oh ok. Let me try my last post above. This is what I ended up doing to show/hide the export button based on the number of records returned:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
$grid->navigator = true; $setNav =<<<SETNAV function() { var numrecs = $('#grid').jqGrid('getGridParam','records'); if (numrecs < 200000) { $('#pager_excel').show(); } else { $('#pager_excel').hide(); } } SETNAV; $grid->setGridEvent('gridComplete',$setNav); $grid->setNavOptions('navigator',array('add'=>false,'edit'=>false,'del'=>false,'view'=>true,"columns"=>true)); // Run the script $grid->renderGrid('#grid','#pager',true, null, null, true,true); |
Copyright 2014 TriRand LtdAll Rights ReservedRSS
Back to Top