SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Addict
    Join Date
    Apr 2005
    Posts
    314
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Reload iFrame (within iFrame) with new URL

    Hi,

    I'm having difficulty in solving this one.

    Basically I have a web page with a search box and an iFrame where the full dataset is loaded.

    What I am trying to do is when the search field is populated and the user clicks search modify the src element of the iFrame to include a get variable. Then reload the iFrame so the new results will load.

    Hope that makes sense.

    I've tried various combinations and nothing appears to work. It is only the master page that reloads.

    The jQuery to detect the click on the search box outside the frame is written into the iFrame file because other functions are.

    Code to detect search click and get field value

    The commented items below are the things I have tried and none have been successful.

    HTML Code:
    $("#searchButton",top.document).click(function() {
      		var sTerm=$("input#sTerm",top.document).val();
      		target=window.parent.document.getElementById('frameSkills');
      		alert(sTerm);
      		//parent.document.frames[0].location.reload(true);
      		target.hide();
      		window.location.reload(true);
      		//target=window.parent.document.getElementById('frameSkills');
    		//target.src='skills_combine_frame_search.php?sTerm='+sTerm;
      		//top.frames[0].location='skills_combine_frame_search.php?sTerm='+sTerm;
      		//window.location.src='skills_combine_frame_search.php?sTerm='+sTerm;
      		//window.location='skills_combine_frame_search.php?sTerm='+sTerm;
      	});  	
    Search form and iFrame

    HTML Code:
    <div class="search" style="display:none;">
    <form id="form1" name="search" method="get" action="">
    				<input type="text" name="sTerm" id="sTerm" value="<?php echo '';?>"/>
    				<input type="submit" name="searchButton" id="searchButton" value="Search" class="button-pos" />
    </form>
    	  		<span class="clear"><a href="javascript:void(0)" class="searchReset" title="Clear Search">Clear search</a> <a href="javascript:void(0)" class="searchReset" title="Clear Search"><img src="../images/htimages/clear-sml.png" width="12" height="12" alt="Clear" /></a></span>
    		</div> 	
    		<div align="center" id="loadingGrid1">
    	    	<img align="middle" alt="Loading..." src="../images/htimages/ajax-loader.gif"/><br/>
    	    	<font size="-2"><b>Loading...</b></font>
    	    </div>
    		<iframe width="434" id="frameSkills" onLoad="calcHeight('frameSkills');" src="skills_combine_frame_search.php" scrolling="no" frameborder="0" height="1" style="display:none"></iframe>

  2. #2
    SitePoint Addict
    Join Date
    Apr 2005
    Posts
    314
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think I may have found a solution, I've now added the following code:

    HTML Code:
    target=window.parent.frames["frameSkills"];
    target.location='skills_combine_frame_search.php?sTerm='+sTerm;
    Appears to have fixed the problem.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •