Web Developers Portal

Wednesday 11 April 2012

Table sorting in php using javascript?

The below example sort the table using java script. you can populate the table data from database using php.
You need to create 2 folders css and js. put the table.css in css folder and table.js in js folder.
copy paste the below code and save it as sort.php and put it in pages folder.

Download table.js and table.css

<html>
<head>
    <meta charset="UTF-8" />
    <title>Php table sort</title>
    <link rel="stylesheet" type="text/css" href="../css/table.css" />
    <script src="../js/table.js" type="text/javascript"></script>
</head>
<?php
error_reporting(0);
$con = mysql_connect("localhost","root","");
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("genedb", $con);
$sql="SELECT * FROM gene";

$result = mysql_query($sql);
    ?>
    <div id="content">
    <div id="blog">
        <div id="articles" style="width:692px;padding:0;">
<table width="250" border="1" class="example table-autosort table-autofilter table-autopage:10 table-stripeclass:alternate table-page-number:t1page table-page-count:t1pages table-filtered-rowcount:t1filtercount table-rowcount:t1allcount" id="t1">
<thead>
    <tr style="height:35px">
        <th class="table-sortable:default table-sortable table-sorted-desc">Symbol</th>
        <th class="table-sortable:numeric table-sortable " title="Click to sort">Id</th>
        <th class="table-filterable table-sortable:default table-sortable" title="Click to sort">Location</th>
        </tr>
</thead>
<tbody>
    <?php
    while($row = mysql_fetch_array($result))
{
    ?>
<tr>
<td><?php echo $row['symbol']?></td>
<td><?php echo $row['id']?></td>
<td><?php echo $row['location']?></td>
<?php
}
mysql_close($con);
?>
</tbody>
<tfoot>

    <tr>
        <td style="cursor:pointer;" class="table-page:previous">< < Previous</td>
        <td style="text-align:center;" colspan="1">Page <span id="t1page">1</span> of <span id="t1pages">11</span></td>
        <td style="cursor:pointer;" class="table-page:next">Next > ></td>
    </tr>
    <tr>
        <td colspan="3"><span id="t1filtercount">105</span> of <span id="t1allcount">105</span> rows match filter(s)</td>
</tr></tfoot>
</table>

Output :

technorati claim code :A8CRZ8P6MW44

Thursday 5 April 2012

Get the value of t:inputCalendar if readonly is true

<t:inputCalendar id="cal" value="#{backingBean.date1}"
renderAsPopup="true"
popupDateFormat="MM/dd/yyyy"
popupTodayDateFormat="dd-MMM-yyyy"
popupWeekString="Week"
popupTodayString="The date today is :"
renderPopupButtonAsImage="true"
helpText="MM/DD/YYYY"
readonly="true"/>

To get the value in the backing bean just add the below code.
When readonly attribute is true, the component cannot be edited by the user.(ie the text box in the calendar cannot be edited.)

bodyId:id of body tag
formId:id of form tag
String dateString = (String) getExternalContext().getRequestParameterMap().get("bodyId:formId:date1");

SimpleDateFormat dateFormat = new SimpleDateFormat("MM/dd/yyyy",
getCurrentLocale());

Wednesday 4 April 2012

How to Wrap text in a cell of a html table?

Normally wrapping of text happens automatically in HTML tables.But if the text contains no delimiters(like "Thisisatext" instead of "This is a Text"), word wrapping does not happens.

Below code works even if there is no delimiters in the text.

<table width="700" style="table-layout:fixed" align="left">
<tr>
<td style="word-wrap: break-word;">
</td>
</tr>
</table>

Thursday 29 March 2012

How to change the apache port for xampp?

By default, Apache Server listens on port 80.
But if that port is already being used by some other application and you dont want to stop that application
or port 80 is blocked by your network admin, you have to change the port of Xampp.

To change it follow the steps:

1. Stop the xampp server, if it is already running.
2. Go to folder "C:\xampp\apache\conf". (By default apache is installed in C folder)
3. Open the file httpd.conf.
4. Search the string "Listen" in the file.
5. Replace port number 80 to any other unused port number.
6. Search for "ServerName" in the file.
7. Replace port number 80 to any other unused port number in the ServerName.
8. Save the httpd.conf.
9. Start the xampp server.

Thursday 22 March 2012

Dynamic Menu Highlighting using php and CSS

The below example explains making a navigation menu that dynamically
highlights the currently displayed page using php and css

It is better to use a common navigation menu file on the site rather than repeating same code on all the pages.
The reason is that if the menu items change ,we can easily modified a single file rather than changing all the files.

In the navigation menu file (say navigationMenu.php) add the below code

   <div id="menu">
    <?php
    $active[$currentPage] = " class=active";                //dont forget to put space infront of class
    ?>
    <ul>
        <li <?php echo $active[1] ?>><a href="newfile1.php" id="index">HOME</a></li>
    <li <?php echo $active[2] ?>><a href="newfile2.php">CONTACT US</a></li>
        <li <?php echo $active[3] ?>><a href="newfile3.php">LINKS</a></li>
        <li <?php echo $active[4] ?>><a href="newfile4.php">TEAM</a></li>
    </ul>
   </div>

In the CSS add

#menu a:hover, #menu .active a {
    background-color: red;
    color: #5A5A5A;
    display: normal;
    letter-spacing:1px;
    font-size: 11px;

}

In the individual pages (say contactus.php) add

<?php
$currentPage = 2;
include 'index.php';
?>

Demo : Clicking CONTACT US link

Thursday 15 March 2012

ImportError: No module named BeautifulSoup

To fix this issue

1. Download BeautifulSoup from
   http://www.crummy.com/software/BeautifulSoup/#Download

2. Extract it into a folder

3. Copy the BeautifulSoup.py in BeautifulSoup folder into a directory that's on your Python path
   eg:
      unix: /usr/local/lib/python2.2/site-packages
      Windows: C:\Python24\Lib\site-packages.

ImportError: No module named mechanize

1. Download mechanize from
http://wwwsearch.sourceforge.net/mechanize/src/

2. Extract it into a folder

3. copy the whole mechanize directory into a directory on your Python path
eg:
unix: /usr/local/lib/python2.4/site-packages
Windows: C:\Python24\Lib\site-packages
Only copy the mechanize directory that's inside the distributed tar / zip archive, not the
entire mechanize-x.x.x directory!