I'm working on bookstore website. The main page has all the books. Each has it's own button. Every book has it's button linked to the same page (buy.html), I want change content by clicking on different buttons as every book has it's own description
This is my HTML button code
<button onclick="window.open('buy.html')" class="book4">Buy</button>
I need to open buy.html but with different content according to the book
but what happens now is All buttons show the same content
Can any one help me in this issue,
Thanks.
Though your question is rather broad, I think I get your problem.
You need a way to distinguish between books without creating a new page for every book.
There are multiple ways of doing this. Personally I'd recommend using Server-Side scripts for this but you can also do this with JavaScript, you just have to put it in the link.
An example could be this:
<button onclick="window.open('buy.html?book=4')" class="book4">Buy</button>
What this does is open buy.html and specify what book you want to buy so you can create a function to pull only that description out of the database or however you want to do it.
I strongly recommend a database because as soon as you have a hundred or so books your page will get really slow and it's a waste of resources if you only display one.
The best way to get data out of a URL (as far as I know) is like so
Though, next time please post your code too, that would make it a lot easier to pinpoint the problem.
Good luck.
Edit: The JavaScript that I linked was not the best solution and rather complicated so I think a better and more easily understandable function can be found here
Related
I'm trying to set up a page which will have multiple elements in it. Could be something like books galery where when you click on the thumbnail a modal opens up with the picture of the book, link to publisher (or personal book page) and a description.
I was wondering whether it's more prudent to generate 1 modal per thumbnail (no js needed to manage anything and quick setup) or to setup one modal in which that data would be overwritten depending on which thumbnail you're clicking (less html generated but more complex to set up requiring js and storing information somewhere like data attribute).
I've seen a lot of topics and coverage regarding modals but haven't seen question like that asked so far. Everyone seems to be spamming countless modal "elements" without question.
Could someone shed some light on this for me?
The more efficient and future proof approach would be to incorporate JavaScript. As you would only be storing the data for each book and a single template modal this would conserve bandwidth. Additionally, what if you wanted to add more books? Just adding the data to the "books" array would be much easier in the future rather than having to create a new modal for each new entry.
However, if the gallery size is very small it may not be worth the time and effort to do this.
Hence, this is a design choice, it's up to you to decide what would be the ideal approach for your project.
This is my first question here, I'm very new to coding so please forgive me any mistakes.
So i started learning html/css/some basic javascript recently and I'm trying to build a website just for practice. So one page on it looks like this:
https://imgur.com/ZHyeprC
And right now i have different html files for each article (linked under the site navigation: Shauna, The First One etc.), so each name of the article takes you to a different page.
What i want to do is to have multiple articles in just one html file, and make them show up/disappear when the name of the article is clicked.
I tried to figure it out somehow in jquery, but i only managed to wrap the article in a div and make it appear when the invisible div is clicked... which isn't much useful.
So is it posibble to do with simple javascript/jquery? If so, the how do i do this?
Thank you all in advance, Michal.
The most easy and practical way is to have one HTML file for each article. It makes your files more organized and easier to find. Otherwise, if your client just want to look at one article the page has to load all articles which may take longer if the client happens to have a slow internet connection.
I am wondering if someone could give me a brief explanation as to how a site like darebee.com can auto-update its content every day. I understand javascript can be used to create div content through use of arrays but I don't think that is what is going on here.
I know that there are already a few answers regarding this subject, but I wanted to ask again, so that you can suggest the best option.
I have created a book that teaches (4 languages so far) at the same time. I will be selling various versions of this books travelling in Mexico. But it is also available online, free of charge. You can go directly to the version in question by visiting
http://jersllvs.majormigraine.com
I have created this book using the spreadsheet program in the OpenOffice suite (same as excel). Right now there are 4 columns for the 4 languages and as I am starting to work on language #5, I am realizing that I can save myself a lot of work, if I can hide/show the columns on the page. What I want to do is use the spreadsheet program to create the index.html for this book with all languages, and then add the needed code to the html file so that the user can check/uncheck the languages. There will be a list of languages at the top of the screen (English, Spanish, etc.) and each language will consist of 3 columns which will extend the entire length of the page.
I only have a limited knowledge of basic HTML, but have a long history working with computers, and can learn whatever is needed. However, as this entire project is to remain completely free (and I still have to get out and sell books to make a living), I want to find the easiest and fastest way to achieve this.
Thank You very much for your answer,
Jerry
I personally would use Jquery. However this could be pretty complicated if you arent too familiary with it. If you click the link I have provided below there is a short demonstration of what I think you are looking for. However because your webpage is so big, I think it could be very complicated for you as there is a lot of styling involved as well.
Take a look at the link I have made, and see if thats what you want. If yes, then you can slowly start to work out how to implement that into your site. To make Jquery work on your webpage you need to add the following code into the <head> tag of your HTML page.
<script type="text/JavaScript" src="http://code.jquery.com/jquery-latest.js"></script>
and then the Jquery code that you may use from my link will need to be within the <script> tags which will look like
<script type="text/javascript">YOUR CODE HERE</script>
I hope this is what your looking for. Here is the link to the page I have made for you: http://jsfiddle.net/3xR2p/1/
I am trying to allow for the filling out of a form from a lightbox pop up window. One like the one that Get satisfaction uses (though I only need to be able to collect info, not display from a query as well). You can see a Get Satisfaction example at http://tweet.fabeetle.com and clicking the feedback tab.
What is the best way to do this? JQuery?
I used http://www.nickstakenburg.com/projects/lightview/ a while back and it worked very well.
bgadoci, if you're not an experienced javascript user (or you are and want to avoid a lot of unnecessary work) you'll definitely want to go with a Javascript library like jQuery. As far as choosing the right plugin, you should shop around while keeping in mind your objective. Some of them will be friendlier with forms where others are built for images only.
I can recommend colorbox from experience.