What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How to execute my code on "change" event of input type "file"?

    Asked by bellevuefineart on December 10, 2014 at 09:44 AM

    As JotForm's form loads into iframe, I tried below code to execute my code after file selection -

    jQuery( document ).ready( function() {

       // ifram id = 21065362980150

       jQuery("#21065362980150").contents().delegate('.qq-upload-button input:file', 'change', function() {

          // my code

       })

    })

     

    but above code doesn't work, but if I change event from "change" to "click" it works.

    Please help me out to work it.

    Thank you.

    Selection document javascript jquery
  • Profile Image
    JotForm Support

    Answered by Jan on December 10, 2014 at 12:56 PM

    Hi,

    Can you please try changing all "jQuery" to a dollar sign "$"?

    Please share the URL of your website where the form is embedded so we can take a look at it.

    We'll wait for your reply. Thank you.

  • Profile Image

    Answered by bellevuefineart on December 11, 2014 at 01:41 AM

    URL is:

     

    http://dev.bellevuefineart.com/order-uploads/

  • Profile Image
    JotForm Support

    Answered by Charlie on December 11, 2014 at 08:41 AM

    Hi,

    May I know what you do you want to achieve or the action that will be perform when you execute the code?

    You may try using this one.

    $('#cid_5').on('change', '.qq-upload-button input', function() {

    //code here

    });

    I also checked the link you shared and I'm unable to locate the jquery code that you mentioned? 

    I hope this helps. Let us know if you still need more assistance on this.

    Thank you.

  • Profile Image

    Answered by bellevuefineart on December 12, 2014 at 12:58 AM

    Actually I removed that code from page.

    $('#cid_5').on('change', '.qq-upload-button input', function() {

    //code here

    });

    and above code does not work with iframe, because element is in iframe, so I had used

    $("#21065362980150").contents()

    I tried using your code, it didn't work.

    Here I explain what I do want, whenever user selects a file then I want to show preview of that image as well it's resolution and PPI.

     

  • Profile Image
    JotForm Support

    Answered by Charlie on December 12, 2014 at 09:11 AM

    Hi,

    Is the form embedded using iFrame? And you are using the custom javascript code separated from the iFrame? I'm not sure if it will work, because the form is being called from an outside source and the upload feature widget you are using is a custom widget which also calls its function from its own server.

    If you want to apply the javascript code that you have directly, you will need to insert it directly to the Form's full source code, you can find it using this guide How to get Form's full source code.

     

    Or you can also use the default "File Upload" field under "Form Tools" section. 

    You may also want to try this widget, Image Upload Preview Widget, which lets you upload image and preview it.

    I hope this helps. Let us know if you need further assistance on this.

    Thank you.

  • Profile Image

    Answered by bellevuefineart on December 15, 2014 at 06:09 AM

    Better way is to use form's source code directly in my page instead of JS link.

    Thank you very much. :)

  • Profile Image
    JotForm Support

    Answered by Charlie on December 15, 2014 at 08:00 AM

    Hi,

    You're most welcome, glad it worked for you. If you need an assistance again or have any other concerns, please feel free to open up a new thread here in the forum.

    Thank you.