nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

How to close fixed window (splash screen) from a custom widget

LuisAntonioRodriguezGonzalez

Hi,

I've developed a Experience Builder Widget, that has a "Iniciar sesión" button. I've added this Widget in a fixed window (splash screen) and when I click in the "Iniciar sesión" button, I want to close the window.

Regards,

Trouver plus de publications taguées avec

ArcGIS Enterprise

Accepted answers

Anonymous User

If this fixed window is actually a page, see the code/button I posted here:

https://community.esri.com/t5/arcgis-experience-builder-questions/how-to-open-a-specific-page-with-a-button/m-p/1095329/thread-id/2726#M2728

You wouldn't actually "close" anything. You just have the button call the other page.

All comments

LuisAntonioRodriguezGonzalez

Hi @DaveFullerton the splash screen is actually a page.

DaveFullerton

@LuisAntonioRodriguezGonzalez are you using your custom widget in a fixed window that is set as the splash screen? Or is it as @Anonymous User was referring to that the splash screen is actually a page? I am having trouble getting my custom widget to close the fixed window but only when it is set as the splash screen.

LuisAntonioRodriguezGonzalez

This is my code based on the KevinHibma answer:

export default function Widget(props: AllWidgetProps<IMConfig> & ExtraProps) {
  let linkCloseRef: HTMLButtonElement;

	. . .

  const getLinkComponent = () => {
    let linkTo: LinkTo;
    linkTo = {
        linkType: LinkType.Page,
        value: "current_page" 
    } as LinkResult;
    let queryObject = props.queryObject;

    return (
      <Link ref={ref => (linkCloseRef = ref)} to={linkTo} target="_self" queryObject={queryObject}
        className="linkClose"
      >
      </Link>
    );
  }

  const onIniciarSesion = e => {
    const usuario = getUsuario();
    const password = getPassword();

    if (usuario === null || usuario === '' || password === null || password === '') {
      setMensajes(`${getI18nMessage('introducirUsuarioPassword')}`);
    }
    else {
      const url = `${props.config.wsl}/Login.ashx`;
      esriRequest(url, {
          query: {
            u: usuario,
            p: password
          },
          responseType: "json"
      }).then(response => {
        let geoJson = response.data;
        if (response.data.cr === 1) {
          if (response.data.np === 1) {
                . . .
          }
          else {
                . . .
          }

          linkCloseRef.click();
        }
        else {
          setMensajes(`${getI18nMessage('errorUsuarioPassword')}`);
        }
      }).catch((error) => {
          console.error(error);
      });
    }  
  }

  const LinkComponent = getLinkComponent();

  return (
      <div className="jimu-widget-acceso-filtrado">
        {LinkComponent}

        <div className="overlay"></div>
        <div className="envelope buried">
        <div className="contenedor">
          <table className="acceso-filtrado-table" cellSpacing={5}>
          <tbody>
				. . .
            <td colSpan={2}>
              <div className="acceso-filtrado-btn" onClick={onIniciarSesion}>
                <FormattedMessage id="iniciarSesion" defaultMessage={defaultI18nMessages.iniciarSesion}></FormattedMessage>
              </div>
            </td>
            </tr>
          </tbody>
          </table>
          
        </div>
        </div>
      </div>
  );
}

Anonymous User

If this fixed window is actually a page, see the code/button I posted here:

https://community.esri.com/t5/arcgis-experience-builder-questions/how-to-open-a-specific-page-with-a-button/m-p/1095329/thread-id/2726#M2728

You wouldn't actually "close" anything. You just have the button call the other page.

LuisAntonioRodriguezGonzalez

Thanks, but this solution is not suitable for me, because I,ve developed a custom buttom in my custom widget.

The custom buttom has to do some actions before close the splash screen.

Boyang_Wang

Hi,

If your main page is called Page 1, just do the following:

1. Click on the button in the edit mode

2. Select "Set link" in the right column

3. Set link to Page, Page 1, App window, like this:

Rejoindre la conversation

Les membres connectés peuvent publier, suivre les mises à jour, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.

Liens rapides

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.