in the documentation example for LABKEY.ext.formPanel it shows adding a submit button like this:
var form = new LABKEY.ext.FormPanel(
{
selectRowsResults:data,
addAllFields:true,
buttons:["submit"]
//items:[{name:'myField', fieldLabel:'My Field', helpPopup:{title:'help', html:'read the manual'}}]
});
form.render('formDiv');
This makes a form, but doesnt actually make a submit button (it just makes text). I dont see anything in the code that would cause the string 'submit' to make a button. In the other uses of .ext.formPanel in labkey (and ext doc), buttons are added more like:
buttons:[{text:'Submit', handler:SubmitButton_onClick}],
That's what i would have expected - and that does work. Is there something I'm not seeing? |
| |
| kevink responded: |
2010-07-09 11:48 |
You're correct. You need to provide a handler for the submit button. I will update the docs with a better example. |
| |
| Ben Bimber responded: |
2010-07-09 12:15 |
ok, not a big deal. i have a few other questions just to make sure i'm understanding the big picture of LABKEY.ext.FormPanel:
1. It's primarily designed to assist with the creation of the web form itself. It helps interpret labkey metadata to create the proper Ext components. It will assist with displaying error messages.
2. It does not do anything special to help submit the data. It will inherit from Ext.form.FormPanel though. If I'm going to try to use this to build EHR data entry forms (data submitted into one or more datasets), I would probably just add my own onSubmit handler.
3. Is does not seem to do anything to provide warnings if you try to have entered data, but try to navigate away (i think this is called setDirty() in LABKEY.form). Am I missing that? Does it inherit something from ext?
Thanks. |
| |
| kevink responded: |
2010-07-09 13:22 |
1. Yes, LABKEY.ext.FormPanel will help you by building the form items using the select rows metadata.
2. It doesn't do anything special to subit the form. I haven't used Ext's FormPanel much, but you may be able to use Ext.form.action.Submit.
3. It looks like LABKEY.Form does the dirty checking for you, but LABKEY.ext.FormPanel does not. I don't know if this is be design or just an oversight.
I haven't tried this, but it looks like you should be able to create a LABKEY.Form over the form of the LABKEY.ext.FormPanel. Something like:
var lkform = new LABKEY.Form({ formElement: myFormPanel.getForm() });
If that doesn't work, you can install a window.onbeforeunload handler to check form.isDirty() before nvaigating away. You can do this yourself or use the LABKEY.beforeunload helper function. The LABKEY.beforeunload helper takes a callback where you can add your own dirty check:
window.onbeforeunload = LABKEY.beforeunload(function () {
return myForm.isDirty();
});
The form's isDirty() method is true when any of the fields have been changed from their original values. |
| |
|
|