<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>JavaScript Archives - ubuntu|dog</title>
	<atom:link href="https://ubuntudog.com/category/javascript/feed/" rel="self" type="application/rss+xml" />
	<link>https://ubuntudog.com/category/javascript/</link>
	<description>Knowledge is power</description>
	<lastBuildDate>Fri, 20 Dec 2024 22:25:16 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.7.1</generator>

<image>
	<url>https://media.ubuntudog.com/2019/11/cropped-favicon-32x32.png</url>
	<title>JavaScript Archives - ubuntu|dog</title>
	<link>https://ubuntudog.com/category/javascript/</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Generate API Reference documentation</title>
		<link>https://ubuntudog.com/generate-api-reference-documentation/</link>
		
		<dc:creator><![CDATA[dean]]></dc:creator>
		<pubDate>Thu, 22 Dec 2022 02:12:28 +0000</pubDate>
				<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[Linux]]></category>
		<category><![CDATA[Ubuntu]]></category>
		<guid isPermaLink="false">https://ubuntudog.com/?p=273</guid>

					<description><![CDATA[<p>Follow those steps to generate API Reference documentation from a JSON file.</p>
<p>The post <a href="https://ubuntudog.com/generate-api-reference-documentation/">Generate API Reference documentation</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p>Follow those steps to generate API Reference documentation from a JSON file.</p>



<ol class="wp-block-list">
<li>Download latest API reference as JSON file from desired platform</li>



<li>Convert it to yaml for easier modificatoin and convert it back to json file</li>



<li>Download Swagger UI https://github.com/swagger-api/swagger-ui/releases</li>



<li>Copy the contents of the /dist folder to your server and modify index and js file</li>
</ol>
<p>The post <a href="https://ubuntudog.com/generate-api-reference-documentation/">Generate API Reference documentation</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>How to remove front page title for Thematic theme in WordPress?</title>
		<link>https://ubuntudog.com/how-to-remove-front-page-title-for-thematic-theme-in-wordpress/</link>
		
		<dc:creator><![CDATA[dean]]></dc:creator>
		<pubDate>Sun, 24 Nov 2019 20:51:04 +0000</pubDate>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[WordPress]]></category>
		<guid isPermaLink="false">http://ubuntudog.com/?p=161</guid>

					<description><![CDATA[<p>Have you ever wanted to remove the title only for front page in WordPress? Are you using Thematic theme? Than I have good news for you. Use this function to remove the title only on the first page of your Thematic theme in WordPress: Code: function remove_front_pagetitle($posttitle) { if ( is_front_page() ) { $posttitle = ... <a title="How to remove front page title for Thematic theme in WordPress?" class="read-more" href="https://ubuntudog.com/how-to-remove-front-page-title-for-thematic-theme-in-wordpress/" aria-label="Read more about How to remove front page title for Thematic theme in WordPress?">Read more</a></p>
<p>The post <a href="https://ubuntudog.com/how-to-remove-front-page-title-for-thematic-theme-in-wordpress/">How to remove front page title for Thematic theme in WordPress?</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></description>
										<content:encoded><![CDATA[<p>Have you ever wanted to remove the title only for front page in WordPress? Are you using Thematic theme? Than I have good news for you. Use this function to remove the title only on the first page of your Thematic theme in WordPress:</p>
<p class="code_header">Code:</p>
<blockquote>
<div class="code">function remove_front_pagetitle($posttitle) {<br />
if ( is_front_page() ) {<br />
$posttitle = &#8221;;<br />
}<br />
return $posttitle;<br />
}<br />
add_filter(&#8216;thematic_postheader_posttitle&#8217;, &#8216;remove_front_pagetitle&#8217;);</div>
</blockquote>
<p>The code above should be put in functions.php<br />
You can paste it in the bottom of the functions-file.</p>
<p>The post <a href="https://ubuntudog.com/how-to-remove-front-page-title-for-thematic-theme-in-wordpress/">How to remove front page title for Thematic theme in WordPress?</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>OpenCart: How to move search field to top menu (content_top.tpl)</title>
		<link>https://ubuntudog.com/opencart-how-to-move-search-field-to-top-menu-content_top-tpl/</link>
		
		<dc:creator><![CDATA[dean]]></dc:creator>
		<pubDate>Sun, 24 Nov 2019 20:42:34 +0000</pubDate>
				<category><![CDATA[General]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[OpenCart]]></category>
		<guid isPermaLink="false">http://ubuntudog.com/?p=153</guid>

					<description><![CDATA[<p>Please read this article to learn how to easy move search field to another part of your page. In my case I will move it to my custom menu. First you need to copy the code for the search form from: /catalog/view/theme/-yourtheme-/template/common/header.tpl Code: &#60;div id=&#8221;search&#8221;&#62; &#60;div class=&#8221;button-search&#8221;&#62;&#60;/div&#62; &#60;?php if ($filter_name) { ?&#62; &#60;input type=&#8221;text&#8221; name=&#8221;filter_name&#8221; ... <a title="OpenCart: How to move search field to top menu (content_top.tpl)" class="read-more" href="https://ubuntudog.com/opencart-how-to-move-search-field-to-top-menu-content_top-tpl/" aria-label="Read more about OpenCart: How to move search field to top menu (content_top.tpl)">Read more</a></p>
<p>The post <a href="https://ubuntudog.com/opencart-how-to-move-search-field-to-top-menu-content_top-tpl/">OpenCart: How to move search field to top menu (content_top.tpl)</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></description>
										<content:encoded><![CDATA[<p>Please read this article to learn how to easy move search field to another part of your page. In my case I will move it to my custom menu. First you need to copy the code for the search form from: <strong>/catalog/view/theme/-yourtheme-/template/common/header.tpl</strong></p>
<p class="code_header">Code:</p>
<blockquote>
<div class="code">
&lt;div id=&#8221;search&#8221;&gt;<br />
&lt;div class=&#8221;button-search&#8221;&gt;&lt;/div&gt;<br />
&lt;?php if ($filter_name) { ?&gt;<br />
&lt;input type=&#8221;text&#8221; name=&#8221;filter_name&#8221; value=&#8221;&lt;?php echo $filter_name; ?&gt;&#8221; /&gt;<br />
&lt;?php } else { ?&gt;<br />
&lt;input type=&#8221;text&#8221; name=&#8221;filter_name&#8221; value=&#8221;&lt;?php echo $text_search; ?&gt;&#8221; onclick=&#8221;this.value = &#8221;;&#8221; onkeydown=&#8221;this.style.color = &#8216;#000000&#8217;;&#8221; /&gt;<br />
&lt;?php } ?&gt;<br />
&lt;/div&gt;</div>
</blockquote>
<p>Now I will paste this code in my content_top.tpl file located in the same directory as header.tpl</p>
<p>Open up header.php that is located in <strong>/catalog/controller/common/ directory</strong><br />
and copy these code lines:</p>
<p class="code_header">Code:</p>
<blockquote>
<div class="code">
$this-&gt;language-&gt;load(&#8216;common/header&#8217;);<br />
$this-&gt;data[&#8216;text_search&#8217;] = $this-&gt;language-&gt;get(&#8216;text_search&#8217;);<br />
if (isset($this-&gt;request-&gt;get[&#8216;filter_name&#8217;])) {<br />
$this-&gt;data[&#8216;filter_name&#8217;] = $this-&gt;request-&gt;get[&#8216;filter_name&#8217;];<br />
} else {<br />
$this-&gt;data[&#8216;filter_name&#8217;] = &#8221;;<br />
}</p>
</div>
</blockquote>
<p>Paste these lines into the file <strong>/catalog/controller/common/content_top.php </strong>under public function index(). Just paste it below the line 10 or 11.</p>
<p>Copy now language variable for the input search text to the right language file.</p>
<p>Copy variable <span class="_b">$_[&#8216;text_search&#8217;] = &#8216;Search&#8217;;</span> from /language/-yourlangugage-/common/header.php to /language/-yourlangugage-/yourlanguage.php</p>
<p>The last thing we need to make is to copy js function that will post our search. Your search field is for sure not placed in the #header at this time so we need to copy function from /catalog/view/javascript/common.js and rename it.</p>
<p>Copy and paste this function into the same js file and don&#8217;t forget to rename #header according to your div&#8217;s/container&#8217;s ID (#example) or class (.example).</p>
<p class="code_header">Code:</p>
<blockquote>
<div class="code">
$(&#8216;#header input[name=&#8217;filter_name&#8217;]&#8217;).keydown(function(e) {<br />
if (e.keyCode == 13) {<br />
url = $(&#8216;base&#8217;).attr(&#8216;href&#8217;) + &#8216;index.php?route=product/search&#8217;;<br />
var filter_name = $(&#8216;input[name=&#8217;filter_name&#8217;]&#8217;).attr(&#8216;value&#8217;)</p>
<p>if (filter_name) {<br />
url += &#8216;&amp;filter;_name=&#8217; + encodeURIComponent(filter_name);<br />
}</p>
<p>location = url;<br />
}<br />
});</p></div>
</blockquote>
<p>My div container looks like this &lt;div id=&#8221;example&#8221;&gt;&#8230;.search field code&#8230;&lt;/div&gt; so my javascript function for submitting the search form will look like this:</p>
<p class="code_header">Code:</p>
<blockquote>
<div class="code">
$(&#8216;#example input[name=&#8217;filter_name&#8217;]&#8217;).keydown(function(e) {<br />
if (e.keyCode == 13) {<br />
url = $(&#8216;base&#8217;).attr(&#8216;href&#8217;) + &#8216;index.php?route=product/search&#8217;;<br />
var filter_name = $(&#8216;input[name=&#8217;filter_name&#8217;]&#8217;).attr(&#8216;value&#8217;)</p>
<p>if (filter_name) {<br />
url += &#8216;&amp;filter;_name=&#8217; + encodeURIComponent(filter_name);<br />
}</p>
<p>location = url;<br />
}<br />
});</p></div>
</blockquote>
<p>I hope you enjoyed this article 😉</p>
<p>The post <a href="https://ubuntudog.com/opencart-how-to-move-search-field-to-top-menu-content_top-tpl/">OpenCart: How to move search field to top menu (content_top.tpl)</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Make username field active when entering the admin login page</title>
		<link>https://ubuntudog.com/make-username-field-active-when-entering-the-admin-login-page/</link>
		
		<dc:creator><![CDATA[dean]]></dc:creator>
		<pubDate>Sun, 24 Nov 2019 20:39:12 +0000</pubDate>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[OpenCart]]></category>
		<guid isPermaLink="false">http://ubuntudog.com/?p=151</guid>

					<description><![CDATA[<p>OpenCart already uses jquery so all you need to is to pass focus() function to input username to make it focus on the username field. Here is how to do it. Open the following file in your favorite php editor: /admin/view/template/common/login.tpl and copy/paste this code: Code: $(document).ready(function() { $(&#8220;input[name=username]&#8221;).focus(); });</p>
<p>The post <a href="https://ubuntudog.com/make-username-field-active-when-entering-the-admin-login-page/">Make username field active when entering the admin login page</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></description>
										<content:encoded><![CDATA[<p>OpenCart already uses jquery so all you need to is to pass focus() function to input username to make it focus on the username field. Here is how to do it. Open the following file in your favorite php editor:<br />
<span class="_b">/admin/view/template/common/login.tpl</span></p>
<p>and copy/paste this code:</p>
<p class="code_header">Code:</p>
<blockquote>
<div class="code">$(document).ready(function() {<br />
$(&#8220;input[name=username]&#8221;).focus();<br />
});</div>
</blockquote>
<p>The post <a href="https://ubuntudog.com/make-username-field-active-when-entering-the-admin-login-page/">Make username field active when entering the admin login page</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Facebook custom share button</title>
		<link>https://ubuntudog.com/facebook-custom-share-button/</link>
		
		<dc:creator><![CDATA[dean]]></dc:creator>
		<pubDate>Sun, 24 Nov 2019 20:31:35 +0000</pubDate>
				<category><![CDATA[JavaScript]]></category>
		<guid isPermaLink="false">http://ubuntudog.com/?p=145</guid>

					<description><![CDATA[<p>Here is en example code on how to make a custom facebook share button. Code: &#60;script&#62;function fbs_click() {u=location.href;t=document.title;window.open(&#8216;https://www.facebook.com/sharer.php?u=&#8217;+encodeURIComponent(u)+&#8217;&#38;t;=&#8217;+encodeURIComponent(t),&#8217;sharer&#8217;,&#8217;toolbar=0,status=0,width=626,height=436&#8242;);return false;}&#60;/script&#62;&#60;a href=&#8217;https://www.facebook.com/share.php?u=&#60;url&#62;&#8217; onclick=&#8217;return fbs_click()&#8217; target=&#8217;_blank&#8217;&#62;&#60;img src=&#8217;SOURCE_TO_YOUR_IMAGE&#8217; alt=&#8217;facebook&#8217; title=&#8217;Share on facebook&#8217; /&#62;&#60;/a&#62;&#60;/script&#62;</p>
<p>The post <a href="https://ubuntudog.com/facebook-custom-share-button/">Facebook custom share button</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></description>
										<content:encoded><![CDATA[<p>Here is en example code on how to make a custom facebook share button.</p>
<p class="code_header">Code:</p>
<blockquote>
<div class="code">&lt;script&gt;function fbs_click() {u=location.href;t=document.title;window.open(&#8216;https://www.facebook.com/sharer.php?u=&#8217;+encodeURIComponent(u)+&#8217;&amp;t;=&#8217;+encodeURIComponent(t),&#8217;sharer&#8217;,&#8217;toolbar=0,status=0,width=626,height=436&#8242;);return false;}&lt;/script&gt;&lt;a href=&#8217;https://www.facebook.com/share.php?u=&lt;url&gt;&#8217; onclick=&#8217;return fbs_click()&#8217; target=&#8217;_blank&#8217;&gt;&lt;img src=&#8217;SOURCE_TO_YOUR_IMAGE&#8217; alt=&#8217;facebook&#8217; title=&#8217;Share on facebook&#8217; /&gt;&lt;/a&gt;&lt;/script&gt;</div>
</blockquote>
<p>The post <a href="https://ubuntudog.com/facebook-custom-share-button/">Facebook custom share button</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Close prettyPhoto window from an iframe</title>
		<link>https://ubuntudog.com/close-prettyphoto-window-from-an-iframe/</link>
		
		<dc:creator><![CDATA[dean]]></dc:creator>
		<pubDate>Sun, 24 Nov 2019 20:27:32 +0000</pubDate>
				<category><![CDATA[General]]></category>
		<category><![CDATA[JavaScript]]></category>
		<guid isPermaLink="false">http://ubuntudog.com/?p=143</guid>

					<description><![CDATA[<p>Around the forums has been discussed on how to close prettyPhoto modal from within an iframe. I&#8217;ve tried many of solutions posted there without success. Here&#8217;s one solutions on how to do it. To close prettyPhoto from an iframe just call the following: &#60;script type=&#8221;text/javascript&#8221;&#62; parent.eval(&#8216;$.prettyPhoto.close()&#8217;); &#60;/script&#62;</p>
<p>The post <a href="https://ubuntudog.com/close-prettyphoto-window-from-an-iframe/">Close prettyPhoto window from an iframe</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></description>
										<content:encoded><![CDATA[<p>Around the forums has been discussed on how to close prettyPhoto modal from within an iframe. I&#8217;ve tried many of solutions posted there without success.<br />
Here&#8217;s one solutions on how to do it. To close prettyPhoto from an iframe just call the following:</p>
<blockquote>
<div class="code">&lt;script type=&#8221;text/javascript&#8221;&gt;<br />
parent.eval(&#8216;$.prettyPhoto.close()&#8217;);<br />
&lt;/script&gt;</div>
</blockquote>
<p>The post <a href="https://ubuntudog.com/close-prettyphoto-window-from-an-iframe/">Close prettyPhoto window from an iframe</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Detect left mouse button click with jQuery</title>
		<link>https://ubuntudog.com/detect-left-mouse-button-click-with-jquery/</link>
		
		<dc:creator><![CDATA[dean]]></dc:creator>
		<pubDate>Sun, 24 Nov 2019 17:16:11 +0000</pubDate>
				<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<guid isPermaLink="false">http://ubuntudog.com/?p=130</guid>

					<description><![CDATA[<p>This script below will detect left mouse click and pop up an alert when you left click on the link &#8220;Click me&#8221;. Code: &#60;script&#62; $(function(){ $(&#8220;#click-me&#8221;).live(&#8216;click&#8217;, function(e) { if( e.button == 0 ) { // Clicked with left mouse button alert(&#8216;You clicked with left mouse button&#8217;); } }); }); &#60;/script&#62; &#60;a id=&#8221;click-me&#8221;&#62;Click me&#60;/a&#62;</p>
<p>The post <a href="https://ubuntudog.com/detect-left-mouse-button-click-with-jquery/">Detect left mouse button click with jQuery</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></description>
										<content:encoded><![CDATA[<p>This script below will detect left mouse click and pop up an alert when you left click on the link &#8220;Click me&#8221;.</p>
<p class="code_header">Code:</p>
<blockquote>
<div class="code">&lt;script&gt;<br />
$(function(){<br />
$(&#8220;#click-me&#8221;).live(&#8216;click&#8217;, function(e) {<br />
if( e.button == 0 ) { // Clicked with left mouse button<br />
alert(&#8216;You clicked with left mouse button&#8217;);<br />
}<br />
});<br />
});<br />
&lt;/script&gt;</p>
<p>&lt;a id=&#8221;click-me&#8221;&gt;Click me&lt;/a&gt;</p></div>
</blockquote>
<p>The post <a href="https://ubuntudog.com/detect-left-mouse-button-click-with-jquery/">Detect left mouse button click with jQuery</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Disable enter key in a form</title>
		<link>https://ubuntudog.com/disable-enter-key-in-a-form/</link>
		
		<dc:creator><![CDATA[dean]]></dc:creator>
		<pubDate>Sat, 15 Dec 2018 16:26:11 +0000</pubDate>
				<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<guid isPermaLink="false">http://blogg.ubuntudog.com/?p=77</guid>

					<description><![CDATA[<p>There are two simple ways to disable enter key in your forms. 1. The first one is a piece of javascript that you include in your head section. &#60;script language="JavaScript"&#62;function disableEnterKey(e){var key;if(window.event)key = window.event.keyCode; //IEelsekey = e.which; //firefoxif(key == 13)return false;elsereturn true;} 2. Than in the form issue onKeyPress like this: &#60;input type="text" onkeypress="return disableEnterKey(event)"&#62; ... <a title="Disable enter key in a form" class="read-more" href="https://ubuntudog.com/disable-enter-key-in-a-form/" aria-label="Read more about Disable enter key in a form">Read more</a></p>
<p>The post <a href="https://ubuntudog.com/disable-enter-key-in-a-form/">Disable enter key in a form</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p>

There are two simple ways to disable enter key in your forms.</p>



<p>1. The first one is a piece of javascript that you include in your head section.</p>



<p></p>



<pre class="wp-block-preformatted">&lt;script language="JavaScript"&gt;<br>function disableEnterKey(e)<br>{<br>var key;<br>if(window.event)<br>key = window.event.keyCode; //IE<br>else<br>key = e.which; //firefox<br><br>if(key == 13)<br>return false;<br>else<br>return true;<br>}<br></pre>



<p></p>



<p>2. Than in the form issue onKeyPress like this:<br></p>



<pre class="wp-block-preformatted">&lt;input type="text" onkeypress="return disableEnterKey(event)"&gt;</pre>



<p><strong>The easiest way of disabling the enter key may be this one:</strong><br></p>



<pre class="wp-block-preformatted">&lt;input type="text" onkeypress="return event.keyCode!=13" /&gt;</pre>
<p>The post <a href="https://ubuntudog.com/disable-enter-key-in-a-form/">Disable enter key in a form</a> appeared first on <a href="https://ubuntudog.com">ubuntu|dog</a>.</p>
]]></content:encoded>
					
		
		
			</item>
	</channel>
</rss>
