合并2个搜索表单到1个输入,加上复选框


Merging 2 search forms into 1 input, plus checkboxes

在我的网站上,我有一个主要的搜索(由谷歌提供动力,放置在整个网站),我现在已经创建了第二个搜索(在自己的页面上,根据用户输入文本搜索我的DB图像),这是一个完全独立的搜索到谷歌一个。

我想做什么-我希望两个搜索表单共享一个文本输入字段,但允许用户通过单选按钮选择使用哪个搜索(Google或Images Only)。

所以我们有:[搜索输入字段][go] (o)使用Google (o)图像搜索

我不是程序员,但我可以破解足够的代码,只是花了我一两天的时间来弄清楚并开始工作。我需要什么,将节省我大量的时间,因为我难住了如何进行这个,如果它甚至是可能的!如果有人能告诉我A)是否有可能,B)如果有可能,给我一些建议。例如,我猜它可能需要一点JavaScript来使它成为可能?如有任何建议,我将不胜感激,然后我可以看看我能做些什么。

祝你一切顺利。克里斯。
     // My Stand-alone Image Search Page ////////////////////////////////
 <form  method="post" action="imagesearch?go"  id="search-form">  
       <input  type="text" name="name">  
       <input  type="submit" name="submit" value="Search">  
    </form>
// code for above form //
 if(isset($_POST['submit'])){
  if(isset($_GET['go'])){
  if(preg_match("/^[  a-zA-Z]+/", $_POST['name'])){
  $name=$_POST['name'];
  $sql="SELECT  ID FROM ImageTable WHERE Name LIKE '%" . $name .  "%'  Order by Date Desc LIMIT 50";
  //-run  the query against the mysql query function
  $result=mysql_query($sql);
  // Create  while loop and loop through result set//
   $content .= ' <p><div id="wrapper">';
  while($row=mysql_fetch_array($result)){
       $id=$row['ID'];
    $img = new Image($id);
  // Format results//
  $content .= '<div id="imgrt"><a href="'.$img->URL.'"><img src="/img/M/'.$img->ID.'.jpg" class="searchimg"><br>'.$img->Name.'</a>';

  $content .= '</div>';
  }
  $content .= '';$content .= '</div>';
  }
  else{
 $content .= ' <p>Please enter a search query</p>';
  }
  }
  }
// End of Stand-alone image search page /////////////////////////
---------------------------------------------------------------------------
// My sites main Google powered Search
<form action="http://www.example.com/gsresults" id="cse-search-box" class="searchmain">
      <input type="hidden" name="cx" value="partner-pub-XXXXXXXXXXXXXXX" />
        <input type="hidden" name="cof" value="FORID:XX" />
        <input type="hidden" name="ie" value="UTF-8" />
        <input type="text" name="q" class="mainsearch">
        <input type="submit" name="sa" value="Go" class="mainsearchbutton"/>
    </form>
    <script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&amp;lang="></script>

好了。如果你把它放在一个空的html文件中,你可以看到它在行动(试图做一个jsfiddle,但由于某种原因没有工作)。它所做的是在选择的组合选项上设置一个"活动"id,当您单击提交按钮时,它会获取具有该id的组合选项的值,并转到该值的页面。如果你点击Google,然后按钮你会找到Google。html, image。html也是一样。如果你想知道更多的细节,你可以问,但这是主要的逻辑。

<script>
    function replaceActive(obj) {
        var activeElm = document.getElementById("active");
        activeElm.id = activeElm.id.replace("active", ""); 
        obj.id = "active";
    }
    function formFunction(obj) {
        obj.action = document.getElementById("active").value + ".html";
    }
</script>
<form action="#" onsubmit="return formFunction(this);" method="post">
    <input type="text" />
    <select>
        <option value="google" id="active" onclick="replaceActive(this);">Google</option>
        <option value="image" onclick="replaceActive(this);">Images</option>
    </select>
    <input type="submit" />
</form>

基本上你可以改变"formFunction()"函数的代码,并使用"document.getElementById("active")。