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

    HELP! Google map gone from form!

    Asked by COREVI on September 29, 2013 at 05:41 PM

    I got a few complaint emails today stating that the Map for the GPS Location wasn't working on my form today. I checked it out and the form is just showing a big green square, and on the mobile version the form doesn't show up at all. I recopied the source code into my website and that didn't change anything, so I went in to edit the form and when I hit Edit HTML there is no html, just a green background and the words map. WHERE IS MY MAP?!?!?!

    http://www.corevi.org/submit.html is the link where the form is live. PLEASE help me this is hugely important for my non-profit, it's how we collect all of our data.

    Page URL:
    http://www.corevi.org/submit.html

    Screenshot
    map Emails source Mobile non-profit
  • Profile Image

    Answered by jedcadorna on September 29, 2013 at 06:47 PM

    Hi,

    We are really sorry to hear that. I can see that the map is just a big green box. Can you send us the google map iFrame code so we can pinpoint where the problem is. You mention that you have tried to re-embed the map code but the HTML doesn't accept it, right?

    I will wait for your response.

    Thanks,

  • Profile Image

    Answered by COREVI on September 29, 2013 at 06:56 PM

     

    <div>Mark your DIVE LOCATION on the map!

    <div id="googleMap" style="width: 100%; height: 527px; background: #5A8E4A;">Map</div>

    </div>

    Here is the code that is in the map spot. I have not touched this since I first set up the form, nothing has changed. What I tried to re-embed was the entire form into my website. This coding does not look right to me, but like I said I haven't done any editing to the form so I don't know how it has changed. I no longer have the original code that your support helped me build so I can't copy that back in.

     

    Thanks, 

    Kitty

     

  • Profile Image

    Answered by jedcadorna on September 29, 2013 at 07:02 PM

    Hi Kitty,

    Do you happen to know the iframe code of the map with coordinates? I think I found the problem and will just have to make sure before submitting a ticket to our developers. The sample iframe code would be like the code below.

    <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com.ph/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=USA&amp;aq=&amp;sll=40.212441,80.727539&amp;sspn=27.304594,24.741211&amp;ie=UTF8&amp;hq=&amp;hnear=United+States&amp;ll=37.09024,-95.712891&amp;spn=50.659159,49.482422&amp;t=m&amp;z=4&amp;output=embed"></iframe><br /><small><a target="_blank" href="https://maps.google.com.ph/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=USA&amp;aq=&amp;sll=40.212441,80.727539&amp;sspn=27.304594,24.741211&amp;ie=UTF8&amp;hq=&amp;hnear=United+States&amp;ll=37.09024,-95.712891&amp;spn=50.659159,49.482422&amp;t=m&amp;z=4" rel="nofollow" style="color:#0000FF;text-align:left">View Larger Map</a></small>

     

    Thanks,

  • Profile Image

    Answered by COREVI on September 29, 2013 at 07:05 PM
    I remember having code like that on the form when it was created, but it's not there anymore. I don't know how it could have disappeared, but what I copied and pasted is the only code pertaining to the map. It has been working perfectly for months, not sure lbs this change could have happened.
  • Profile Image

    Answered by jedcadorna on September 29, 2013 at 07:06 PM

    In addition to what I have mention above. You can get the iframe code by going to google map. Please see the picture below.

  • Profile Image

    Answered by COREVI on September 29, 2013 at 07:49 PM

    <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/?ie=UTF8&amp;ll=18.033586,-64.712219&amp;spn=0.769125,1.447449&amp;t=h&amp;z=10&amp;output=embed"></iframe><br /><small><a target="_blank" href="https://maps.google.com/?ie=UTF8&amp;ll=18.033586,-64.712219&amp;spn=0.769125,1.447449&amp;t=h&amp;z=10&amp;source=embed" rel="nofollow" style="color:#0000FF;text-align:left">View Larger Map</a></small>

    That is copied from google maps website zoomed into my region.

  • Profile Image
    JotForm Support

    Answered by Welvin on September 29, 2013 at 11:01 PM

    I've check your HTML Page and found missing needed codes for the map. May I know your location or your preferred default location on the map? I'm fixing your codes. You can get the working output here: http://pastebin.com/2CtyCvbW

     

    Thanks

     

  • Profile Image

    Answered by COREVI on September 30, 2013 at 08:22 AM

    The location is the US Virgin Islands, I thought that was the iframe I copied above, but I set up the form so long ago I really can't remember all of the steps I went though. Please let me know what I need to do next.

     

    Thanks, Kitty

  • Profile Image
    JotForm Support

    Answered by Welvin on September 30, 2013 at 11:39 AM

    Hi Kitty,

    Here's the updated codes. Just please copy it from here: http://pastebin.com/2CtyCvbW. Remove the current modified source codes into your website HTML page and replace this one.

    Here's a screenshot of the map:

    Thanks

  • Profile Image

    Answered by COREVI on March 31, 2014 at 08:56 AM

    Alright, I've done it again. Same thing as last time. I made some changes to my form, tried to update the code on my own by replacing the code for the form in my website editor, and once again I have the big green box.

    I looked over the responses above and I can't figure out what you did to fix it, so with the new source code from my form can we make it work again PLEASE?!?! :)

  • Profile Image

    Answered by COREVI on March 31, 2014 at 09:15 AM

    Also, since I can't seem to make changes without ruining my form, could somebody please tell me where I paste the new code when I make changes so I don't have to go through this every time?

    Gah! So frustrating :(

  • Profile Image
    JotForm Support

    Answered by Welvin on March 31, 2014 at 11:03 AM

    How about that instead of the workaround, use any of the following mapping widgets: http://widgets.jotform.com/category/mapping. Can you please check?

    I vote for Address Map Locator: http://widgets.jotform.com/widget/address_map_locator

    Thanks

  • Profile Image

    Answered by COREVI on March 31, 2014 at 12:48 PM

    That will not work because the user is marking locations where fish were removed from the ocean, so they have to click to mark the spot and it will ALWAYS be in the ocean, so never an address.

    The map was created by you guys, and it has been working excellently, I just made some changes to my form and don't know how to update it to include the map.

  • Profile Image
    JotForm Support

    Answered by EltonCris on March 31, 2014 at 01:26 PM

    @COREVI

    There is a missing ID attribute on the div code where the google map should appear.

    Please find id_25 on your form source code, under it you will see your google map div code and then insert this id="googleMap"

    Check this image for a guide:

    Thanks!

  • Profile Image

    Answered by COREVI on March 31, 2014 at 01:37 PM

    I made that change and republished the page however I'm still getting the blank box. Any other suggestions?

  • Profile Image
    JotForm Support

    Answered by EltonCris on March 31, 2014 at 02:11 PM

    @COREVI 

    It seems there's a problem with the quotes. Can you manually type the quotes between googleMap? They appears different when I check your page source.

    You might have copied and pasted it there so it appears different, type it with your keyboard, that should fixed it.

    Regards!

  • Profile Image

    Answered by COREVI on March 31, 2014 at 02:24 PM

    That is the most ridiculous thing ever but IT WORKED!!!!

    Thank you so much, I am continually amazed at the support I get from you guys! (Even though I keep breaking my form... lol)

  • Profile Image
    JotForm Support

    Answered by TitusN on June 02, 2014 at 12:56 PM

    Hello,

    We have developed a widget to display a map right on your form - Show Map Location

    Please try it out and share your experience, and whether there is anything we can do to make it better.

    Thanks