news
RSS feed

Jquery: Form validation+Rounded Corners+List Items

This tutorial will teach you 4 things:

* How to apply rounded corners

* Form validation

* Passing variables into a list

* Customizing jquery plugins
Read more... | 28445 bytes more | 2 comments

Tutorial- Javascript+Jquery. A simple Beginning

In this tutorial I will teach you the basics of javascript with jquery. This tutorial is especially geared towards php developers who have been hesitant to venture into javascript.
The question that pops up most often is: why use javascript if I already have PHP? Well, because PHP is a server side language while javascript resides on the client. Actions that are tacky done on PHP, such as table sorting are a breeze on javascript. Mind you that I'm not advocating you drop PHP, on the contrary! If you combine PHP and javascript you can take your code to a whole different level. Let's start.
Before we start, a couple of requirements for this tutorial:
- Go to jquery.com and grab jquery-1.3.2.min.js This is the minified version of jquery. It's great to start learning with. When you are proficient with javascript you might want to get the full version to perform your own hacks.
- Go to getfirebug.com and download firebug.js This is a great development tool that allows you to debug javascript directly through firefox (I'm planning a tutorial just dedicated to this).
-An editor either wysiwyg or ide to change php/html/etc files.
-A local php server. If you are not running one, go check xampp or similar.

First create an empty file called: test.php Inside place this code:
<script language="javascript">
alert ("hello world");
</
script>

This will popup an alert box that says hello world! Now since we understand php, let's bring the two together. Replace all previous code with this:
<?php
$tst 
"my name is wally";
?>
<script language="javascript">
alert ("<?php echo $tst?>");
</script>

We have a php variable called $tst that get's passed into the alert box. Now let's bring in jquery and start making things more interesting. Replace all previous coe in file test.php with this:
<style type="text/css">
  
#box { background-color:#FFFF99; border:thin solid #FF0000; width:70%; height:50px;}
  
</style>
<
script type="text/javascript" src="firebug.js"></script>
  <
script language="javascript" src="jquery-1.3.2.min.js"></script>
<
script language="javascript">
  $(
document).ready(function() { //Finish loading the entire page before processing any javascript
  
$("#subBut").click(function(event) {
  var 
formContent = $("#form1").serialize();
  $(
"#box").load('myserv.php',formContent);
  });
  });
  </
script>
<
form name="form1" id="form1" method="post" action="">
  <
label>Name
  
<input type="text" name="textfield" id="textfield">
  </
label>
  <
input type="button" name="subBut" id="subBut" value="Submit">
  </
form>
  <
br />
  <
div id="box">Ajax call</div>

Now create another file called myserv.php and place this code inside:
<?php
echo "hello world! My name is " $_GET['textfield'];
?>

Now test it! What we are doing here is creating an ajax response to our initial test.php file. It takes the form data and passes it to myserv.php through $_GET. The good thing about using jquery $.serialize (found on line 6) is that it will grab all elements in a form. So, even if you add more later on, it will still grab them.
Now a line by line explanation of the javscript code:
Lines 4 and 5 load jquery and firebug
Line 7 All code inside this function only gets processed AFTER the entire page has loaded. This is especially important for us php developers since we have php code many times scattered along our pages.
Line 8 is an event function. Meaning, when an event happens, run the code inside. In this case the event is a "click" and it has been binded to selector "subBut" which is the submit button in our form. So, when someone presses the submit button, the code inside gets executed.
Line 9 is a great jquery function called $.serialize It grabs all form elements inside our form "form1" and correctly formats it to be sent using $_GET to our response page. In order for this to work I created a javascript variable called "formContent". this holds the formated data. NOTE: All variables in javascript must first be declared as such before being used.
Line 10 This is where jquery shines. A simple line that does so much! The selector in this case is a div with id "box". This is where the ajax response will be loaded into. load('myserv.php',formContent) will send the content of our javascript variable "formContent" to the page myserv.php which processes the information then sends back a response.

This is a simple tutorial to get you started. I have more on the way :)
Read more... | 3 comments

Xoops-Miniservers (portable localhost development)

The Xoops-Miniservers Project provides WAMP mini-servers (Apache + MySql + Php to Windows) with the CMS XOOPS (Content Management System Xoops) already installed and ready to user's customizes.

Resized Image


The miniservers available (until now) are:

EasyPHP

Lighty2Go

Mowes

Pampa

Server2Go

Uniform

Xampp (lite)



Main features:

Index page (welcome) integred to Xoops directory and documentation (docs, on these versions, incomplete).

Xoops 2.3.3 already installed and configured.

Admin Modules package already installed and configured: Altsys 0.7, Avaman 0.21, Backpack 0.93, Contact 1.6 (with captcha), Membership 2.3, Mysearch 1.1 (with bugfix), Xoopscare 1.3, Xoopsmembers 1.1 and XT-Temas 1.0.

Blog package already installed and configured: Mastop Publish 1.1 (with bugfix to Xoops 2.3.3) and AMS 2.51 final.

Custom server generated directory indices (with Snif - simple and nice index file).

Apanel servers, phpMyadmin, Xoops and modules translated into portuguese (of Brasil).

All servers are portable.

Change logs, allowing easy upgrade and expansion of translations.


Download: http://code.google.com/p/xoops-miniservers/



The Xoops-Miniservers Team
Read more... | 8 comments

Translation tool : Xtranslate

Resized Image

www.Designburo.nl is pretty proud to present a contribution to the XOOPS community: Xtranslate!
A (windows) tool that should help you translate XOOPS and XOOPS modules into your own language much easier.

It is still in development, but the current version is very useable!

Get it here! (You do need to register, but hey.. its free!)
Read more... | 7 comments

Change the Web Challenge!

Resized Image

We would like to encourage all XOOPS developers to participate in the "Change the Web Challenge"

Social Actions' Change the Web Challenge is about building innovative tools to help people find and share opportunities to take action on the websites, blogs, and social networks that we all visit everyday.

This sounds like a good opportunity for a XOOPS Module

Check out the Developer Resources for their Social Actions API that you could use.

The Grand Prize is $5,000 with total of $10,000 in cash prizes, but the real prize is the impact your module might have an changing the world.

The submission deadline is Fri, April 3, 2009

Click here for all the details.

And please keep us posted, if you decide to participate.
Read more... | 2 comments

Documentation on the Api of the Xoops modules

I love

Dev.XooFoo.org, the website for API documentation for modules developers, recently has been changed and updated:

  • to make more ergonomic navigation of the XOOPS Core API generated by Doxygen and by PhpXref,
  • to add list of international support sites,
  • to add links to XooFoo websites.

A second stage has just been finalized with the API documentation of forty modules: AMS, Article 1 and 2, Catads, Cbb 3.0.8 et 4.0, Classifieds, Content, Cryptox, D3pipes, Extcal, Formulize, Liaise, Membership, MPmanager, Multimenu, Mylinks, Mydownloads, Mytabs, News, Pical, PM, Profile, ShoutBox, Tag, Umfrage, Userpoints, Xbs Modgen & Xbs Cdm, Xcake, Xcenter, Xforum, Xgen, Xhld, Xoopscare, Xoopsinfo, Xoopspoll, Xreaggregator, Xsoap, Xtorrent and Yogurt.

This first list will be completed in the next few weeks based on new modules releases/updates, or based on specific requests from users and/or developers.

The goal of this documentation is also to promote the development of new modules. After all, what could be easier than to look at existing modules to see how they've been architectured, which class or function were used ...

All this documentation can be downloaded in e-book (in chm format) on Tutos XooFoo in the section "Outils - Documentation - Xoops".

Read more... | 6 comments

New Module Logo design for XOOPS 2.3

In preparation for XOOPS 2.3 release, we're changing the Module Logo design.

As mentioned in our WOX Newsletter #10, our XOOPS Friends in Spain Eme3Design developed a new look for the standard Admin Theme (see here...).

We liked the idea a lot, so we've decided to follow it and change the logos for the XOOPS 2.3 release as well, but with a blue color. We believe that the new design makes them look more modern, professional, and hip

Resized ImageResized ImageResized Image

We would like to see all the XOOPS modules that have been successfully tested for XOOPS 2.3, to change their logos to the new look, so our users know that a particular module will work in 2.3.

If you have Photoshop, you can also use this Photoshop file to make your logos for XOOPS 2.3.

FYI - We've used images from Crystal Project

Please maintain the XOOPS 2.3 "look & feel" of the logos.

Some of the modules logos could look like this:

Resized Image Resized Image Resized Image Resized Image
Resized ImageResized ImageResized Image Resized Image
Of course, it's up to the module designers to finalize their module's logos, but we hope that the logos will share similar look and feel with XOOPS logos.

As always, we're looking for talented graphic designers to help us and those module developers, who might not be so good in graphics design.

And congratulations to Eme3Design for their great design ideas!
Read more... | 34 comments

Heads up: XOOPS is on Usenet!! :-v

I have some great news for xoops for all the team and people involved, we now have our own complete section in UseNet, if you are wondering what UseNet is you may have at one point seen something like google tunneling you into a group like alt.topics or sci.facility or even soc.something this isn't actually google it is UseNet. Back in the BBS days Usenet was still there. Before TCP/IP was around it use to run on Netbeui and Netbios with it domain lookup and so on running over Netbios and sydnicate with various tiers of services using something similar to a push data system.

You may remember something like fido net (fido7) and so on all BBS' this was all syndicated through UseNet. It is a great honor to be accepted as a project on some of the oldest and often picky infrastructure like UseNet, only the big company in there Omni global instantiations are available on UseNet (Newgroups) like Microsoft or Novell and so on.

If you have a suggestion and as well would like your Support Site on the xoops UseNet abstraction then please contact me I will have it added, remember this is a fantasic addition to their network, you don't find any other CMS or Portal system like Joomla or Drupal or any of the ASP one even mentioned in there. UseNet was the basis of old day forum systems, it is what forum and blogging systems have been modeled on.

The groups currently:


xoops
xoops.announce
xoops.modules
xoops.team.advisors
xoops.team.core
xoops.team.design
xoops.team.documentation
xoops.team.modules
xoops.team.quality.assurance
xoops.team.support
xoops.themes


You will notice in the next couple of days thought the immense networking in UseNet you will see this in your browser.

Resized Image

I will be soon writing a UseNet Syndicator that with a Cron allows you to syndicate your site, ie. News (announces), Forum topics and so on with Usenet and back from Usenet as well.

I was wondering what people think about doing this as well like groups for this:

xoops.support.france
xoops.support.spain
xoops.support.norway
...


For our international support sites, I haven't done this initially as there is no quick point and click solution to the syndication but soon there will be.

Look forward to hearing about your responses.
Read more... | 5 comments

Nat Sakimura joins the XOOPS Developement Team

We are very happy to announce that Nat Sakimura, is officially joining the XOOPS Development Team.

Resized Image

Nat Sakimura is the author for XOOPS OpenID module, and he will be implementing OpenID into XOOPS core for XOOPS 2.3* or 2.4, perhaps with another XOOPS core developer, while DJ will be working with him to implement OpenID into XOOPS 3.0

You can download the OpenID module from here...

Please extend a warm "welcome back" to Nat Sakimura.

With this we would like to officially extend an invitation to all past, non-active XOOPS developers to come back and join us on the journey of making XOOPS the best CMS in the world. We are sure that while you were away, you've learned a lot of new things and programming tricks, from which XOOPS could benefit. We've had couple of rough years, but we believe that we are now on track to something really awesome, and we would like you to be part of it.

There will be more exciting news coming....
Read more... | 11 comments
« 1 2 (3) 4 5 6 ... 11 »