Query results in different tabs?

kristo5747 · April 13, 2010

Greetings!

I have a form that's meant to be a rudimentary search engine.

The forms calls the piece of code below and outputs successfully the results in a new tab.

<?php
//Includes the db config file
$dbconf = include '.../config/dbConfig.php';

//checks if fields are set.
if(isset($_POST['submit'])) {
if(
!empty($_POST['search_string'])
) {
searchWebcases();
searchResolutions();
} else {
echo "<html><body>
<script type=\"text/javascript\" language=\"javascript\">alert(
'Nothing to do.'
+ '\\n\\n' + ' You must type a letter, word or phrase before you can hit \"Run Search\"'
+ '.');</script> </body></html>";
}
}


function searchWebcases() {

/*
* Grabs $dbconf and declares variables.
*/
global $dbconf;
/*
* Grabs POST value.
*/
$q = $_POST['search_string'];

/*
* Connect to db.
*/
$con = mysql_connect($dbconf["host"], $dbconf["user"],$dbconf["password"]) ;
if (!$con) {
die('Could not connect: ' . mysql_error());
}

mysql_select_db($dbconf["db"], $con) or die ("Couldn't select the database.");

/*
* Search webcases.
*/
$result = mysql_query("
select
wc.caseid,
wc.request_title,
wc.request_description,
wc.requestor,
wc.created_on,
wc.status,
wc.assigned_to from webcases wc where
lower(wc.request_title) like '%".$q."%'
or
lower(wc.request_description) like '%".$q."%' order by wc.caseid asc");

/*
* build output page.
*/
$headerpage = '<html><head><title>WEBCASES matching your search criteria</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
#mytable, #mytd
{
border-color: #600;
border-style: solid;
}
#mytable
{
border-width: 1px 1px 1px 1px;
border-spacing: 0;
border-collapse: collapse;
}
#mytd
{
margin: 0;
padding: 4px;
border-width: 1px 1px 0 0;
background-color: #FFC;
}
</style></head><body>';

echo $footerpage = '</body></html>';

echo $headerpage . '<table id="mytable"><thead>
<tr>
<th>ID</font></th>
<th>Title</font></th>
<th>Description</font></th>
<th>Requester</font></th>
<th>Created</font></th>
<th>Status</font></th>
<th>Developer</font></th>
</tr></font></thead><tbody>';

while($row = mysql_fetch_array($result)) {

echo("<a target='_blank'>".
'<tr><td id="mytd">'
. $row['caseid'] . '</td><td id="mytd">'
. $row['request_title'] . '</td><td id="mytd">'
. $row['request_description'] . '</td><td id="mytd">'
. $row['requestor'] . '</td><td id="mytd">'
. $row['created_on'] . '</td><td id="mytd">'
. $row['status'] . '</td><td id="mytd">'
. $row['assigned_to'] . '</td><td id="mytd">'
. '</tr>'
."</a> \n");

}

echo '</tbody></table>' . $footerpage;

mysql_close($con);
}

function searchResolutions() {


/*
* Grabs $dbconf and declares variables.
*/
global $dbconf;
/*
* Grabs POST value.
*/
$q = $_POST['search_string'];

/*
* Connect to db.
*/
$con = mysql_connect($dbconf["host"], $dbconf["user"],$dbconf["password"]) ;
if (!$con) {
die('Could not connect: ' . mysql_error());
}

mysql_select_db($dbconf["db"], $con) or die ("Couldn't select the database.");

/*
* Search webcases.
*/
$result = mysql_query("
select
wc.caseid,
wc.resolution,
wc.resolved_on from resolution wc where lower(wc.resolution) like '%".$q."%' order by wc.caseid asc");

/*
* build output page.
*/
$headerpage = '<html><head><title>RESOLUTIONS matching your search criteria</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
#mytable, #mytd
{
border-color: #600;
border-style: solid;
}
#mytable
{
border-width: 1px 1px 1px 1px;
border-spacing: 0;
border-collapse: collapse;
}
#mytd
{
margin: 0;
padding: 4px;
border-width: 1px 1px 0 0;
background-color: #FFC;
}
</style></head><body>';

echo $footerpage = '</body></html>';

echo $headerpage . '<table id="mytable"><thead>
<tr>
<th>ID</font></th>
<th>Resolution</font></th>
<th>Resolved On</font></th>
</tr></font></thead><tbody>';

while($row = mysql_fetch_array($result)) {

echo("<a target='_blank'>".
'<tr><td id="mytd">'
. $row['caseid'] . '</td><td id="mytd">'
. $row['resolution'] . '</td><td id="mytd">'
. $row['resolved_on'] . '</td><td id="mytd">'
. '</tr>'
."</a> \n");

}

echo '</tbody></table>' . $footerpage;

mysql_close($con);
}
?>

Problem is that both query results display in the *same* tab i.e that of my searchWebcases() function.

Is there a way to output the results of searchResolutions() function in its own tab?

The Little Guy · April 13, 2010

your probably going to have to use javascript and css to give the visual effetct.

css:

display:none;

javascript:

document.getElementById('itemid').style.display = 'none';
or
document.getElementById('itemid').style.display = 'block';

just switch between the two to give a visual effect of the use of tabs.

I think this is what your talking about...

kristo5747 · April 13, 2010

Forgive me but I failed to be specific.

Basically, my intent is to load one function's output into one browser tab, and the other function's output to another (separate) browser tab.

I believe I need to use Javascript for that but I am not understanding how your suggestion would help. Can you please elaborate?

The Little Guy · April 13, 2010

OK, you can't do it the way I said, because I misunderstood.

I don't think that it is possible to automatically open new tabs for users without using a hyper link, unless that is what you want yo would just do:

<a target="_blank" href="http://site.com/results.php?getResults=someValue">More...</a>

kristo5747 · April 14, 2010

OK, you can't do it the way I said, because I misunderstood.

I don't think that it is possible to automatically open new tabs for users without using a hyper link, unless that is what you want yo would just do:
<a target="_blank" href="http://site.com/results.php?getResults=someValue">More...</a>

Actually, it is. jQuery did the trick.

I found an example of tabs implementation via jQuery. I simply hacked the code to support my needs. Here it is:

<!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>Knowledge Base</title>
        <style type="text/css">
            body {
                background: #f0f0f0;
                margin: 0;
                padding: 0;
                font: 10px normal Verdana, Arial, Helvetica, sans-serif;
                color: #444;
            }
            h1 {
                font-size: 3em; margin: 20px 0;
            }
            .container {
                width: 1000px; margin: 50px ;height: 1000px;
            }
            ul.tabs {
                margin: 0;
                padding: 0;
                float: left;
                list-style: none;
                height: 32px;
                border-bottom: 1px solid #999;
                border-left: 1px solid #999;
                width: 100%;
            }
            ul.tabs li {
                float: left;
                margin: 0;
                padding: 0;
                height: 31px;
                line-height: 31px;
                border: 1px solid #999;
                border-left: none;
                margin-bottom: -1px;
                background: #e0e0e0;
                overflow: hidden;
                position: relative;
            }
            ul.tabs li a {
                text-decoration: none;
                color: #000;
                display: block;
                font-size: 1.2em;
                padding: 0 20px;
                border: 1px solid #fff;
                outline: none;
            }
            ul.tabs li a:hover {
                background: #ccc;
            }
            html ul.tabs li.active, html ul.tabs li.active a:hover  {
                background: #fff;
                border-bottom: 1px solid #fff;
            }
            .tab_container {
                border: 1px solid #999;
                border-top: none;
                clear: both;
                float: left;
                width: 100%;
                height: 100%;
                background: #fff;
                -moz-border-radius-bottomright: 5px;
                -khtml-border-radius-bottomright: 5px;
                -webkit-border-bottom-right-radius: 5px;
                -moz-border-radius-bottomleft: 5px;
                -khtml-border-radius-bottomleft: 5px;
                -webkit-border-bottom-left-radius: 5px;
            }
            .tab_content {
                padding: 20px;
                font-size: 1.2em;
            }
            .tab_content h2 {
                font-weight: normal;
                padding-bottom: 10px;
                border-bottom: 1px dashed #ddd;
                font-size: 1.8em;
            }
            .tab_content h3 a{
                color: #254588;
            }
            .tab_content img {
                float: left;
                margin: 0 20px 20px 0;
                border: 1px solid #ddd;
                padding: 5px;
            }
        </style>
        <script type="text/javascript"
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
        <script type="text/javascript">

            $(document).ready(function() {

                //Default Action
                $(".tab_content").hide(); //Hide all content
                $("ul.tabs li:first").addClass("active").show(); //Activate first tab
                $(".tab_content:first").show(); //Show first tab content

                //On Click Event
                $("ul.tabs li").click(function() {
                    $("ul.tabs li").removeClass("active"); //Remove any "active" class
                    $(this).addClass("active"); //Add "active" class to selected tab
                    $(".tab_content").hide(); //Hide all tab content
                    var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
                    $(activeTab).fadeIn(); //Fade in the active content
                    return false;
                });

            });
        </script>
    </head>
    <body>
        <div class="container">
            <h1>Knowledge Base</h1>
            <h3>This search engine crawls the online ticketing system for data on resolutions.<p></p>
                For a search, enter a word (faster) or letter (slow) to see a list of corresponding ticket titles, design notes or resolutions.</h3>
            <form method="post" 
                  id="f1" name="myform" action="<?php echo $_SERVER['PHP_SELF'];?>" >
                <input type="text"   id="qry" name="search_string" size="60"></input>
                <input type="submit" id="rs"  name="submit" value="Run Search"></input>
                <input type="reset" id="reset" name="reset" value="Clear Search"
                       ></input><p></p>
            </form>
            <ul class="tabs">
                <li><a href="#tab1">Webcases</a></li>
                <li><a href="#tab2">Design Notes</a></li>
                <li><a href="#tab3">Resolutions</a></li>
            </ul>
            <div class="tab_container">
                <div id="tab1" class="tab_content">
                    <h2>Search Results</h2>
                    <p>
                        <?php
//Includes the db config file
                        $dbconf = include '/var/www/html/ServiceAndRepair/config/dbConfig.php';

//checks if fields are set.
                        if(isset($_POST['submit'])) {
                            if(
                            !empty($_POST['search_string'])
                            ) {
                                searchWebcases();
                            }
                        }


                        function searchWebcases() {

                            /*
* Grabs $dbconf and declares variables.
                            */
                            global $dbconf;
                            /*
* Grabs POST value.
                            */
                            $q = $_POST['search_string'];

                            /*
* Connect to db.
                            */
                            $con = mysql_connect($dbconf["host"], $dbconf["user"],$dbconf["password"]) ;
                            if (!$con) {
                                die('Could not connect: ' . mysql_error());
                            }

                            mysql_select_db($dbconf["db"], $con) or die ("Couldn't select the database.");

                            /*
* Search webcases.
*
* Uses `mysql_real_escape_string()` as safeguard against SQL injection.
* Function `mysql_real_escape_string()` escapes special characters in a string for use in a SQL statement.
*
                            */
                            $result = mysql_query("
select
wc.caseid,
wc.request_title,
wc.request_description,
wc.requestor,
wc.created_on,
wc.status,
wc.assigned_to from webcases wc where
lower(wc.request_title) like '%".mysql_real_escape_string($q)."%' 
or
lower(wc.request_description) like '%".mysql_real_escape_string($q)."%' order by wc.caseid asc");


                            /*
* build output page.
                            */
                            $headerpage = '<html><head><title>WEBCASES matching your search criteria</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
#mytable, #mytd
{
border-color: #600;
border-style: solid;
}
#mytable
{
border-width: 1px 1px 1px 1px;
border-spacing: 0;
border-collapse: collapse;
}
#mytd
{
margin: 0;
padding: 4px;
border-width: 1px 1px 0 0;
background-color: #FFC;
}
</style></head><body>';

                            echo $footerpage = '</body></html>';

                            echo $headerpage . '<table id="mytable"><thead>
<tr>
<th>ID</font></th>
<th>Title</font></th>
<th>Description</font></th>
<th>Requester</font></th>
<th>Created</font></th>
<th>Status</font></th>
<th>Developer</font></th>
</tr></font></thead><tbody>';

                            while($row = mysql_fetch_array($result)) {

                                echo("<a target='_new'>".
                                        '<tr><td id="mytd">'
                                        . $row['caseid'] . '</td><td id="mytd">'
                                        . $row['request_title'] . '</td><td id="mytd">'
                                        . $row['request_description'] . '</td><td id="mytd">'
                                        . $row['requestor'] . '</td><td id="mytd">'
                                        . $row['created_on'] . '</td><td id="mytd">'
                                        . $row['status'] . '</td><td id="mytd">'
                                        . $row['assigned_to'] . '</td><td id="mytd">'
                                        . '</tr>'
                                        ."</a>    \n");

                            }

                            echo '</tbody></table>' . $footerpage;

                            mysql_close($con);
                        }?>
                    </p>
                </div>
                <div id="tab2" class="tab_content">
                    <h2>Search Results</h2>
                    <p>
<?php
//Includes the db config file
                        $dbconf = include '/var/www/html/ServiceAndRepair/config/dbConfig.php';

//checks if fields are set.
                        if(isset($_POST['submit'])) {
                            if(
                            !empty($_POST['search_string'])
                            ) {
                                searchWip();
                            }
                        }

                        function searchWip() {
                            /*
* Grabs $dbconf and declares variables.
                            */
                            global $dbconf;
                            /*
* Grabs POST value.
                            */
                            $q = $_POST['search_string'];

                            /*
* Connect to db.
                            */
                            $con = mysql_connect($dbconf["host"], $dbconf["user"],$dbconf["password"]) ;
                            if (!$con) {
                                die('Could not connect: ' . mysql_error());
                            }

                            mysql_select_db($dbconf["db"], $con) or die ("Couldn't select the database.");

                            /*
* Search resolutions. Uses `mysql_real_escape_string()` as safeguard against SQL injection.
* Function `mysql_real_escape_string()` escapes special characters in a string for use in a SQL statement.
                            */
                            $result = mysql_query("
select
wc.caseid,
wc.design_notes,
date(wc.as_of) as_of from wip wc where lower(wc.design_notes) like '%".mysql_real_escape_string(strtolower($q))."%' order by wc.caseid asc");

                            /*
* build output page.
                            */
                            $headerpage = '<html><head><title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
#mytable, #mytd
{
border-color: #600;
border-style: solid;
}
#mytable
{
border-width: 1px 1px 1px 1px;
border-spacing: 0;
border-collapse: collapse;
}
#mytd
{
margin: 0;
padding: 4px;
border-width: 1px 1px 0 0;
background-color: #FFC;
}
</style></head><body>';

                            echo $footerpage = '</body></html>';

                            echo $headerpage . '<table id="mytable"><thead>
<tr>
<th>ID</font></th>
<th>Design Notes</font></th>
<th>As Of</font></th>
</tr></font></thead><tbody>';

                            while($row = mysql_fetch_array($result)) {

                                echo("<a target='_new'>".
                                        '<tr><td id="mytd">'
                                        . $row['caseid'] . '</td><td id="mytd">'
                                        . $row['design_notes'] . '</td><td id="mytd">'
                                        . $row['as_of'] . '</td><td id="mytd">'
                                        . '</tr>'
                                        ."</a>    \n");

                            }

                            echo '</tbody></table>' . $footerpage;

                            mysql_close($con);
                        }?>
                    </p>
                </div>
                <div id="tab3" class="tab_content">
                    <h2>Search Results</h2>
                    <p>
                        <?php
//Includes the db config file
                        $dbconf = include '/var/www/html/ServiceAndRepair/config/dbConfig.php';

//checks if fields are set.
                        if(isset($_POST['submit'])) {
                            if(
                            !empty($_POST['search_string'])
                            ) {
                                searchResolutions();
                            }
                        }

                        function searchResolutions() {                          
                            /*
* Grabs $dbconf and declares variables.
                            */
                            global $dbconf;
                            /*
* Grabs POST value.
                            */
                            $q = $_POST['search_string'];

                            /*
* Connect to db.
                            */
                            $con = mysql_connect($dbconf["host"], $dbconf["user"],$dbconf["password"]) ;
                            if (!$con) {
                                die('Could not connect: ' . mysql_error());
                            }

                            mysql_select_db($dbconf["db"], $con) or die ("Couldn't select the database.");

                            /*
* Search resolutions. Uses `mysql_real_escape_string()` as safeguard against SQL injection.
* Function `mysql_real_escape_string()` escapes special characters in a string for use in a SQL statement.
                            */
                            $result = mysql_query("
select
wc.caseid,
wc.resolution,
date(wc.resolved_on) resolved_on from resolution wc where lower(wc.resolution) like '%".mysql_real_escape_string(strtolower($q))."%' order by wc.caseid asc");

                            /*
* build output page.
                            */
                            $headerpage = '<html><head><title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
#mytable, #mytd
{
border-color: #600;
border-style: solid;
}
#mytable
{
border-width: 1px 1px 1px 1px;
border-spacing: 0;
border-collapse: collapse;
}
#mytd
{
margin: 0;
padding: 4px;
border-width: 1px 1px 0 0;
background-color: #FFC;
}
</style></head><body>';

                            echo $footerpage = '</body></html>';

                            echo $headerpage . '<table id="mytable"><thead>
<tr>
<th>ID</font></th>
<th>Resolution</font></th>
<th>Resolved On</font></th>
</tr></font></thead><tbody>';

                            while($row = mysql_fetch_array($result)) {

                                echo("<a target='_new'>".
                                        '<tr><td id="mytd">'
                                        . $row['caseid'] . '</td><td id="mytd">'
                                        . $row['resolution'] . '</td><td id="mytd">'
                                        . $row['resolved_on'] . '</td><td id="mytd">'
                                        . '</tr>'
                                        ."</a>    \n");

                            }

                            echo '</tbody></table>' . $footerpage;

                            mysql_close($con);
                        }?>
                    </p>
                </div>
            </div>
        </div>
    </body>
</html>

It is not 100% production ready but it is working like I want.

Sign In

Query results in different tabs?

Recommended Posts

kristo5747

Link to comment

Share on other sites

The Little Guy

Link to comment

Share on other sites

kristo5747

Link to comment

Share on other sites

The Little Guy

Link to comment

Share on other sites

kristo5747

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information