CODEWITHSUNDEEP
jqueryasp.net-mvc-5
Niranjan Godbole
Niranjan Godbole

Reputation: 2175

How to pass parameter to partial view on clicking Link?

Hi I am developing MVC5 application. I have one partial view and it is basically popup. I am calling on click of link button as below.

window.open("/UploadDocument/ScannerUpload", "popupWindow", "width=1000,height=900,scrollbars=yes");

Below is my ScannerUpload.cshtml file.

<html>
<head>
    <script type="text/javascript">
        {
            function getParameterByName(name, url) {
                if (!url) url = window.location.href;
                name = name.replace(/[\[\]]/g, "\\$&");
                var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
                    results = regex.exec(url);
                if (!results) return null;
                if (!results[2]) return '';
                return decodeURIComponent(results[2].replace(/\+/g, " "));
            }
            var foo = getParameterByName('Param1');
        }
    </script>
    <meta name="viewport" content="width=device-width" />
    <meta http-equiv="X-UA-Compatible" content="IE=8" />  
    <title>ScannerView</title>
</head>
<body>
    <div>
        <iframe src="http://Scanner.aufytech.com/C3CKYC Scanner.xbap?" width="1000" height="600" scrolling="auto"></iframe>      
    </div>
</body>
</html>

I want to send some params to ScannerUpload.cshtml file. May i know is there any way i can append params to ScannerUpload.cshtml? Any help would be appreciated. Thank you.

Upvotes: 0

Views: 841

Answers (1)

Nick.Mc
Nick.Mc

Reputation: 19184

So, first thing you need to do is work out how to pass the parameters in your first call. So this:

window.open("/UploadDocument/ScannerUpload", "popupWindow", 
"width=1000,height=900,scrollbars=yes");

Needs to become this:

window.open("/UploadDocument/ScannerUpload?Param1=A&Param2=B", "popupWindow", 
"width=1000,height=900,scrollbars=yes");

How you do it is up to you, as I don't know where these parameters come from. If they are from fields on a html page, you need to use javascript events to dynamically update your window.open.

Now you need to pick up those parameters in the second window. In retrospect, I realise we don't need to parse out the parameters we can just grab the end of the URL

So referring heavily to these: dynamically set iframe src iFrame onload JavaScript event

Something like this might work (untested sorry):

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <meta http-equiv="X-UA-Compatible" content="IE=8" />  
    <title>ScannerView</title>
</head>
<body>
    <div>
        <iframe id="myIframe" src="" width="1000" height="600" scrolling="auto" onLoad="fUpdateiFrame();"></iframe>      
    </div>

    <script type="text/javascript">
            function fUpdateiFrame() {
                if (!url) url = window.location.href;
                document.getElementById('myIframe').src = "http://Scanner.aufytech.com/C3CKYC Scanner.xbap?" + url.split("?")[1];
            }
    </script>

</body>
</html>

Changes made:

  1. Add an ID to the iframe element so we can refer to it in javascript
  2. Add an event to the iframe element so that it calls a javascript function when its ready
  3. Add some javascript that chops out the query parameters (everything after the ?) and adds that to the URL, before setting the new iframe src value

I'd be suprised if this works first time - please post back any issues.

Upvotes: 1

Related Questions