Sample | Create/upload DAM assets from Adaptive forms

Avatar

Avatar

Mayank_Gandhi

Avatar

Mayank_Gandhi

Mayank_Gandhi

08-04-2021

Hello Community,

 

It has been a while that I posted something here.

 

A lot of people want to leverage form with DAM assets. Simple example, you have an adaptive form and you want user to upload the image but instead of saving it in some other system you want to leverage DAM assets.

 

Two main things for such use case:

  •  DAM has a very exhaustive set of HTTP API that can help you create folders and assets.
  •  Form fields have a lot of events on which you can trigger the HTTP API and POST the form data to DAM.

 

Sample:

 

Create a simple html widget for file upload.

 

<p>Image</p>
<p><input id="default_file" type="file" name="logo">&nbsp;<button id="clear">clear</button></p>

 

Create JS to handle file upload and ingest the payload to DAM API.

 

$('#default_file').change(function(){
//on change event
formdata = new FormData();
if($(this).prop('files').length > 0)
{
file =$(this).prop('files')[0];
formdata.append("file", file);
formdata.append("name", "yourLogoName.jpeg");
}

jQuery.ajax({
url: "http://localhost:4502/api/assets/test/*",
type: "POST",
data: formdata,
processData: false,
contentType: false,
success: function (result) {
alert("all is well");
},error: function(){alert("some err occurred");}
});

});

 

Thanks,

Mayank Gandhi

Connect with me over LinkedIn

 

 

 

 

Adaptive Forms DAM Assets

Replies

Avatar

Avatar

kautuk_sahni

Community Manager

Total Posts

6.0K

Likes

1.1K

Correct Reply

1.1K

Avatar

kautuk_sahni

Community Manager

Total Posts

6.0K

Likes

1.1K

Correct Reply

1.1K
kautuk_sahni
Community Manager

Apr 11, 2021

@Mayank_Gandhi Thank you for sharing this with AEM community. And Good to see you back. Encourage your peers to also contribute to the AEM Community.