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

    I need to embed a form on a mobile site.

    Asked by hsfsf on October 26, 2013 at 09:22 PM

    What is the best code to use sinze resizing is not autimation on the forms? as of now, I'm using the iFrame code but the next and back buttons are not reliable... 

     

    Also I need to be able to block people from choosing specific dates on the date field, how can I do that? i,e., entering any date that is a sunday is not allowed....

     

    Thanks,

     

    Lorena

    Page URL:
    http://www.homesweetflowers.com/#!cart/c12kx

    Screenshot
    Mobile site mobile site embed a form date field responsive grid
  • Profile Image

    Answered by jedcadorna on October 26, 2013 at 10:11 PM

    @hsfsf

    Jotform is mobile friendly so it should be compatible with any of mobile devices. I can see that the form next button is slighty align to the right. Please apply this custom CSS to adjust the alignment of the next button. I have tested it using an Iphone emulator and looks fine now.

     

    #form-pagebreak-back_27 {

    display:none;

    }#form-pagebreak-next_27{

    position: absolute;

    left: 60px;

    top: 361px;

    width:130px !important;

    height:40px !important;

    }

     

    I hope this helps. 

    Thanks,

  • Profile Image

    Answered by jedcadorna on October 26, 2013 at 10:38 PM

    @hsfsf,

    I made a modification to the CSS script please use this instead. I have tested it using an Iphone emulator and Android phone and table. I hope this fits now with other devices. Rendering to some other browser's devices may not look the same but overall it should look fine.

     

    @media screen and (orientation: landscape) { html, body { width: 100%; } .content h1.landscape { display: block } .content h1.portrait { display: none } } 

    @media screen and (orientation: portrait) { html, body { width: 100%; } .content .landscape { display: none } .content .portrait { display: block } }

    #form-pagebreak-next_27{position: absolute;left: 60px;top: 361px;width:130px !important;height:40px !important;}

    #form-pagebreak-back_27{position: absolute;left: 85px;top: 544px;width:130px !important;height:40px !important;}

     

    Let us know if you have questions.

    Thanks,