You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by je...@sohu.com on 2009/10/07 11:43:02 UTC
how to get TextField value which belongs to the first tab when
click on the button which belongs to tabbedpanel
There are 3 tabs in a tabbedpanel, a TextField component is in the first tab, and several form components in the other tabs for user input. I added a save button in the tabbedpanel(instead add 3 buttons in each tab, because I just want to save all user inputs by one click), my question is, how to get the TextField value whick is belonged to the first tab when click on the save button.
Html Code:
<div wicket:id="tabs">[tabbed panel will be here]</div>
<form wicket:id="form">
<input wicket:id="buttonsave" type="submit" value="Submit" />
</form>
Java Code:
final List<ITab> tabs = new ArrayList<ITab>();
tabs.add(new AbstractTab(new Model<String>("tab1"))
{
@Override
public Panel getPanel(String panelId)
{
return new TaskCreateTabPanel1(panelId);
}
});
tabs.add(new AbstractTab(new Model<String>("tab2"))
{
@Override
public Panel getPanel(String panelId)
{
return new TaskCreateTabPanel2(panelId);
}
});
tabs.add(new AbstractTab(new Model<String>("tab3"))
{
@Override
public Panel getPanel(String panelId)
{
return new TaskCreateTabPanel3(panelId);
}
});
add(new TabbedPanel("tabs", tabs).add(new AttributeModifier("class", true, this.getDefaultModel())));
Form form = new Form("form") {
protected void onSubmit() {
}
};
Button buttonsave = new Button("buttonsave") {
public void onSubmit()
{
//Here we should get the TextField value and save it into db
}
};
form.add(buttonsave);
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: how to get TextField value which belongs to the first tab when
click on the button which belongs to tabbedpanel
Posted by Michael O'Cleirigh <mi...@rivulet.ca>.
Hi Jerry,
Your implementation isn't working because:
1. tabs have to be contained with in the form to be part of the submission:
<form wicket:id="form">
<div wicket:id="tabs">[tabbed panel will be here]</div>
<input wicket:id="buttonsave" type="submit" value="Submit" />
</form>
2. only the active tab is actually rendered in the browser and only it
will participate in the form submission. So if the fields on each tab
are exclusive then it will work otherwise you will have to take steps to
make sure that the panel contents are submitted /pushed to the server
side when the tab is changed.
One approach I've used for this type of case is a tab panel where the
tabs aren't replaced via an AJAX request but rather the containing div
is set to 'display: none' or 'display: block' as required. Since the
form submission process doesn't care about visibility all the components
on all the tabs will be submitted.
3. Your tab panels need to have an IModel<BusinessObject> model. Each
field in the business object is wired up to the various TextField's you
have and will allow the complete business object to be built and useable
during the form submission process.
Regards,
Mike
> There are 3 tabs in a tabbedpanel, a TextField component is in the first tab, and several form components in the other tabs for user input. I added a save button in the tabbedpanel(instead add 3 buttons in each tab, because I just want to save all user inputs by one click), my question is, how to get the TextField value whick is belonged to the first tab when click on the save button.
>
> Html Code:
> <div wicket:id="tabs">[tabbed panel will be here]</div>
> <form wicket:id="form">
> <input wicket:id="buttonsave" type="submit" value="Submit" />
> </form>
> Java Code:
> final List<ITab> tabs = new ArrayList<ITab>();
> tabs.add(new AbstractTab(new Model<String>("tab1"))
> {
> @Override
> public Panel getPanel(String panelId)
> {
> return new TaskCreateTabPanel1(panelId);
> }
> });
>
> tabs.add(new AbstractTab(new Model<String>("tab2"))
> {
> @Override
> public Panel getPanel(String panelId)
> {
> return new TaskCreateTabPanel2(panelId);
> }
> });
>
> tabs.add(new AbstractTab(new Model<String>("tab3"))
> {
> @Override
> public Panel getPanel(String panelId)
> {
> return new TaskCreateTabPanel3(panelId);
> }
> });
>
> add(new TabbedPanel("tabs", tabs).add(new AttributeModifier("class", true, this.getDefaultModel())));
>
> Form form = new Form("form") {
> protected void onSubmit() {
> }
> };
>
> Button buttonsave = new Button("buttonsave") {
> public void onSubmit()
> {
> //Here we should get the TextField value and save it into db
> }
> };
> form.add(buttonsave);
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: how to get TextField value which belongs to the first tab when
click on the button which belongs to tabbedpanel
Posted by Swanthe Lindgren <sw...@megasol.se>.
jerryws@sohu.com wrote:
> There are 3 tabs in a tabbedpanel, a TextField component is in the first tab, and several form components in the other tabs for user input. I added a save button in the tabbedpanel(instead add 3 buttons in each tab, because I just want to save all user inputs by one click), my question is, how to get the TextField value whick is belonged to the first tab when click on the save button.
>
>
Let all tabs share the same model which you update using
AjaxFormComponentUpdatingBehavior("onchange").
//Swanthe
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: how to get TextField value which belongs to the first tab when
click on the button which belongs to tabbedpanel
Posted by Igor Vaynberg <ig...@gmail.com>.
when dealing with tabs inside a form there are two options you can go with:
a) the easiest is to use javascript tabs and have the entire form on a
single html page. this works best imho.
b) put the tabbed panel into a form, replace tabbed panel's links with
submitlinks so switching tabs submits the form and persists the values
across requests.
-igor
On Wed, Oct 7, 2009 at 2:43 AM, <je...@sohu.com> wrote:
> There are 3 tabs in a tabbedpanel, a TextField component is in the first tab, and several form components in the other tabs for user input. I added a save button in the tabbedpanel(instead add 3 buttons in each tab, because I just want to save all user inputs by one click), my question is, how to get the TextField value whick is belonged to the first tab when click on the save button.
>
> Html Code:
> <div wicket:id="tabs">[tabbed panel will be here]</div>
> <form wicket:id="form">
> <input wicket:id="buttonsave" type="submit" value="Submit" />
> </form>
> Java Code:
> final List<ITab> tabs = new ArrayList<ITab>();
> tabs.add(new AbstractTab(new Model<String>("tab1"))
> {
> @Override
> public Panel getPanel(String panelId)
> {
> return new TaskCreateTabPanel1(panelId);
> }
> });
>
> tabs.add(new AbstractTab(new Model<String>("tab2"))
> {
> @Override
> public Panel getPanel(String panelId)
> {
> return new TaskCreateTabPanel2(panelId);
> }
> });
>
> tabs.add(new AbstractTab(new Model<String>("tab3"))
> {
> @Override
> public Panel getPanel(String panelId)
> {
> return new TaskCreateTabPanel3(panelId);
> }
> });
>
> add(new TabbedPanel("tabs", tabs).add(new AttributeModifier("class", true, this.getDefaultModel())));
>
> Form form = new Form("form") {
> protected void onSubmit() {
> }
> };
>
> Button buttonsave = new Button("buttonsave") {
> public void onSubmit()
> {
> //Here we should get the TextField value and save it into db
> }
> };
> form.add(buttonsave);
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: how to get TextField value which belongs to the first tab when
click on the button which belongs to tabbedpanel
Posted by Pedro Santos <pe...@gmail.com>.
It is up to your object structure, use wicket api to get such object
reference sounds bad
On Wed, Oct 7, 2009 at 6:43 AM, <je...@sohu.com> wrote:
> There are 3 tabs in a tabbedpanel, a TextField component is in the first
> tab, and several form components in the other tabs for user input. I added a
> save button in the tabbedpanel(instead add 3 buttons in each tab, because I
> just want to save all user inputs by one click), my question is, how to get
> the TextField value whick is belonged to the first tab when click on the
> save button.
>
> Html Code:
> <div wicket:id="tabs">[tabbed panel will be here]</div>
> <form wicket:id="form">
> <input wicket:id="buttonsave" type="submit"
> value="Submit" />
> </form>
> Java Code:
> final List<ITab> tabs = new ArrayList<ITab>();
> tabs.add(new AbstractTab(new Model<String>("tab1"))
> {
> @Override
> public Panel getPanel(String panelId)
> {
> return new TaskCreateTabPanel1(panelId);
> }
> });
>
> tabs.add(new AbstractTab(new Model<String>("tab2"))
> {
> @Override
> public Panel getPanel(String panelId)
> {
> return new TaskCreateTabPanel2(panelId);
> }
> });
>
> tabs.add(new AbstractTab(new Model<String>("tab3"))
> {
> @Override
> public Panel getPanel(String panelId)
> {
> return new TaskCreateTabPanel3(panelId);
> }
> });
>
> add(new TabbedPanel("tabs", tabs).add(new
> AttributeModifier("class", true, this.getDefaultModel())));
>
> Form form = new Form("form") {
> protected void onSubmit() {
> }
> };
>
> Button buttonsave = new Button("buttonsave") {
> public void onSubmit()
> {
> //Here we should get the TextField value and
> save it into db
> }
> };
> form.add(buttonsave);
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
--
Pedro Henrique Oliveira dos Santos