Search code examples
jqueryhtmljquery-load

jquery load() problems getting parameters when using div

I am not a html, jquery or javascript specialist and I am having problems trying to retrieve parameters passed into a sub html page via jquery .load() I was hoping someone could help me.

A bit of background first: My main html page index.html, has has a div with an ID of PageContent. On click of a menu item in the main page, the main page loads any other html pages into this div as a child page of the main page.

In my html I have

<div id="PageContent"></div>

In the main page javascript file when some one select a menu item as follows

onclick=''callPage(document.getElementById("subPage1").href, 
            "{user:'" + ipUserId + "'}");''

We call the following code

function callPage(stPageLink, stPageParams) {
    $("#PageContent").load(stPageLink, stPageParams);
    ...
}

In subpage1.html I want to assign the value of the passed parameter (user) to a text field txt1as if value was sent in the url.
Example :

<input id="txt1" type="text" value="this.document.user.value" >

But it doesn't seem to work.
I have also tried $("#txt1).val($("#PageContent").attr( 'user' )); That doesn't work either.
In both cases, the page loads but no parameter is retrieved.

I have spent 1 day trying to find an answer on this site and other sites with no luck. So If anyone knows if it is possible to do this or could point me in the right direction. I'd be very grateful if they could post something up.

At this stage I am wondering if I be better off using an iframe?

Things I have tried:

  1. I can't do the following as example, as it doesn't work in chrome.
    $("#PageContent").load(stPageLink +"?userid='usr1');

  2. I can't use window.href because I am using load() and I am loading the html into a div. So window.href will return "... /index.html" not "... subpage1.html?user="usr1"

  3. Unfortunately I don't know php.

Solution

  • I figured out the problem. The answer was so obvious I couldn't see it. In my Parent program I created the following two shared variables. 

    var array1 = [];
var array2 = [];

    The problem I had with jquery .load was a mistake I made. The following works function callPage(stPageLink) { getArrayParams(stPageLink); $("#PageContent").load(stPageLink) }

    onclick=''callPage(document.getElementById("LoginMenu").href + '?user=' + ipUserId);''

    The Problem I had jquery .loadbefore was because I did the below which was rubbish. onclick=''callPage(document.getElementById("LoginMenu").href + '?user="' + ipUserId + '"');'

    I then created a function to parse each parameter pair into the relevant array. This works. Thanks for your help guys. Only for your tips I wouldn't have seen it.