Accessing query string/parameter from html page

Question

I have a basic html page which is having a query parameter being passed to the page. I thought I would be able to get the value with Request.QueryString but the more reading I'm doing seems that this is only for asp applications. My html is as follows below

<body>
    <object type="application/pdf" width="100%" height="100%">
        <!--This didn't work-->
        <param name="src" value="<%=Request.QueryString["path"]%>" />
        <!--Neither did this-->
        <!--<param name="src" value="<%=Request.Params["path"]%>" />-->
        <!--When it is hardcoded then my page is displaying the pdf as expected.-->
        <!--<param name="src" value="scan.pdf" />-->
    </object>
</body>

I am calling the page with displayPdf.htm?path=scan.pdf

I've been searching for a way to access query parameters in html without having to write a javascript solution but haven't had any luck. I'm sure adding a js function wouldn't be too big a deal just thought I would avoid it if there was a single line approach.

Thanks for the help.

Rob W · Accepted Answer · 2012-04-06 12:57:15Z

10

This cannot be done in pure HTML.

This can be done in two ways, using JavaScript:

<body><script>
var param = /[&?]path=([^&]+)/.exec(location.search);
param = param ? param[1].replace(/"/g, '&quot;') : '';
document.write('<object type="application/pdf" width="100%" height="100%">\n' +
    '<param name="src" value="' + param + '" />\n</object>');
</script></body>

An alternative method is populating the parameter using DOM (demo: http://jsfiddle.net/N2GUf/2/):

<body><object type="application/pdf" width="100%" height="100%">
    <param name="src" value="" id="param-path" />
</object>
<script>
var param = /[&?]path=([^&]+)/.exec(location.search);
if (param)
    document.getElementById('param-path').value = param[1];
</script></body>

In either case, the query string is read from the location.search property, and parsed using a simple regular expression.

answered Apr 6, 2012 at 12:57

Rob W

350k87 gold badges811 silver badges683 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Jeff Fol Over a year ago

The second style almost works for me but the javascript block is getting called before the object exists. If I could call it after then this solution would certainly work for me. This first did work without any changes though. Thanks alot.

Collectives™ on Stack Overflow

Accessing query string/parameter from html page

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related