Javascript php include not working - search text show include help

anossovs · July 18, 2013

Hi guys,

I'm trying to build the following functionality, but find myself seriously lacking in coding aptitude and knowledge.
I'm hoping you guys can help me out.

Ultimate goal: Clean search bar in middle of screen with no submit button;
typing specific text ex. "test" brings an html/javascript widget from a separate file ex. "test1.html" and includes that content below the search bar all without a refresh.

My current solution (and note that the code is retrofitted from a different project that someone else wrote), is an if-then solution, whereby if the text in the input == "test" then the page includes the test1.html file.

main.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Testing</title>

<script language="javascript" type="text/javascript">
var XMLHttpRequestObject_test = false;
var strSend;

if (window.XMLHttpRequest) {
   XMLHttpRequestObject_test = new XMLHttpRequest();
} else if (window.ActiveXObject) {
   XMLHttpRequestObject_test = new ActiveXObject("Microsoft.XMLHTTP");
}

var i;
var finished;

function test()
{
   if (XMLHttpRequestObject_test) {
      strSend = "receive.php?";
      i = 0;
      finished = false;
      while (finished != true) 
      {
         if (document.input1.elements[i].type == "text") {
            strSend = strSend + "&" + document.input1.elements[i].name + "=" + document.input1.elements[i].value;
         }
         else if (document.input1.elements[i].type == "checkbox") {
            strSend = strSend + "&" + document.input1.elements[i].name + "=" + document.input1.elements[i].checked;
         }
         else if (document.input1.elements[i].type == "hidden") {
            strSend = strSend + "&" + document.input1.elements[i].name + "=" + document.input1.elements[i].value;
         }
         else if (document.input1.elements[i].type == "password") {
            strSend = strSend + "&" + document.input1.elements[i].name + "=" + document.input1.elements[i].value;
         }         

         i = i + 1;
         
         if (document.input1.elements[i] != "[object HTMLInputElement]") {
            finished = true;
         }
         else
         {
            finished = false;
         }
      }
      XMLHttpRequestObject_test.open("GET", strSend);
      
      XMLHttpRequestObject_test.onreadystatechange = function ()
      {
         if (XMLHttpRequestObject_test.readyState == 4 && XMLHttpRequestObject_test.status == 200) {
            document.getElementById('test').innerHTML = XMLHttpRequestObject_test.responseText;
         }
      }      
      XMLHttpRequestObject_test.send(null);
   }
}
</script>

</head>

<body>
<form name="input1">

<input name="txt1" type="text" />
</form><br />


<input name="cmd_submit" type="button" value="Submit" onclick="test()" /><br/>
<br/>

<div id="test"></div>
</body>
</html>

receive.php

<?php
if($_REQUEST['txt1'] == "test")
{
include('test1.html');
}
else
{
echo stripslashes($_REQUEST['txt1']);
}
?>

Test1.html (the content to be included)

<?php
echo '<script type="text/javascript" src="http://www.gmodules.com/ig/ifr?url=http://hosting.gmodules.com/ig/gadgets/file/100840413740199312943/stock-quotes.xml&up_stockList=%5EIXIC%2C%5EGSPC%2C%5EN225%2C%5EHSI%2C%5ESTI%2C%5EFTSE%2C%5EGDAXI%2C%5EFCHI&up_chart_bool=1&up_font_size=12&up_symbol_bool=0&up_chart_period=0&up_refresh_secs=30&synd=open&w=290&h=300&title=Stock+Quotes&border=%23ffffff%7C3px%2C1px+solid+%23999999&output=js"></script>'; 
echo '<p class="p1">ONETEST!</p>';
?>

Result after typing "test" into search bar (no quotes)

[SEARCH BAR]



ONETEST!

Very accurate representation of the search bar, I know. But the google widget that I used to test this doesn't show up, only the text. I have tried many variations on trying to echo the javascript such that php doesn't chuck it, but nothing.

// I have alternative code that includes the content via ajax without the use of php and it brings the widget in without a problem, however, I have no idea how to make that "search bar - if string == 'test', then, show include" paradigm without php.

Thank you in advance,

Alex

Long time visitor, first time poster ::)

The Letter E · July 18, 2013

It seems you are trying to achieve a lookahead functionality. Perhaps you should consider using bootstrap: http://twitter.github.io/bootstrap/javascript.html#typeahead

All the work is done for you and it works like a charm

Sign In

Javascript php include not working - search text show include help

Recommended Posts

anossovs

Link to comment

Share on other sites

The Letter E

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information