Hi,
can anyone sort out my problem.I want to build a product comparison page in javascript with checkbox i.e when a user click on the respective checkbox with images maybe 1 or more, then the comparison table should show on the same page.I am having about 10 products and 12 comparison categories to be compared.The user can check one checkbox or all.
A nice example is shown please click on the link and see the example. http://quickbooks.intuit.com/qb/cate...ode=3972100000
Please help me out…plz
please provide the complete code
<html>
Okay… here you go… took me a coupla hours but I practically created the entire thing in JavaScript. Converted mostly everything into JavaScript classes so that you can easily add and remove products and features.
I tried to comment where ever I could. It should be fairly easy to grasp if you have some development knowledge.
You will have to change the images. I’ve used images from the QuickBooks link you’ve sent me. To add or remove Products and Features, you can make changes to the “Data.js” file. This file contains all defined products and features.
I’ve spent quite a bit of time on this, so I’ve registered it under the gnu general public license. Feel free to change and use as you wish, but please keep all license notices in tact.
Thanks! ;O)
Let me know if you need a hand with it. ZIP File Attached.
You expect someone to do all the work for you so that you can just plug it into your site? I think people around here would merely point you into a direction… not create the entire thing for you.
And the link you provided gives me a 404 file not found error.
If you can get that example up and running, I can try and create the basics for you and you can customise it to your needs.
hi,
can’t you do without my php pages 'cause i do not want to include
those things, i am still testing the php pages because its giving some
problems in mozilla and safari, if its possible for you to develop
without the php pagesit will be great.I do not want to use php any
more due to some restrictions.
Plz ensure that it works in all browsers, i have time till friday
10.00 am, so plz do as your own convenient and put your own data and
images and that i should be able to edit the data and images.
Thanks again for all your effort, by the way i want something about
you, nationality, region, place nothing else.
Like I said, the second option is going to be the slightly more intense option, because we now have to do asynchronous calls to the server using JavaScript, get the details, send it back to the script and then handle the comparison table.
You mentioned earlier that you’re running out of time, so this might be a problem. It’s actually a good thing that you have your PHP script set-up for this already. This will speed things up a bit.
So, what I’m gonna need from you is the abillity to send your php page parameters. Based on what I send to your page, you must send me the requested data back in the format that I require them in. I think the best option for this is to go with JSON.
If at all possible, give me the source of your PHP pages. I’ll then try to develop this locally first, and then give you the raw material once I’m done. I can work on it later today and this evening, and have it back by you in the morning.
I have a natural interest in this kind of development. I come to work to do it, and then go home and carry on till the blood starts running from my eyes. I am a sad sad man, and you’d think that I wouldn’t sit at work with a hangover today because of the lack of attention I seem to be giving my social life, but yet… I do make the time, and I am suffering dearly today.
In conclusion - Best cure for a hangover: PHP, JavaScript, JSON and AJAX!
Okay hang on… You’re saying that you want to work away from PHP? If we go the AJAX route with this, we’re still going to need some server-side processing with PHP.
Let me just quickly explain this to you… Basically, JavaScript would send an asynchronous request to a PHP page. The PHP page then goes to a database or whatever it is you’re doing to get your data, and sends the response back to the script. The script then takes that response and creates the comparison table.
If you’re working away from PHP, then we cannot and should not go this route. We should then rather keep the data in the javascript and manipulate the comparison table based on the request. Remember that JavaScript is used on the client-side, and PHP on the server side.
If we’re still going to do some PHP processing, then the problem is that if I don’t know what you’re doing in your PHP file, then I don’t know what data to send back and how. I’m going to need to do something similar to you in order for you to just plug it in and make it work.
tell you what… I’m going to set up a quick script that would create the comparison table with some bogus data, and no server-side processing. From there, you’ll have to figure out for yourself how you’re going to retrieve your data.
ok, so now, based on that quickbooks page, I have a few questions.
Where are you planning on storing the information to be compared for all products? Are you going to add it to your client-side script, and then just get product values and show the comparison table, or are you going to do a call to some server-side module, to retrieve the information from the server, and then popup the comparison table with the details?
The first option would be less dynamic, and you would have to hard code some values into your script. This route will be maintenance hungry, if you get my drift.
The second option is to go ther AJAX route. A little more intense, but you can do a call to the server and retrieve data for products, send it back to the script and then popup the comparison table with the details.
Hi thanks,
i think the second option is the best option, but remember am having images of products, i can even compare 2 or more or all products, i should have the facility to add more fields, checkboxes, etc.
You have shown much interest, thanks a lot, plz solve this for me.
you can visit , i have made it in php, mysql, but i want it in javascript, etc.The link is below http://www.hitandtrial.com/sapan/index2.php
dear pip,
okay that’s fine, if we do in only javascript the first
method or the previous way, shall the result will come as same as if
we do in php, same comparison chart, images, etc.If it is yes then no
problem, if its no then i think my php code will do and i will send
the code, but try to do in the other way means the first way without
database because there wouldn’t be many products.
Yes, the result will be the same, but the data, images, and comparison details will be hard-coded and stored in the javascript. That’ll mean that when you need to add or remove products, you will have to change the page the whole time.
I will send you the script as soon as I’ve managed to sort it out
Okay… I’ve removed the prices, and moved the comparison table to the bottom of the page.
The checkboxes vs data I will sort out this evening. There are some more intense changes required here.
However, I am still not too clear on this:
unchecking a checkbox means the corresponding feature should gone means if i uncheck a checkbox then the corresponding product must not be seen it should hide
When a checkbox is not checked, what do you want to remove? Do you mean that changes should occur on the comparison table when you check/uncheck a checkbox, instead of having to click the button?
hey pip one more problem, i want to add some images side by every checkbox so that the user can view the product for e.g image then checkbox then label.One more thing the checkboxex should not be checked on page load, one more thing unchecking a checkbox means the corresponding feature should gone. Plz do something to show the products under the checkboxes in separate table and i want to add the features/data rather than the tick mark images…
why you have given the link in the form to compareM.php what is the use.
hey pip you are genius man, but there is a problem, i want to enter the data instead of the tick mark images and the other thing is that i want to show the compare page under the checkboxes not side by it because if i add 4-5 products more than the screen size will be maximised.
