0

I am attempting to add a form to an existing html that allows the user to type in a search term and query and existing ArcGIS Online map. For example, a person would enter a coordinate into the form such as:

submitCapture.PNG

The resulting url should be (unencoded) : www.arcgis.com/apps/webappviewer/index.html?find=-112.111 33.3456

encoded it should look like: www.arcgis.com/apps/webappviewer/index.html?find=-112.111%2033.3456

The problem is that because the parameter (find) is after the "?" the whitespace in the url is encoded with a "+" instead of "%20". The url becomes: www.arcgis.com/apps/webappviewer/index.html?find=-112.111+33.3456

This causes the feature search to search for : SeachCapture.PNG which results in not finding the coordinate.

My question is how can I get a html form to pass the search query either unencoded, or having the whitespace encoded as "%20" instead of "+"? I am using the "get" method and have tried having a javascript function replace the whitespace with "%20", but the % symbol gets encoded.

2 Answers 2

2

Here is the final code which works.

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"> 
function getURL(val){ 
  base = 'http://www.arcgis.com/apps/webappviewer/index.html?find='; 
  uri=base +val;
  //location2 = encodeURI(uri); 
  window.open(uri);    
} 
</script> 

1
1

If I understand correctly you have a form in your HTML page wichs method is GET and when you submit the form you get your url not encoded correctly. If you don't provide code we can't see what could be the causes to your specific problem. But there's no need to let the form make the request. You can listen to the form submit event (If you're using jquery it would look like below)

$('.yourForm').submit(function(e){
  e.preventDefault(); // This prevent the form of being submit
  window.location.replace(url_base + $('.yourInputText').val());
});

Use window.location.replace() or window.open()

2
  • Thank you for your input. The following code somehow includes the file path to the html in the url passed to window.open. <!DOCTYPE html> <html> <head> <script type="text/javascript"> function getURL(val){ base = 'www.arcgis.com/apps/webappviewer/index.html?find='; uri=base +val; //location2 = encodeURI(uri); window.open(uri); } </script> </head> <body> <form id="form1" name="form1" method="get" onsubmit="getURL(form1.find.value)" > <label> <input type="text" name="find" /> </label> <label> <input type="submit" /> </label> </form> </body> </html>
    – JRam
    Commented Apr 21, 2016 at 19:12
  • @Robert Scheitlin figured out my problem. The code just needed to have base='arcgis.com/apps/webappviewer/index.html?find=' instead of base='www.arcgis.com/apps/webappviewer/index.html?find='
    – JRam
    Commented Apr 21, 2016 at 20:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.