Recently I experience the following problem, when I call this code it triggers an error in FireBug:
With “human” words: I trired to find a input with a spefic name, then find the form wrapping this input and try to submit it. Strangely, but it trows an error in jQuery lib.
Continue reading
Last few articles in this blog are only for stupid problems and unfortunately this one will be the same.
I had to use JSON to update some chained select boxes. I am using one jQuery plugin for this. The problem is that if you code, most likely your debug setting in the core.php file is set to 1 (or 2). This way the developer can see errors from CakePHP.
When the level is set to 1, at the end of the page, there is an comment, displaying the processing time for the page, but when you use JSON, this comment causes troubles (probably, because JSON doesn’t accept this type of comments) and the JS fail to process the response.
In order to check JSON, I needed to disable set debug level to 0 and after this to reset it again to 1 (for debugging purposes in other parts of the application).
So, the conclusion: bear in mind, that JSON doesn’t like HTML comments.
Hope this helps.
Recently I was working on some projects which required some advanced techniques. Sometimes you should stop thinking how to make it with HTML and CSS, and just to do it with good JavaScript code.
So far, all of these plug-ins were forced because of design decisions, but anyway important here is the plug-ins and the great job which they doing. So:
jScrollPane is a jquery plug-in which allows you to replace the browsers default vertical scroll bars on any block level element with an overflow:auto style. You can easily control the appearance of the custom scroll bars using simple CSS.
I have use it because the designer decided to show the content in a size of business card, and the client of course wanted to provide as many information as he could. If course this one could be done with single line of code: overflow: scroll; in the css definition, but this way you cannot control the appearance of the scroll bar, so from the design point of view it was unacceptable.
Anyway, the plug-in is really rich of features, and really easy to be used. It requires some other plug-ins, for full capacity, but it is good.
It’s a plug-in which transform long pages into paged area. To be fair, this is what the client wanted as interface – paged content based on paragraphs. Unfortunately the content includes also the bullet lists which are problematic with it. The plug-in provide ability to set up the appearance, i.e. putting your own labels on the pager links and height of the area.
This plug-in give the ability to know the width, height and position of an element in the page. I’ve wrote about it in my previous post, and although it’s not used in the new design it’s really handy.
In the same project I was asked to implement a news ticker /who uses such things these days, anyway :)/. So, standard marquee tag was, just ok, but it is not smooth enough. This plug-in does exactly this – making the scroll smooth and the text more readable.
and the last but not least
As the name says this plug-in provide a form validation. The good thing is that it’s “validate as you type”. So it could mark field as invalid instantly when you insert more than required chars or enter an invalid email.
Well, not a rocket science, but at least they are helpful 🙂 Hope this post helps someone.
Ok, this is not a code snippet article. It’s just an experience which you probably already met, but it was nightmare to find and it took me 1/2 a day to fix this “stupid” bug.
So what is the case?
Working on a project including some advanced JavaScript and Ajax techniques my coworker Milen noticed that the Session is not behaving as expected. In a simple function like:
The result should be quite easy to be predicted: if you pass for example 5 on the second reload the $k should be with the same value as $id. Unfortunately instead of 5 the $k was ‘images’. Yep, quite strange, isn’t it?
if you put die() at the end of the function, the result is as expected.
What was the problem
In our current project we are using jQuery and some of it’s plugins. So the problems was in the ThickBox plugin. If you remove it from the header everything works.
Digging into unpacked version of the plugin we’ve noticed that the loading picture is not where it should be. there is an variable
and as you may notice the path is not compatible with Cake convention and obviously it’s not in the http://server/cakeapp/tests/test/images/.
In the example above we were writing id into the session. Yes but calling: http://server/cakeapp/tests/test/images/loadingAnimation.gif mean that $id take value of ‘images’.
It was quite tricky, because if you loading CSS or JavaScript and the file is not there, FireBug or even the html /if there is no correct CSS the styling will fail/ will warn the developer, but image loaded into the JS function is quite difficult to find.
Anyway, the conclusion is “Watch you JavaScript libs and what files they require”.
I was worked on a centred project design of a website. When I met such requirement I’ve always used Dead Centre approach.
Unfortunately I’ve noticed that when the content is larger than the screen the top-left corner is not visible. In that current project the logo of the site was exactly on that place, so it’s really confusing.
I had to solve this issue in order to satisfy the clients requirements. So, I’ve used jQuery to sort this out.
You can see the difference in these 2 examples:
Resize your browser window in order to see the difference.
How it’s working?
First of all there are 2 javascript includes:
After this there is a function which track the size of the screen and the content.
The explanation of the code:
I am using jQuery plugin named jQuery Dimensions Plugin 1.1 which extract the proper dimensions of the boxes.
The function checking if the content screen is bigger than the window size, if so it change the CSS in order to fit properly. I guess that you can see the logic easily. So, no more explanations here.
Hope this will help someone.
Here I will describe all my achievements during this year. I will write about my targets for the next year and I put some notes of my vision about IT world as well.
It’s end of the year and everybody make recap of the things which he/she did during this whole year. So here is my list of achievements:
Continue reading
This is a really old post. I’ve wrote a new one which you can find it here
I am using this part of code from long time ago, but it wasn’t in a separate helper. It was part from one not very good written Auth component/helper mash up which I already not using. I fact the default Date input of CakePHP Framework is ugly and not user friendly at all. The drop-downs are good because the format is clear and users cannot mess it, but if you thinking for the user convenience, then you should know that it’s 3 times easier just to type the date in a field or to pick it from a Calendar pop up than selecting from 3 drop-downs.
Continue reading
Yesterday I was amazed from a project while I browsing in the tech articles. It’s named CodePress.
Continue reading
These days when I showed my example to some friends I realized that in fact even the second example had potential bugs. In fact not a bug, but missing functionality which could mislead the user while using the component.
What I found: When the user prefer to type instead of selecting the value from the list, then it’s possible to have “nothing selected” in ID field, but in fact the user have feeling that he select the correct value. This is extremely valid when the options are short and typing 3-4 chars which in fact is more convenient to type instead of selecting.
Continue reading
These days I saw an article about Instant Javascript Library. I was surprised how easy is to build eye-candy gallery looking like real album photos. The usage of gallery is very easy – just include the script file and add class of every image and that’s it. Of course there are many customizations and extras, but I am leaving this to your imagination.
Continue reading
