JavaScript - Tabbed Search Module - Js Help

Hi,

Im using a authoring tool to develop an elearning test course. The course is composed of several HTML pages with Buttons for the multiple choice test. The setup of the course is that it will only ask 10 questions out of a pool of 30 questions.

When the HTML & JS files are online, the test takes 20-40seconds to load. I believe it is related to the code that selects the 10 questions from the 30.

I've singled out the code that does the select random pages... Is there any way to optimize the code?

I've attached the HTML (in txt format) page where the javascript can be found.

Looking forward to your replies!

I am trying to place a different google map in each tabbed of a spry tabbed panel. There is a known issue with google map V3 where the map will function properly on the default tab, but when the hidden tabs are unhidden, the map on those previously hidden tabs has centred in the very top left of the container div and only fills a small part of the container.

( www.kimholt.co.uk/locations demonstrates this, the London tab is fine, but the South West tab doesn't work properly).

I have spent hours on this bug so far, and tried many fixes. The only one that has got me anywhere so far is adding
[CODE]
google.maps.event.addListener(map, "idle", function() {google.maps.event.trigger(map, 'resize'); });

after var map = new google.maps.Map(document.getElementById(canvas), myOptions);

[CODE]

This doesn't resize the map automatically, but will resize it if the map is dragged slightly by the user. It also still has the marker centred in the top left of the screen rather than the centre of the canvas. The following solutions have also been suggested:

Re-centrering the map around the marker

[CODE]
google.maps.event.trigger({map}, 'resize'); {map}.setCenter({marker}.getPosition());
[CODE]

Zooming in and out again to trigger the resize:

[CODE]
map.setZoom( map.getZoom() );
[CODE]

Or using this to do the same thing:

[CODE]
this.map.setZoom( this.map.getZoom() - 1); this.map.setZoom( this.map.getZoom() + 1);
[CODE]

Suggested for use if there are multiple markers:

[CODE]
map.setZoom(map.getZoom()); map.fitBounds(bounds);
[CODE]

I haven't been able to get any of these to work, but I'm not sure if I am using them in the right place in the javascript, and I'm also not sure if there are any parts of this code that need amending to make them work in my particular code. How can I get the map to automatically resize when the tab is selected? How can I get the map to automatically recentre around the marker when the map is opened? Being fairly new to this I really need someone to look at my actual code and help me work out exactly what to put where, in other words assume I know nothing and will be extremely grateful for any help!

I am using the below code to create a blogging site but the pagination in one tab apprears in the other tab.
How do I individually create a pagination for each tab?


<?php
// Begin session, initiate database connection, etc.
require_once('./includes/base.php');

// If logging out, delete session variables
if($_GET['logout'] == 1){
@$_SESSION = array();
@session_unregister($_SESSION['userID']);
@session_unregister($_SESSION['userName']);
@session_unregister($_SESSION['userUser']);
@session_unregister($_SESSION['userPass']);
@session_destroy();
}
// Display header
require("./templates/$template/header.php");

?>

<div id="blurb" align="right">

<script language="javascript">
function isClear()
{
document.myForm[0].value='';
return true;

}
</script>
<!-- new search -->
<?php
ob_start();
if(!empty($_SESSION['userID']) and !empty($_POST['user'])){
echo '<form action="search.php" method="post" name="myForm">
<input type="text" value="search here" id="search" size="20" name="search" onFocus="return isClear();"/>
<input type="submit" name="serachuser" value="search"/></form>';
}
?>
</div>
<br>
<div id="blurb" align="justify">
<em>Hello world</em> <?php echo "$sitename"; ?> is blah blah blah....
</div>
<br>

<div id="container-5">
<ul>
<li><a href="#fragment-13"><span>Blogs</span></a></li>
<li><a href="#fragment-14"><span>Links</span></a></li>
<li><a href="#fragment-15"><span>Images</span></a></li>

</ul>
<div id="fragment-13">
<?php



$sql = mysql_query("SELECT users.userUser, posts.postID, posts.postPost, posts.postTime, posts.postComments, userAvatar FROM users, posts WHERE users.userID = posts.postUserID ORDER BY posts.postTime DESC ");
while($row = mysql_fetch_array($sql)){
$abcd= $row['userName'];
$abcd = str_replace (" ", "-", $abcd);
$time = reltime($row['postTime']);

echo '
<div class="virtualpage">
<table width="100%" >
<td width="10%" ><a href="'.$site_url.'/'.$row['userUser'].'"><img src="'.$site_url.'/avatars/'.$row['userAvatar'].'" width="48px" height="48px" /><td width="90% "bgcolor="#F8F8F8" border=1" cellspacing="1" cellpadding="1" ><b>'.$row['postPost'].'</b><br>Posted by:&nbsp;'.$row['userUser'].',&nbsp;<a href="'.$site_url.'/blogs/'.$row['userUser'].'/'.$row['postID'].'">Comments</a>&nbsp;'.$row['postComments'].' ,&nbsp;Time elapsed:&nbsp; '.$time.'</a></td>
</table><br>

</div>';}
?>

<?
echo '<div id="gallerypaginate" class="paginationstyle">
<a href="#" rel="previous">Prev</a> <span class="flatview"></span> <a href="#" rel="next">Next</a>
</div>' ;

?>


</div>


<div id="fragment-14">
<?php
$sql = mysql_query("SELECT users.userUser, links.linksID, links.linksLink, links.linksPost, links.linksTime, links.linksComments,userAvatar FROM users, links WHERE users.userID = links.linksUserID ORDER BY links.linksTime DESC");
while($row = mysql_fetch_array($sql)){
$abcd= $row['userName'];
$abcd = str_replace (" ", "-", $abcd);
$time1 = reltime($row['linksTime']);

echo '
<div class="virtualpage">
<table width="100%" >
<td width="10%" ><a href="'.$site_url.'/'.$row['userUser'].'"><img src="'.$site_url.'/avatars/'.$row['userAvatar'].'" width="48px" height="48px" /><td width="90% "bgcolor="#F8F8F8" border=1" cellspacing="1" cellpadding="1" ><b>'.$row['linksPost'].'</b><br>Posted by:&nbsp;'.$row['userUser'].',&nbsp;<a href="'.$site_url.'/blogs/'.$row['userUser'].'/'.$row['linksID'].'">Comments</a>&nbsp;'.$row['linksComments'].' ,&nbsp;Time elapsed:&nbsp; '.$time1.'</a></td>
</table><br>

</div>';}

?>


<?
echo '<div id="gallerypaginate" class="paginationstyle">
<a href="#" rel="previous">Prev</a> <span class="flatview"></span> <a href="#" rel="next">Next</a>
</div>' ;

?>

</div>
<div id="fragment-15">
<?php
// test
grabimages('SELECT users.userUser, images.imagesID, images.imagesFile, images.imagesPost, images.imagesTime, images.imagesComments FROM users, images WHERE users.userID = images.imagesUserID ORDER BY images.imagesTime DESC LIMIT 20');

?>

</div>
</div>


<?php

// Display footer
require("./templates/$template/footer.php");
?>

<table align="center"><tr><td align="center">
<script type="text/javascript" defer="defer">
var gallery=new virtualpaginate("virtualpage",10)
gallery.buildpagination("gallerypaginate")
</script>
</td></tr></table>

Thank you .......

Hey everyone! This is my first post, so let me go ahead and say hey to everyone at the forums. I myself don't know a whole lot about programming/coding, but I do run my business completely off the internet so I'm not clueless. I have a firm grip on HTML, and I can edit CSS files usually whenever I need to. All my sites use Wordpress now anyway, so there's rarely any need to check or edit the code.

Anyways, to my dilemma. I basically have an old website of my own (http://www.knowtheirbackground.blogspot.com). It's a pretty old site I hosted on Blogger, and if anyone is familiar with Blogger it's pretty simple. I downloaded that theme from a site and since all Blogger themes are XML I never really looked at the code.

Basically, I want to have a menu like you see on the right of the site I linked you to. A tabbed javascript menu (from what I looked at of the code recently I thought the menu was pretty much made using javascript and css). I've tried Googling and Bing-ing and yahoo-ing tutorials to make a tabbed menu and haven't been successful yet. I want one that operates just like the one on Know Their Background, only things I would change is the text and maybe the colors. I've looked and tried for days and have been unsuccessful. Any help I would GREATLY appreciate.

P.S. I also tried using jQuery or something along those lines and nothing. Tried some wordpress plug ins too but they only work in widgets when they do work.. I want my menu in a sticky post on the front page.

Hi there!

I hope I posted this question in the right place. I've been working on a Spry Master/Detail region using Dreamweaver CS4 for months now and I just can't get it to work right. I know very little about coding Javascript; I'm altering a template from a tutorial book. Here's my problem:

I want at least 2 master/detail regions on a single page, each nested in a spry tabbed panel, and each filtered by a non-destructive filter. I'm having all kinds of trouble getting this accomplished.I did some troubleshooting and have pinpointed exactly where things go wrong.

First, I thought that the problem might be that both of my tables were on the same page as the master/detail regions, so I put them on their own pages. No problems there. Then I built one master/detail region, with selectable filter menu, in a spry tabbed panel. No problem. Then I started all over again, and built each master/detail region stepwise following the instructions in the book. The 2 master/detail regions, 1 in each tab, are no problem. Applying the non-destructive filter is where things get tricky for me.

When I apply the non-destructive filters, all of the data from the first table disappears! The table in the 2nd tab still works perfectly.

My 2 spry datasets are named rs_CasteAbilities and rs_ProfAbilities. Here's the code for just creating the 2 spry data sets:

[CODE] var rs_CasteAbilities = new Spry.Data.HTMLDataSet("gacasteabilitiesforactivetable.php", "GA_CasteAbilities");
var rs_ProfAbility = new Spry.Data.HTMLDataSet("gaprofessionabilitiesforactivetable.php", "GA_ProfAbilities"); [CODE]

No problems there. When I apply the nondestructive filter to the first spry dataset the first dataset filters just as it is supposed to and the second one does nothing, just as its supposed to. It looks like this:

[CODE] var rs_CasteAbilities = new Spry.Data.HTMLDataSet("gacasteabilitiesforactivetable.php", "GA_CasteAbilities");
rs_CasteAbilities.gallery = '1';
function chooseSet(dataSet, row, rowNumber)
{
if (row == rs_CasteAbilities.gallery) {
return row;
}
return null;
}
rs_CasteAbilities.filter(chooseSet);
var rs_ProfAbility = new Spry.Data.HTMLDataSet("gaprofessionabilitiesforactivetable.php", "GA_ProfAbilities"); [CODE]

The problem is that when I apply the same filter to the 2nd spry dataset, the 2nd dataset filters, but the first dataset totally disappears when I view the page (firefox and safari)! I can post screenshots if needed. Here's the code I'm using:

[CODE] var rs_CasteAbilities = new Spry.Data.HTMLDataSet("gacasteabilitiesforactivetable.php", "GA_CasteAbilities");
rs_CasteAbilities.gallery = '1';
function chooseSet(dataSet, row, rowNumber)
{
if (row == rs_CasteAbilities.gallery) {
return row;
}
return null;
}
rs_CasteAbilities.filter(chooseSet);
var rs_ProfAbility = new Spry.Data.HTMLDataSet("gaprofessionabilitiesforactivetable.php", "GA_ProfAbilities");
rs_ProfAbility.gallery = '1';
function chooseSet(dataSet, row, rowNumber)
{
if (row == rs_ProfAbility.gallery) {
return row;
}
return null;
}
rs_ProfAbility.filter(chooseSet); [CODE]

This problem has been stumping me for weeks and I'm getting to the point where I need to get this done. I hope that in my inexperience, I was able to communicate this problem articulately. Please somebody help!

Thanks so much to anyone who takes the time to help me out. The page itself, with nothing showing up in the first tab, can be viewed he

www.iotheatre.com/GoldenAgeAbilities.php

-Chris Blockus

In this case, Let's take Google Search as example:

The code is JScript .NET, which is basically a .NET version of Javascript. Regardless of language, Anyone with appending type of skill can answer my question.

This code is used in Fiddler(It's a Man-in-the-middle proxy)

Code:

if (oSession.uriContains("&q=")) // oSession is a Fiddler object session // uriContains() function, checks for case-insensitive string from the URI
{
    var str = oSession.fullUrl;
    var sAppend = "test1+test2+test3";
    if (!oSession.uriContains(sAppend))
    {
        oSession.fullUrl = str.replace( "&q=","&q="+sAppend);
    }
}

For those who are confused, It says, If &q= is present in the URI, replace/append &q= with &q=test1+test2+test3

Problem: It appends test1+test2+test3 instantly, when it sees &q= in the URL.

Basically, how do I make it wait until I click the submit/search button

Thank you.

Update: I heard about Onsubmit() event, but not really familiar with it. How do I use it? like, should I go to google source page and edit the form id?

Also, Any other methods besides Onsubmit()?

Hi Everyone! I have a website that I'm designing where I have the need to search multiple sites at specific times. By this I mean that In some cases, we would want to search only the internet using google, or only search the site that I've created (which currently uses the jse_search.js solution), or only our company's website.

I currently have four different search boxes that will search either the internet, the internal site, a separate internal site, or a third-party website, which all working fine. The problem is that the search boxes take up quite a bit of space, and the layout is becoming cumbersome. Is there a way in Javascript I could use a single search box and a drop-down list to select which method to use? The code I'm currently using is below. With the exception of the Google search function, I've modified some of the site names to general site names and paths to preserve the company's anonymity:

Code in the <head> tag:

Code:

<script language="JavaScript1.3" type="text/javascript" src="jse_form.js">

</script>

Code in the <body> tag:

Code:

<!--Begin Internal Site Search 1!-->

<div>
 <p style="text-align: center;">
 <table border="0" cellpadding="0">
  <tr><td><form name="jse_Form" onsubmit="search_form(jse_Form);return false">
   <input type="text" name="d" size="30">
  </tr></td>
  <tr><td>
   <input type="button" value="Internal Site Search 1" onclick="search_form(jse_Form)">
   </form>
  </tr></td>
 </table>


<!--End Internal Site Search 1!-->

<!--Begin Internal Site Search 2!-->

<div>
 <p style="text-align: center;">
 <table border="0" cellpadding="0">
  <tr><td>
  <!--webbot bot="Search" S-Index="all" S-Fields S-Text="Search for:" I-Size="20" S-Submit="Start Search" S-Clear="Reset" S-TimestampFormat="%m/%d/%Y" TAG="BODY" b-useindexserver="1" startspan -->
  <form action="http://sitesearch2.idq" method="POST"><input type="text" name="UserRestriction" size="30" value>
  </tr></td>
  <tr><td style="text-align: center;">
  <input type="submit" value="Internal Site Search 2"></form>
  </form>
  <!--webbot bot="Search" i-checksum="4210" endspan -->
  </td></tr>
 </table>
</div>

<!--End Internal Site Search!-->

<!--Begin Google Search!-->

<form method="get" action="http://www.google.com/search">
 <div>
 <p style="text-align: center;">
  <table border="0" cellpadding="0">
   <tr><td>
    <input type="text"   name="q" size="30" maxlength="233" value="" />
   </tr></td>
   <tr><td align="center">
   <input type="submit" value="Google Search" /></td></tr>
  </table>
 </div>
</form>

<!--End Google Search!-->

<!--Begin Third Party Search!-->

<form id="keywordSearchForm" method="get" action="http://www.site3.html">
 <div>
 <p style="text-align: center;">
  <table border="0" cellpadding="0">
   <tr><td>
    <input class="input" type="text" name="keyword" size="30" />
   </tr></td>
   <tr><td align="center">
    <input type="hidden" name="origin" value="keywordsearch" /><input id="go" class="button" tabindex="0" type="submit" value="Third Party Search" />
   </td></tr>
  </table>
 </div>
</form>

<!--End Third Party Site Search!-->

Hi experts,

is it possible via Javascript to search certain websites with certain keywords without having to use specific search engines?

example search only the following:

1. www.yyy.com
2. www.aaa.com
3. www.zzz.com

for the keyword "Laminat" and open the sites accordingly.

thx

Hello people.

I'm looking to create a simple search engine capable of searching multiple search engines simultaneously together (e.g. Google, Bing, Yahoo, etc.) and then displaying the results below for all sites on the same page.

I don't want each search engine results page opening up in individual windows or anything, nor do I want people to have to manually select the search engine to search with. Just a single page where a user types in something, pressed [Enter] and then presented with all results from multiple sites on one page (without duplicates).

I'm also looking to do this with image and torrent sites, etc.

How would I go about doing this?

Thanks a million guys. You have bigger brains than me.

I have my own multi option search bar

html

Code:

	<form name="searchform" action="http://www.google.com/search?q=" onsubmit="return dosearch();">
	Search:
	<select name="sengines">
	<option value="http://www.google.com/search?q=">Google</option>
	<option value="http://search.yahoo.com/search?q=">Yahoo</option>
	<option value="http://www.bing.com/search?q=">Bing</option>
	<option value="http://www.playlist.com/searchbeta/tracks#">Playlist</option>
	<option value="http://www.youtube.com/results?search_query=">Youtube</option>
	<option value="http://www.hulu.com/search?query=">Hulu</option>
	<option value="http://www.tv.com/search.php?type=11&amp;stype=all&amp;tag=search%3Bfrontdoor&amp;qs=">TV.com</option>
	<option value="http://www.ask.com/web?q=">Ask</option>
	<option value="http://www.answers.com/topic/">Answers</option>
	<option value="http://www.ehow.com/search.aspx?s=">eHow</option>
	<option value="http://en.wikipedia.org/wiki/">Wikipedia</option>
	<option value="http://search.forbes.com/search/find?tab=searchtabgeneraldark&MT=">Forbes</option>
	</select>
	&nbsp;For:
	<input type="text" name="searchterms" />
	<input class="button" type="submit" name="SearchSubmit" value="Search" />
	</form>

javascript (external)

Code:

function dosearch()
{
var sf=document.searchform;
var submitto = sf.sengines.options[sf.sengines.selectedIndex].value + escape(sf.searchterms.value);
window.location.href = submitto;
return false;
}

but I want to have a second drop-down menu. I just can't get the 2nd one have everything still work. Can some benevolent sheep-guider-person (whatever they're called) help me? Thanks in advance, man with unnecessary phallic staff.

Good Day:
I am building a small website that lists the local restaurants in the area. I would like to have a search bar at the top of the page so the user could type in the name of the restaurant and it takes you to my review. The way I have it set now, is the user has to scroll down to find the restaurant.
The saerch bar would be much easier.
Thanks in advance for any and all assistance.

I'm doing some kind of MP3 Player search in javascript form using the URL from http://beemp3.com/index.php?p= then after the = any user will type the song they want to search and it'll appear as a valid URL search data under beemp3.com. The page is in http://stereowired.wehostyour.info/searchid.html. My problem is getting the value in .superform whenever the onChange occurs. this.value() doesn't work. I need some kind of alternative

thanks

oh yeah and the whole code Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="en" lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>MP3 Search Engine</title> 
<style type="text/css">
*{font-family:"georgia","times new roman"}
body{padding:0;margin:0;background:#fff;color:#000;}
.center{text-align:center;width:64%;margin:0 auto;}
.formatt{width:100%;height:36px;display:block;}
.superform{float:left;width:73%;padding:5px 0;border:2px inset #a0a0a0;background:#e8e8e8;font-size:17px;color:#555;text-align:center;display:block;margin-top:1px;text-shadow:1px 1px 0 #fff;}
.superform:hover{background:#d8d8d8}
.supersubmit{float:right;width:25%;padding:5px 0;border:2px outset #333;background:#434343;font-size:17px;color:#999;display:block;margin-left:1%;text-shadow:1px 1px 0 #121212;}
.supersubmit:focus{border-style:inset;color:#fff}
#jam{width:100%;display:block;clear;both;border:0;height:600px;}
</style>
</head>
<body>
<div class="center"><h2>Stereo wired Search Engine</h2><div class="formatt">
<input class="superform" type="name" onChange="document.getElementById('jam').src="http://beemp3.com/index.php?q="+this.value()+"" /><input class="supersubmit" type="submit" value="Search" /></div>
<iframe id="jam" src="http://beemp3.com"></iframe></div>
</body></html>

i have a site where i sell vinyl graphics. i dont really want to use a full ecommerce CMS so search that way is out of the question. basically what i want is a search box where the user can type in keywords and it will display a page exactly like my products page but only showing products that are associated with that keyword. what would be the best way to go about doing this or is more than JS going to be needed?

Hi all, I'm looking to find a way to making a FAQ selection search which has a hierarchy effect. For example:

Whats your favorite color?
Red Blue Green

Say you select red

What shade of red do you prefer?
Dark Light

Say you select Light

Final page that will contain the information that you had rounded down through the search.

Does any one have any ideas on how I can do this as I cant seem to find anything on the net!

Thanks

Hello,

I have a search textbox field which populates the results in a dropdown after searched.

But there is no way, to let users to explain to click or use the dropdown to see the results.. thus, I would like to have a focus on the dropdown, so after the user searches through the search textfield, and enter, the dropdown gets the focus so it will user friendly.

can anyone help me on this.
thank you in advance