Form download

Hi team,

thanks for doing the amazing work.

I am trying to integrate a functionality where (if) someone hit the form submit/download button, it immediately triggers the file download by using the "action" call in the form.

on every page, there'll be a different file. So, the same file for 1000 pages will not work as every page has a different file/pdf and that is where I am struggling. Can you guys help me out with this?

Which javascript or function do I have to put in Element >> all post so that if someone hit the download/submit button, it just start downloading the file.

After 4-5 days of intense searching, I found this code but looks like it is not working. Whenever i hit download, it just refresh the page and nothing else.

IN POST:

<form method="post">
        <div class="form-item form-type-textfield form-item-email-id form-group">
            <input placeholder="please enter email address" class="custom-email-field form-control" type="text" id="edit-email-id" name="email_id" value="" size="60" maxlength="128" required />
        </div>
        <button type="submit" class="submitclass btn btn-danger" pdf_url="https://file-examples-com.github.io/uploads/2017/10/file-sample_150kB.pdf">Submit</button>
</form>

IN ELEMENT:

<script>(function ($) {
    $(document).ready(function(){
       function validateEmail(email) {
            const re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
            return re.test(email);
           }
       
       if($('.submitclass').length){
            $('.submitclass').click(function(){
                $email_id = $('.custom-email-field').val();
                if (validateEmail($email_id)) {
                  var url= $(this).attr('pdf_url');
                  var link = document.createElement('a');
                  link.href = url;
                  link.download = url.split("/").pop();
                  link.dispatchEvent(new MouseEvent('click'));
                }
            });
       }
    });
}(jQuery));</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

I am not familiar with javascript so I don't know what changes need to be done.