JQuery

Web Client action witout JQuery, seems to be impossible

The requirement was to develop an Web application, who get connect to the database for information about the viewed documents. This documents are shown at the web application for printing them on the client's printer automatically without any engagement from the user. My first attempt was to develop an native web application and try the functionality local on my machine before it would be deployed to the test server. First i have to search, how i could get the information about the printers installed at the user’s os and then who to interact with them silently. During a little search attempt i found a solution for both requirements, which i looked. The first demo version of the Web application was ready to deploy. At this time i thought i was easy and i have finished my task.

But the first request to my Web application shows my some differences. There were no local installed user printers to choose and i could print anything out. I had to go back to the development and research some other solution from my current knowledge. After some hours of search, many form entries are shown me some solutions i had to try. The main reason points out of the forum entries, and this was the secure policy “same domain policy” i groped about in. This means, that my client could connect to another website from a javascript call. Other results show me many libraries to manipulate or create some pdf documents but not simple to load and print. One simple solution were to get the path of the document at runtime and then press automatically the print button of such an element. I tried it out but in ASP.net each handle event has invoked an reload of the web page so i lost my furthure informations.

At least i trip over an forum entry, where the author also has struggled with such a problem, and he came to the result, that i has to be a third party application, which process the printing. So I developed such an application who has a own host server which hosts an webservice, which i could connect from my web application at runtime via JQuery. For this i had to prepare such method who has as input parameter my document informations and creates an IFrame, which source is my local hosted web service. If you remember, ASP.net reloads the page after successfully processed the event, i had to collect all informations and put them over the URL Get method to the webservice. So i had a new limit about 2048 characters for the URL to send. At the end i take that restriction, and i still happy with the result, that I’m only allowed to print 50 documents per time.

An web application config has many hints, which could be very interest to solve time and nerv

The requirement was to develop an Web application, who get connect to the database for information about the viewed documents. This documents are shown at the web application for printing them on the client's printer automatically without any engagement from the user. My first attempt was to develop an native web application and try the functionality local on my machine before it would be deployed to the test server. First i have to search, how i could get the information about the printers installed at the user’s os and then who to interact with them silently. During a little search attempt i found a solution for both requirements, which i looked. The first demo version of the Web application was ready to deploy. At this time i thought i was easy and i have finished my task.

But the first request to my Web application shows my some differences. There were no local installed user printers to choose and i could print anything out. I had to go back to the development and research some other solution from my current knowledge. After some hours of search, many form entries are shown me some solutions i had to try. The main reason points out of the forum entries, and this was the secure policy “same domain policy” i groped about in. This means, that my client could connect to another website from a javascript call. Other results show me many libraries to manipulate or create some pdf documents but not simple to load and print. One simple solution were to get the path of the document at runtime and then press automatically the print button of such an element. I tried it out but in ASP.net each handle event has invoked an reload of the web page so i lost my furthure informations.

At least i trip over an forum entry, where the author also has struggled with such a problem, and he came to the result, that i has to be a third party application, which process the printing. So I developed such an application who has a own host server which hosts an webservice, which i could connect from my web application at runtime via JQuery. For this i had to prepare such method who has as input parameter my document informations and creates an IFrame, which source is my local hosted web service. If you remember, ASP.net reloads the page after successfully processed the event, i had to collect all informations and put them over the URL Get method to the webservice. So i had a new limit about 2048 characters for the URL to send. At the end i take that restriction, and i still happy with the result, that I’m only allowed to print 50 documents per time.

Taggings:

Loading jQuery using Google Hosted Libraries

There are two ways of adding jQuery to a web page:

- Using local copy of jQuery, which can be downloaded from their official website, or
- Via adding a link to one of the online versions of jQuery, which are located on different servers. This is the so called Content Delivery Network (CDN). This can be done for example by using Google Hosted Libraries.

CDN is actually a network of servers located on different places of the world. When the user opens a web page, the static resources (like images, jQuery, CSS files, etc.) are downloaded from the nearest possible server. The biggest benefit of that is that the page will load faster.
Google Hosted Libraries serves as a “home” for the most popular JavaScript libraries like jQuery, MooTools, AngularJS, etc. This is a service presented by Google, which in my opinion is very secure and reliable. This is the main reason I use it and recommend it.

Adding jQuery using Google Hosted Libraries:

Step 1)
Go to the Google Hosted Libraries web page (https://developers.google.com/speed/libraries/) where you can get more information about the service.

Step 2)
Find the jQuery library in the list of JavaScript libraries. There you can find the text which you should copy. After that there is some version information about the latest versions of jQuery.

Step 3)
Copy the snippet text, open the HTLM document you want to put it in and paste it in the . The corresponding code will look like that:

01. < head >
02. …
03. < script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" >< /script >
04. < /head >

Step 4)
The code from above will work perfectly, but only after your site is online. In order for it to work offline (on your computer) you should add the protocol the browser would use to connect to the file.

01. < head >
02. …
03. < script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" >< /script >
04. < /head >

The difference is in the additional “https” at the beginning of the “src” attribute. That will allow your browser to connect the file even if you are working from your computer.

Step 5)
In order to test if it is working you also put some other jQuery text in the like:
01. < head >
02. < script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" >< /script >
03. < script type="text/javascript" >
04. $(document).ready(function(){
05. alert('jQuery successfully added!');
06. });
07. < /head >

Step 6)
Save the existing code and open the page in a browser. We will get an alert saying “jQuery successfully added” if everything went well.

Taggings:

How can I add social Media Buttons (Facebook, Twitter & Co.) to jQuery colorbox?

The aim is to display social media buttons on each image in the jQuery colorbox view. As displaying something other than text in the lightbox is not possible by default (<a href="http://www.jacklmoore.com/colorbox/">jQuery colorbox</a>) (see documentation, demo), we need a custom solution to do the job. Note: As jQuery colorbox is a Plugin for certain content management systems, it is important that the change should be done WITHOUT changing the code of the lightbox and WITHOUT accessing the HTML directly, as Plugins for CMS should not be modified as they will loose update compatibility. The result should look like in attachment 1 (sample.png).

Testing JavaScript with various frameworks and sharing them

In an experimental state of your new solution there is often a phase where you don't know how to solve a problem in JS/HTML in the best way. The set up that is required localy is often complicated because of including of all necessary libraries and the testing is often a very monotonous repeating of adding of files.

Hightlight words in free text using jQuery

With the method addClass() and an CSS class it is easy to change the appearance of the text with the limitation that the text has to appear in HTML tags. For highlighting specific words in free text, this method is not working.

Create a popup window using Javascript

<p>Implement a website popup window plugin so that rich media can be embedded to it. The plugin should be able to be capable of embedding external flash videos, images like JPG, html elements. Images that are grouped together should be shown as gallery.</p>
Subscribe to JQuery