JavaScript Regex – Extract Extension from Filename
Posted by admin in JavaScript Regex on October 31, 2009
There are many times during web front-end development that you need to extract extension from filename using Regular Expression. One such time will be when you try to validate the image type when someone try to upload a photo. Below is an example of how to do so:
<html>
<head>
<title></title>
</head>
<body>
<form name="form1">
<input type="text" name="txtInput" />
<div id="lblResult"></div>
<script language="javascript">
function replace() {
document.getElementById('lblResult').innerHTML = ➥
document.form1.txtInput.value.replace(➥
/[^\\]+\\[^\\\/:*?\"<>|]+\.([^.\\\/:*?\"<>|]+)/, "$1");
}
</script>
<input type="button" name="btnSubmit" onclick="replace()" value="Go" />
</form>
</body>
</html>
| [^\\/:*?"<>|] | a character class that doesn’t match invalid filename characters . . . |
| + | found one or more times. |
| \. | a dot (.), escaped so it has literal meaning . . . |
| (?<ext> | a group named ext that contains . . . |
| [^.\\/:*?"<>|] | a character class that doesn’t match an invalid filename character or another dot (.) . . . |
| + | found one or more times . . . |
| ) | the end of the group. |
JavaScript Prevent mouseout Event Bubble
Posted by admin in JavaScript Library on October 30, 2009
When you assign an HTML element a mouseout event using JavaScript, and there are child element inside, once you move mouseover the inner child element, the parent mouseout event will trigger. To prevent this from happening, you could use jQuery’s mouseleave event handler. This is very very handy.
Here is a example you can save as a HTML and test:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){
var i = 0;
$("div.overout").mouseout(function(){
$("p:first",this).text("mouse out");
$("p:last",this).text(++i);
}).mouseover(function(){
$("p:first",this).text("mouse over");
});
var n = 0;
$("div.enterleave").mouseenter(function(){
$("p:first",this).text("mouse enter");
}).mouseleave(function(){
$("p:first",this).text("mouse leave");
$("p:last",this).text(++n);
});
});
</script>
<style>
div.out {
width:40%;
height:120px;
margin:0 15px;
background-color:#D6EDFC;
float:left;
}
div.in {
width:60%;
height:60%;
background-color:#FFCC00;
margin:10px auto;
}
p {
line-height:1em;
margin:0;
padding:0;
}
</style>
</head>
<body>
<div class="out overout"><p>move your mouse</p><div class="in overout"><p>move your mouse</p><p>0</p></div><p>0</p></div>
<div class="out enterleave"><p>move your mouse</p><div class="in enterleave"><p>move your mouse</p><p>0</p></div><p>0</p></div>
</body>
</html>
Empty Joomla! Forum PM-box
in the Joomla! forum, if your PM-box is full and nobody can send you anymore messages, there is a way to solve this. The solution is to go to your messages and “check” the box and click delete for those you want to delete. Do take note that you should read them first before you delete them!
Change Date Format in Joomla!
The date format information for Joomla! 1.5 and above is stored in the file <Joomla! home>/language/<your language>/<your language>.ini. For example, in English, it is <Joomla! home>/en-GB/en-GB.ini.
To change the date format, find and edit the values “DATE_FORMAT_LCx”. By default, the date is in international format (for example, Thursday, 31 January 2008 18:30). To change to standard US format (for example, Thursday, January 31, 2008, 06:30 PM), make the following changes:
DATE_FORMAT_LC=%A, %B %d, %Y DATE_FORMAT_LC1=%A, %B %d, %Y DATE_FORMAT_LC2=%A, %B %d, %Y %I:%M %p DATE_FORMAT_LC3=%B %d, %Y DATE_FORMAT_LC4=%m.%d.%y DATE_FORMAT_JS1=m-d-y %Y-%M-%D=%Y-%M-%D %A, %B %E=%A, %B %e
These are the formats for the time
%H:%M = 00:00 through 23:59 %k:%M = 0:00 through 23:59
%I:%M %P = 00:00 am through 23:59 pm (I = upercase i) %l:%M %P= 0:00 am through 23:59 pm (l = lowercase L)
(Note that %P will print the lowercase am/pm indicator for your locale, which may be blank.)
%I:%M %p = 00:00 AM through 23:59 PM (I = upercase i) %l:%M %p= 0:00 AM through 23:59 PM (l = lowercase L)
Set textarea Character Limit
Posted by admin in JavaScript Advanced on October 20, 2009
Unlike input tag which has a maxlength attribute for you to specify the maximum length (in characters) of an input field, in textarea, there is no such equivalent. To set textarea maximum length (character limit) in HTML, we need to use JavaScript.
Below is the simplest example of using onKeyDown event to set limit for the textarea:
<form>
<textarea onKeyDown="limitText(this,500);"></textarea>
</form>
<script>
function limitText(limitField, limitNum) {
if (limitField.value.length > limitNum) {
limitField.value = limitField.value.substring(0, limitNum);
}
}
</script>
Display RSS feed in Joomla!
Here are the steps to display RSS feed in your Joomla! site:
1. Go to extensions>>Module Manager
2. Find the Feed Display module
3. Enter the URL of the feed.
4. Save and display the module like any other module.
However there is a second way, which is to use the News Feeds component that comes with Joomla!
1. In the administrator go to components>>News Feeds
2. In the component you can manage your news feeds and assign them to categories.
3. To show the feeds on the front end make a component link in your menu.
Convert htaccess.txt into a .htaccess in Joomla!
Posted by admin in HTTP Server on October 19, 2009
When using PHP as an Apache module, you can change the configuration settings using directives in Apache configuration files (e.g. httpd.conf and .htaccess files). You will need “AllowOverride Options” or “AllowOverride All” privileges to do so. If you control your own Apache configuration, you can and should use httpd.conf. If you do not control your Apache configuration (such as on a shared hosting server), you must use .htaccess files.
Directions
1. First look for the file, htaccess.txt in your root directory. It should have been installed during the Joomla! installation. (Note that this file name does not begin with a dot.) Open and carefully read htaccess.txt. It contains important suggestions on how to protect your site.
2. Make any adjustments to this file as appropriate for your site, and then save it in your site’s home directory as, .htaccess including the dot.
3. Test your site’s front end and back end. If it produces errors, rename the file back to htaccess.txt, and troubleshoot your edits. If you are unable to get this working, you may have to leave the file named htaccess.txt.
4. Use phpinfo() to ensure that all configurations set as you intended. Note: Web-accessible files that include phpinfo() are potential security risks they offer attackers lots of useful information about your server. Always remove such files after use.
Joomla change favicon
Favicon is the favorites icon that is associated with your site and appears in the left of your browser address bar. Both Joomla! 1.0.x and 1.5.x come with a default favicon that displays the Joomla! Logo. You may change that as long as your new favicon is in the ICO format and sized 16×16 pixels. Here’s how to do it:
Unlike the 1.0.x versions, the only name you are allowed to use for your favicon is favicon.ico but you are offered the flexibility to associate different favicons with different templates. You only need to upload your favicon.ico into the main folders of your front-end and back-end templates, which are found in the /templates/ and the /administrator/templates/ folders respectively, overwriting any favicon files that came with your templates.
However, if you’d rather use a global favicon for all your templates themes, just upload it into Joomla!’s main folder (that’s where your index.php resides) and into the /administrator/ folder. Make sure you delete all favicon.ico files found in the template folders mentioned above because Joomla! will check your template folder first for the favicon.ico file.
Please take note that to see the new favicon you will need to empty your browser cache.
Joomla Put Module Inside Article
While using Joomla! to build a content management site, you may want to put module inside article in Joomla!
to associate modules with articles in some way. The modules are allocated to module positions and the module positions appear somewhere on the web page as determined by the template. However, it is sometimes useful to have a module actually embedded in the article content itself.
To insert a module inside an article you can use the “{loadposition xx}” command, as follows:
1. Create a module and set its position to any value that doesn’t conflict with an existing template position. You can type in the position value instead of selecting it from the drop-down list. For example, use the position “mypositionA”.
2. Assign the module to the Menu Items that contain the articles that you want the module to show in. You can also just assign the module to “All” Menu Items.
3. Edit the articles where you want this module to show and insert the text “{loadposition myposition}” in the article, at the place where you want the module to show.
The module will show at that point in the article.
Note that this method only works when the plugin ‘Content – Load Module’ is enabled. If this plugin is disabled, the text “{loadposition myposition}” shows unchanged in the article.
Joomla Block or Delete Super Administrator
If you try to delete or block a user who is a Super Administrator, you will get an error message saying “You cannot delete (block) a Super Administrator”. If you need to delete, block such a user, do it in two steps as follows:
In the User Manager, change the user’s group to something other than “Super Administrator”. For example, change the user to the “Registered” group. Press Save or Apply to save the change you have made.
As of 1.5.9, if the Super Administrator is already blocked (since 1.5.9 seems to not allow blocking a Super Administrator, this is probably an obscure case where the Super Administrator was blocked, then Joomla! upgraded) unblock him/her and Save. then demote the user, then…
Delete or block the user in the normal manner. To delete, select the user in the User Manager and press the Delete icon in the toolbar. To block the user, open the user for editing and set “Block User” to “Yes”.
Translator
By N2H
