Using link in DynamicForm

[dvshestakov]

Hi all,

I didn't find any clean solution with the help of SmartGWT library, how to use link like LinkItem in DynamicForm.
If you need to open some Window or do something else in current screen of application through <a href='#' onclick='onLinkClick();'>Link</a> link without open new browser window, you can use this code for example. The originally idea taken from gwt-ext forum.
If you know another good idea how to make it, any help will be appreciated.

package com.smartgwt.sample.showcase.client.search;

import com.smartgwt.client.types.TitleOrientation;
import com.smartgwt.client.util.BooleanCallback;
import com.smartgwt.client.util.SC;
import com.smartgwt.client.widgets.form.DynamicForm;
import com.smartgwt.client.widgets.form.fields.StaticTextItem;
import com.smartgwt.client.widgets.form.fields.TextItem;

public class SimpleSearchForm extends DynamicForm
{
public SimpleSearchForm()
{
initializeControls();
publishJs();
}

private void initializeControls()
{
final DynamicForm form = this;
form.setAutoFocus(true);
form.setNumCols(2);
form.setWidth(300);
form.setTitleOrientation(TitleOrientation.TOP);

TextItem firstName = new TextItem("fName");
firstName.setTitle("First name");
firstName.setSelectOnFocus(true);
firstName.setWrapTitle(false);

TextItem lastName = new TextItem("lName");
lastName.setTitle("Last name");
lastName.setWrapTitle(false);

StaticTextItem label = new StaticTextItem();
label.setShowTitle(false);
label.setHint("<a href='#' onclick='onLinkClick();'>Link</a>");

form.setFields(firstName, lastName, label);

form.draw();
}


private static void onLinkClick()
{
SC.confirm("Hello", new BooleanCallback()
{
public void execute(Boolean value)
{
//...
}
});
}

// Set up the JS-callable signature as a global JS function.
private native void publishJs() /*-{
$wnd.onPickDescriptionClick = @com.smartgwt.sample.showcase.client.search.SimpleSearchForm::onLinkClick();
}-*/;
}

[shortpasta]

From the javadocs for LinkItem (http://www.smartclient.com/smartgwt/javadoc/):

setTarget

public void setTarget(java.lang.String target)
By default, clicking a link rendered by this item opens it in a new browser window. You can alter this behavior by setting this property. The value of this property will be passed as the value to the target attribute of the anchor tag used to render the link.
If you set linkItem.target to "javascript", the default behaviour is to catch and consume mouse-clicks that would result in the link being followed. Instead, the FormItem.addClickHandler(com.smartgwt.client.widgets.form.fields.events.ClickHandler) event is fired.

Parameters:
target - target Default value is "_blank"

So I tried something like this with SmartGwt 1.3 and I get the behavior you and I expect: the any display changes occur within the same browser.

final LinkItem item = new LinkItem ();
item.setTitle ("My Link");
item.setTarget ("javascript");
item.addClickHandler (new ClickHandler () {
  public void onClick (final ClickEvent clickEvent) {

    SC.say ("YO!");
  }
});

Note, however, that if the code block within onClick () throws an exception, I do get a second browser open.

[dariusv]

As I understand this is in java. How can I do this in typescript? I see in TS the items are like

<DynamicForm dataSource={InvoiceDataSource.sc()} useAllDataSourceFields={false}>
<FormFieldItem name="#invoiceNo"/>


<LinkItem>test</LinkItem>

but I added
<LinkItem>test</LinkItem>

and it says

Cannot find name 'LinkItem'.

[Isomorphic]

Can you clarify where and how you're attempting to run the code snippet you provided? Have you modified one of the React samples from our Showcase in the SmartClient 13.1 (pre-release) branch? Are you editing your code in VS Code or something else? Can you provide the complete file, including imports, rather than just a snippet?