I would like to add a checkbox column to a sql.
Here is my query
SELECT CITYID, TRIM(L)+[ ]+TRIM(F), PHONE, ; FROM g:\dir\DBFS\table ; WHERE SITE=thissite AND ENROLLED#{}; INTO CURSOR TQuery
lcHtml = HtmlDataGrid("TQUery")
Response.Write(lcHtml)
How do I add it?
TIA
Checkboxes in grids are not really easy to handle for a number of reasons.
Rendering
First HtmlDataGrid()
isn't natively to create extra HTML markup. It's possible to do but it's not automatic - you have to generate the checkbox HTML yourself as part of an expression in the column. You can do that by calling an expression in the column that you want to render (using explicit columns rather than the generic version you have - see docs). That function can then render the markup for the checkbox and the checked state.
For more info on how to do this see: http://west-wind.com/webconnection/docs/_37x04bemx.htm
Notice the use UDF() functions as expressions - you use a custom expression or perhaps even.
For example, I added this to the Paged Albums sample in wwDemo.prg
:
loConfig.AddColumn("HtmlCheckBox([chkIsActive_] + TRANSFORM(Pk) ,[],Year > 2000)","Recently Produced")
which produces:
Capturing
Rendering is one thing, but capturing the check is quite another. You need to either a) use ajax to immediately update the change of the checked state (ie. make a call to the server update the value in real time) or b) post all the check box values to the server.
The latter reqiures that you generate unique ids for each checkbox (ie. chkIsActive_01, chkIsActive_02 etc.) and then read through all the checkbox values on the postback to determine if the value has changed or just update the value in all of those displayed.
Personally for those scenarios I prefer option a) of making an AJAX call to the server as the check is made which is much easier to manage.
I created a new help topic that describes the options available here:
http://west-wind.com/webconnection/docs/_4n50v053v.htm
+++ Rick ---
Thank you so much. This is just what I needed.
I guess this is what is used to alternate between blue and white in the grid?
Response.HTMLHeader("HtmlDataGrid Example",,BACKIMG)
I receive a message "Variable Backimg not found".
Kindly advise.
Thanks
Not sure what you mean. What is BACKIMG
supposed to be?
The striped text comes CSS styling via .table-striped
which is enabled by default.
+++ Rick ---
In the link you provided that contains "FUNCTION HtmlDataGrid" (http://west-wind.com/webconnection/docs/_37x04bemx.htm), there is a line of code that says:
Response.HTMLHeader("HtmlDataGrid Example",,BACKIMG)
The code from that function works aside from that line of code, in which I get an error "Variable Backimg does not exist".
Pardon my ignorance, but how do I insert ".table-striped"
I was able to put a border around the grid by:
TEXT TO lcHtml NOSHOW
<style>
table, th, td {
border: 1px solid black;
}
</style>
But I don't know how to make it striped.
Thanks for your help.
The image is of older styling - I guess it should be updated.
If you're using Web Connection 6.0 the data grid will look very different. Like this:
http://west-wind.com/wconnect/ShowAlbums.wwd
BACKIMG
in this case is an application specific variable - irrelevant to the actual code.
The alternating background is determined by CSS styling. In Web Connection 6.0 it'll be the table-striped
style. In older versions this is controled with loGridConfig.AlternateColumns = .t.
.
+++ Rick ---
If I have the following line of code:
Response.Write(this.PageHeaderTemplate("Customer List"))
in the function then the following line of code:
loConfig.CssClass = "table table-striped small"
works.
If I don't have the pageheadertemplate, then the stripe command does not work.
Please advise.
Also, is there a way to control the color of the stripe?
TIA
You have to add the CSS stylesheet to the page.
The styling uses standard BootStrap styling. You can override the styling via CSS tags.
I'm not sure offhand what the styling would require to change the color. The F12 browser tools are really good for this sort of thing to find the right styling to apply and see it change in real time.
+++ Rick ---
Great. Thanks.
Hello Rick,
My apologies to bring this up after years but I'd like to confirm this before going further.
I'm trying to enhance some grids in Foxpro and I've been using the wwHtmlHelpers and HtmlDataGrid without the server side support, I'm using wwScripting and they've been working nicely as always.
I need to capture checkbox click events and individually and for this I'm using their own OnClick event (with a twist of TEXTMERGE()), it looks like to be working fine in my case but would you please let me know about pros and cons compare to the other approaches and as always I'd appreciate any better suggestion.
It's something like this for now:
oGridConfig = CREATEOBJECT("HtmlDataGridConfig")
...
cCheckAllAttribute = [class='with-font checkbox-activestate' onClick="location.replace('myfox:checkAll')"] && For the column header
cCheckboxAttribute = [class='with-font checkbox-activestate' onClick="location.replace('myfox:Checked?PK=<<act_pk>>')"] && For individual checkboxes
oCol = oGridConfig.AddColumn("HtmlCheckBox('checkBox_' + TRANSFORM(&checkboxId),[],lSelected,TEXTMERGE(cCheckboxAttribute))",HtmlCheckBox('checkAll',[],.F.,cCheckAllAttribute))
...
Thanks,
Kathy