Not able to perform redirection to a URL

I want to redirect to a specific URL onSubmit of a Form. I tried various solutions but nothing worked for me. Can someone please help me with this.

Hi @AnjaliChaudhary ,

To redirect to a specific URL on submit, you’ll need to use a CustomUI navigate method.

Here is an example of the static App.js file with an upload file form.

I’ve installed this app in Confluence and the router.navigate('/wiki'); line navigates to the Confluence home page after the form has been submitted.

import React, { useState } from 'react';
import { router } from '@forge/bridge';

function App() {
  const [selectedFile, setSelectedFile] = useState();
  const [isSelected, setIsSelected] = useState(false);

  const changeHandler = (event) => {
		setSelectedFile(event.target.files[0]);
		setIsSelected(true);

        console.log(`changeHandler`);  
  };

  // Handles form submission, which is a good place to call APIs, or to set component state...
  const handleSubmission = () => {
    console.log(`handleSubmission`);

    router.navigate('/wiki');
  }


  
  return (
    <div>
      <input type="file" name="file" onChange={changeHandler} />
      {isSelected ? (
				<div>
					<p>Filename: {selectedFile.name}</p>
					<p>Filetype: {selectedFile.type}</p>
					<p>Size in bytes2: {selectedFile.size}</p>
					<p>
						lastModifiedDate:{' '}
						{selectedFile.lastModifiedDate.toLocaleDateString()}
					</p>
				</div>
			) : (
				<p>Select a file to show details</p>
			)}
			<div>
				<button onClick={handleSubmission}>Submit</button>
			</div>
    </div>
  );
}

export default App;

There is a tutorial here for getting started with a Custom UI app in Forge.

Cheers,
Caterina

Namaste @ccurti how can I achieve this in UI Kit? Struggling to get this working for two days.

I used @forge/bridge but getting “window is not defined” error.

Thanks.

Hi @VigneshKS,
This only works in a Custom UI app.
It is not possible to add this functionality to a UI Kit app.

Caterina

1 Like

Thanks @ccurti.