9lessons Programming Blog - Tutorials about Angular, ReactJS, PHP, MySQL and Web Development
Friday, March 13, 2009

Submit Checkbox values in Form with javascript

This post explains how to submit Check box values in form. Example mail-box selected mails deletion. I had experimented with javascript support.

In this script Checkbox values store in hidden field name store_del. In demo it was a text field.

Monday, March 09, 2009

Twitter Like Flash Message with jQuery.

I like Twitter API method displaying information message in flash style. I had developed a small web application like twitter flash message using jQuery. It's useful and simple just enrich your web projects.

Twitter information message.
Thursday, March 05, 2009

Perfect Javascript Form Validation using Regular Expressions.

I had designed a perfect form validation using javascript regular expression. Simple code and works perfect in all conditions. It's very useful and supporting all the web browsers just take a look at post live demo.

Server Side Form Validation using Regular Expressions

Monday, March 02, 2009

Clean User Interface CSS Tips

So in this post i want to explain how to design a clean user interface using CSS (Cascading Style Sheets). It's useful to make your web pages more simple and neat.

Better than images to use CSS buttons the web page download faster.
CSS Buttons
Monday, February 23, 2009

Backup your Web Projects Database using MySQL Administrator.

Some days back I had posted an article about MySQL WorkBench Usage. So in this post I want to explain how to take backup your database using MySQL Administrator. It's a part of MySQL GUI Tools.

It's very easy to use and using this we can take backup and restore web projects database.



Wednesday, February 18, 2009

Awesome Vector Graphics Flash Movies List.

Are you looking for nice flash vector graphics movies. Take a look at this post you feel relax. I hope you like this sites.

First you have to enable flash player plugin.



aBowman
Fish gadget - Click on the movie and give food. link .

Orange Orage Company Website - link
Suilen.net Graphic designer profile presentation. link
Jonathanyuen.com Art and design presentation.
27bobs Flash tutorials and smooth real graphics link
Bugzilla.mozilla.org I found this rich gif image in buzill.mozilla.org. Eating mozill browsers bugs.

If you know any inserting flash website links just post a comment.
Monday, February 16, 2009

Auto Scrolling Effect with javascript and DHTML.

Take a look at this post a nice auto scrolling effect using javascript and dynamic HTML. It's useful to display your website headlines and latest news . Just you have to do very few modifications.

Watch this demo.
Live Demo


Download Script     Live Demo

Add these three javascript files within the tag HEAD of the page.
<script language="javascript" src="js/dhtmllib.js"></script>
<script language="javascript" src="js/scroller.js"></script>
<script language="javascript" src="js/mydata.js"></script>

Demo.html
Contains javascript and HTML code. Div tag id placeholder to present your data.
<script language="javascript">
function runmikescroll() 
{
  var layer;
  var mikex, mikey;
  // Locate placeholder layer so we can use it to 
  // position the scrollers.
  layer = getLayer("placeholder");
  mikex = getPageLeft(layer);
  mikey = getPageTop(layer);
  // Create the first scroller and position it.
  myScroller1.create();
  myScroller1.hide();
  myScroller1.moveTo(mikex, mikey);
  myScroller1.setzIndex(100);
  myScroller1.show();
}
window.onload=runmikescroll
</script>

<DIV id="tempholder"></DIV>
<DIV id="placeholder"></DIV>

mydata.js
Add headlines in mydata.js. Include your HTML tags inadditem(" ")

var myScroller1 = new Scroller(0, 0, 385,130, 0, 0);
//(xpos, ypos, width, height, border, padding)

myScroller1.addItem(" <span><h3>Scrolling Data 1</h3></span> ");
myScroller1.addItem(" <span><h3>Scrolling Data 2</h3></span> ");
myScroller1.addItem(" <span><h3>Scrolling Data 3</h3></span> ");

myScroller1.setPause(2000);
//set pause beteen msgs, in milliseconds

Download Script     Live Demo

Note : Best view open with Firefox and Safari brower.
Thursday, February 12, 2009

Displaying RSS Feed with PHP

This article explains to displaying RSS(XML format) feed like popurls.com (popular urls in one place) using simplexml_load_file() a PHP function. It's very useful to display your blog feeds as like Recent articles(headlines) list.

RSS- Really Simple Syndication.

Reading XML data and presenting with HTML.

Download Script     Live Demo

Index.php RSS display page:
File contains HTML tags and PHP included rssclass.php. You have to change the RSS feed URL.
<div>
  <?php
  include('rssclass.php');
  $feedlist = new rss('http://feeds2.feedburner.com/9lesson');
  echo $feedlist->display(9,"9lessons");
 
  $feedlist = new rss('http://feeds.feedburner.com/nettuts');
  echo $feedlist->display(9,"Nettuts");
 
  $feedlist = new rss('http://feeds.labnol.org/labnol');
  echo $feedlist->display(9,"Labnol");
  ?> 
  </div>
Popurls.com screen shot

rssclass.php
A beautiful PHP function simplexml_load_file() to load and read XML file. simplexml_load_string() XML string reader.
<?php
 class rss {
     var $feed;

  function rss($feed) 
    {   $this->feed = $feed;  }
 
  function parse() 
    {
    $rss = simplexml_load_file($this->feed);
    
    $rss_split = array();
    foreach ($rss->channel->item as $item) {
    $title = (string) $item->title; // Title
    $link   = (string) $item->link; // Url Link
    $description = (string) $item->description; //Description
    $rss_split[] = '<div>
        <a href="'.$link.'" target="_blank" title="" >
            '.$title.' 
        </a>
   <hr>
          </div>
';
    }
    return $rss_split;
  }
  function display($numrows,$head) 
  {
    $rss_split = $this->parse();

    $i = 0;
    $rss_data = '<div class="vas">
           <div class="title-head">
         '.$head.'
           </div>
         <div class="feeds-links">';
    while ( $i < $numrows ) 
   {
      $rss_data .= $rss_split[$i];
      $i++;
    }
    $trim = str_replace('', '',$this->feed);
    $user = str_replace('&lang=en-us&format=rss_200','',$trim);
    $rss_data.='</div></div>';
    return $rss_data;
  }
}
?>

CSS code :
Style just view the Live Demo
.vas{
    float:left;
    width:270px;
    padding:10px;
}
.title-head {
    font-size:18px;
    font-weight:bold;
    text-align:left;
    background-color:#006699;
    color:#FFFFFF;
    padding:5px;}
.feeds-links {
    text-align:left;
    padding:5px;
    border:1px solid #dedede;
 }
Download Script     Live Demo
Thursday, February 05, 2009

SMTP Feedback Mail class with jQuery Slide Effect.

This post about feedback mail with nice slide effect using php SMTP class and jQuery. It's very useful to add your php websites as like contact/feedback page.
I have downloaded this SMTP class from phpclasses.org. Include with jQuery Slide effect just you have to upload these files into hosting server.

Feedback page with slide effect.


Download Script     Live Demo

You have to add this jquery script in feedback.php:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/
1.3.0/jquery.min.js">type="text/javascript" </script>
 
<script type="text/javascript">
$(document).ready(function(){
 
 $(".button-slide").click(function(){

  $("#board").slideToggle("slow");
  $(this).toggleClass("active"); return false;

 });
  
});
</script>
feedback.php
Contains simple PHP and HTML script. You have to change feedback email id.
<?php
require ("smtpclass.php");
if($_SERVER["REQUEST_METHOD"] == "POST")
 {
$smtp=new SMTPMAIL;

$from=$_POST['email']; 
$body=$_POST['msg']; 
$to="Admin<[email protected]>";

$cc="";
$subject="Feedback Mail";
 
  if(!$smtp->send_smtp_mail($to,$subject,$body,$cc,$from))

 $error="Error in sending mail!<BR>Error: ".$smtp->error;
  else
 $report="Mail sent succesfully!";
}
?>
<div style="display: none;" id="board" align="center"><br />
<form id="form1" name="form1" method="post" action="">

  Your Email : <input type="text" name="email" size="25"/>
  Message :<textarea name="msg"  rows="5" cols="23"></textarea>

  <input type="submit" value=" Send " />
  <?php echo $report; echo $error; ?>

  </form></div>
<div align="center"><a href="#" class="button-slide">
Feedback </a></div>

SMTPclass.php
Upload this file into your hosting space. No need to touch this code it's automatically detects your website SMTP mail address.

Download Script

CSS Code :
Include this CSS code in feedback.php.
#board {
  background:#dedede;
 height: 205px;display: none;
  width: 300px;border-bottom: solid 4px #006699;
  position:absolute;
 }
.button-slide {
 text-align: center;background-color:#006699;
  width: 94px;height: 21px;
  padding: 6px 6px 0 0;margin: 0 auto;display: block;
  font: bold 120%/100% Arial, Helvetica, sans-serif;
  color: #fff;text-decoration: none;
 position:fixed;
}
Download Script     Live Demo
Note : I was hosting my demos is 110mb.com. Its a free php hosting area they are not providing any SMTP support.


Related Post :
Delete a Record with animation fade-out effect using jQuery and Ajax.
Twitter Like Flash Message with jQuery.
Perfect Javascript Form Validation using Regular Expressions.
Analyzing URLs as Links to the resource using a PHP function.
Exactly Twitter like Follow and Remove buttons with jQuery and Ajax
mailxengine Youtueb channel
Make in India
X