I looked at "Generating HTML Page on the fly" on this website, but most of it was over my head.
I have a 2 part question that I would like assistance with please.
I want to fill a narrow vertical container, <div id=”counter”> with the numbers 1 .. <xx>.
<xx> is determined by the record count of a database, filtered “on-the-fly”, by the user choosing a category (no problem there – I have an SQL background)
Eg. Category1: 1 .. 200
Category2: 1 .. 6
These numbers could change over time, as I want to allow users to add content to the database (vetted of course).
I have viewed a number of website source code pages (of similar ideas eg. Surgicalexam.com), but they have all been hard-coded and are distinct pages per category.
I have created a small website of a similar nature to that, hard-coding all the images and links, but I am looking at 3000+ images (as a starting point here), and they differ per page.
I have created this scenario many times in stand-alone apps and from past experience, I thought perhaps, I could create a javascript routine which would use a loop to
• print the numbers to the <div> using the getelementbyID ( ).
• Fill an array with the record number, a title and an image link.
Question 1: Is this possible or am I beating a “dead horse”?
If it is possible, any suggestions would be gratefully accepted.
Part 2:
My current idea is that, as the user hovers the mouse over any number, a mouseover ( ) event will occur that will read the appropriate array record and display the <title> as a tool-tip-text.
If the user clicks the number, a function (I have yet to write) will read the appropriate array record and attach the image link to an <a> tag, and subsequently display the appropriate image to the screen.
Question 2: repeat of question 1.
I have viewed a number of website source code pages (of similar ideas eg. Surgicalexam.com), but they have all been hard-coded and are distinct pages per category.
Why are you so sure about that? You can't see php-code, because it is executed on the server. There is no way to know if it was hardcoded or by php
Answer:
It is possible.
If I understand this correctly, you want to read some data from a database and if the user clicks / hovers something, you want to load more data?
You have to splitt this into two things:
Load data with PHP from the db (Server side)
If you want a live, visual feedback you need JavaScript (and/or CSS3) to do changes. (Client side)
One possible solution is to create a API with php (maybe REST-like) and then call that api with JavaScript.
You could also do everything with PHP but this will require a reload of the website on every click. PHP cannot do changes On-The-Fly.
First of all you should learn the basics about web development.
And most important: If you decide to learn Web-Programming: learn about security, too. For example things like Cross Site Scripting and SQL-Injection. Never trust data coming from a client (e.g. JavaScript)!
Related
I find myself having to interact with a web page that hides state in various places so that one cannot easily share it as a URL, for example this page which allows users to look up information from city zoning applications:
https://aca.cityofberkeley.info/community/Default.aspx
You can interact with the page all you want, but the URL in the location bar will remain the same as the above.
Currently, city staff provide users with instructions like "Load this URL, click on the 'Zoning' tab, enter DRCP2020-0010 under the 'Permit Number' field, click 'Search', then when the records come up, click 'Record Info' and then select 'Attachments' from the dropdown menu, then click on the PDF document that says '2020-10-21_DRCP_APP_PCKT_2801 Adeline.pdf'". I would like to be able to replace these instructions with a URL.
Another example is the website where video from city council meetings is archived:
http://berkeley.granicus.com/MediaPlayer.php?publish_id=cbebb4e6-5b83-11eb-920e-0050569183fa
It would be nice to be able to produce a link which brings up one of the meeting videos, and seeks to a certain timestamp like 53:40, so that I can refer to something specific that was said at a meeting.
Looking at the pages that are loaded when I follow the instructions in each case, I can see that there are some POST forms, cookies, hidden input fields, and so on.
Is there some kind of tool that I can use to create "deep links" to pages like these, that were generated using non-URL hidden state, which will allow me to quickly share what I'm looking at with another user?
What I'm seeking is similar to the frmget "bookmarklet", which changes the forms on a page to use GET instead of POST. Sometimes this succeeds in producing a URL which captures form submission query parameters. However, it doesn't work for these applications, for whatever reason.
This question is possibly related to the idea of capturing a web page's DOM state using "browser screenshots" and a script called html2canvas. A possible solution might involve getting and setting cookies in a bookmarklet. Ideally something that produces a normal "https://" URL would be ideal, but if it is impossible to solve the problem except by outputting a "javascript:" URL (bookmarklet) then that is acceptable to me (in spite of the security implications). Thanks.
That seems like not a programming matter. It seems like the site has some security issues as well.
QUESTION A: About Zoning
Here are some links you can use
Direct link to Zoning (I've found it via Advanced search from the site):
https://aca.cityofberkeley.info/CitizenAccess/Cap/CapHome.aspx?module=Planning&TabName=Planning&TabList=Home%7C0%7CBuilding%7C1%7CHousing%7C2%7CPlanning%7C3%7CFire%7C4%7CLicenses%7C5%7CPublicWorks%7C6%7CCurrentTabIndex%7C3
A strange link to the list of files (I've found it via downloading a file, then going to chrome://downloads, then right-clicking the file I've download. The link has been the following):
https://aca.cityofberkeley.info/CitizenAccess/FileUpload/AttachmentsList.aspx?iframeid=ctl00_PlaceHolderMain_attachmentEdit&module=Planning&isInConfirm=False&isdetail=True&isaccountmanager=False&isAdmin=True&isPeopleDocument=&agencyCode=BERKELEY&isForConditionDocument=N
It still doesn't give the direct link to the file, but it it gives the list of attachement of the previously opened Zoning record.
Currently I have no idea what file is triggered by javascipt:__doPostBack('attachmentList$gdvAttachmentList$ctl02$lnkFileName','').
In any case, based on what we have, step one, and then step two seems like minimize the path to download the file. I guess there could be a way to download the file directly, but I currently don't see any easy way. Maybe someone else could figure it out.
QUESTION B: About video
I've used an embed link that shows all the attributes that can be used.
There is a pretty strange but working way to give the exact timestamp. Change starttime from the link below:
https://berkeley.granicus.com/MediaPlayer.php?publish_id=cbebb4e6-5b83-11eb-920e-0050569183fa&starttime=0&stoptime=undefined&autostart=1
So replacing 0 for 3600 will rewind the video forward by one hour (3600 seconds):
https://berkeley.granicus.com/MediaPlayer.php?publish_id=cbebb4e6-5b83-11eb-920e-0050569183fa&starttime=3600&stoptime=undefined&autostart=1
The problem here is that ... you cannot rewind back manually that particular hour (it just gets kind cropped out). But it works to show the exact episode.
That's a pretty strange site.
I'm kind of a beginner to WIX Code. I have this site which I have made i.e www.rat-store.com. I am facing three problems which I know might get solved with some code but I don't know how to do it. Here are the problems:
In manual payment, I need to accept some form input from the user on a page and only if the user agrees to the terms and enters the correct date should the submit button get activated following which an otherwise collapsed image should also reveal (it's the QR code to make payment; Image 1) (www.rat-store.com/manual-pay-rat)
Image 1
I'm trying to link a repeater background to a page but it's not working. I have to create a button inside the repeater to do this. Any workarounds? I know an image will work but the thing is that the motive is to create a kind of a list which will keep on incrementing in the future and I can't just keep on drag-dropping images, text and then group them up and link. (Image 2) (www.rat-store.com/shop-by-events)
Image 2
Since WIX Stores doesn't have an inbuilt cancellation feature I built a form to substitute for the same but I want that no two same order cancellations are submitted i.e. a customer can only submit his/her cancellation request for a particular order number once. The next time s/he tries to do that it should show that the request already exists. (Image 3 and Image 4) (www.rat-store.com/cancel-orders)
Image 3
Image 4
Some help with the code and approach would really be great. I'm almost finished with my site; Only these last few things bother me. I'm attaching a screenshot of each page, serially w.r.t the question number. P.S: The order number is the number generated for each order by the Wix store app itself. I have nothing to do with that. The customer needs to enter his/her number and if that is valid we will process the request. Apologies for the length of the post.
My website basically consists of photo galleries that people can browse. On the main page, people can choose to access the gallery of images then in the gallery, they can select which photo they want to see.
This is an image of the possible different ways to give users picture choices. On my site now, I offer the left-most options because of compatibility for all browsers.
The option format I want on my site is defined under "Desired Options". When a user selects a boxed arrow, the number (shown as ## here) will automatically increment or decrement. then when GO is clicked, the URL is then http://example.com/picturenumber/##. So if users use the up and down arrow buttons to select number 10 and GO is clicked, then http://example.com/picturenumber/10 is the resulting URL.
Here's the issue
To achieve the above, I feel I need to use javascript. I believe at least one person in this whole world that wants to use my site uses a device or browser with no javascript support. This forces me to use the option format on the far right, a basic text box for the picture number to be typed in and a GO button.
My partial answer to my question is this:
Use this HTML:
Enter #:
and this PHP named imagepicker.php:
While this does work, the problem is that an extra request is required to fully process the user's request.
I feel my only other options to solve my problem are either:
Not use friendly URLs and make them compatible so that when the form is submitted, the correct URL is loaded without the need for an extra request. For example, make this URL the official image URL displayed in the address bar: http://example.com/imagepicker.php?number=##
OR
List every single image number on the main page which is rather redundant because the list is in the gallery page.
I even thought of using a combo box in place of a text box and that wouldn't help either.
Is there some way I can do this so that users with no javascript support can enter an image number and then with a click of a button, be taken to that image without requiring the resulting image page to be accessed at a not-so-friendly URL and without listing all image numbers at once? If so, what would you suggest?
So, basically it boils down to a HTML problem in which you need to increment some numbers pressing buttons that alter the format of the URL in order to be friendly, and after that, you have to produce a postback. I think you need javascript for it.
Without javascript, I think the best solution is to sacrifice friendly URLs and create a form with method GET, so the choice that the user writes will be sent to the server as part of the query string. But only for those users that don't have javascript on their browsers. You can use javascript for the rest, but if you do that, it would be better to keep the "unfriendly" URL format for consistency and maintainability.
I'm sorry for the vague title. I'm not quite sure how to word it.
I am fairly new to programming and working on a small chrome extension that checks a particular website for new product listings. I am retrieving the webpage using XmlHttpRequest, however I would like to get the webpage with certain display options already applied.
The webpage I am fetching uses javascript to change its display options. By default, it shows only in-stock items and 20 items. What I want is both in-stock and out-of-stock, and 100 items.
If I go to the website and directly change the options, then fetch the page with XmlHttpRequest, it will return what I want. But I would like to be able to do this all from within the program.
This is the webpage: http://ekizo.mandarake.co.jp/shop/en/category-action-figure.html
Any idea if this is possible and if so, how I could accomplish it? Thanks in advance.
If you look at what happens when you change the number of items to display it goes to this page with the added variables:
http://ekizo.mandarake.co.jp/shop/en/searchOption.do?action=setListCount&keyword=&searchStrategy=keyword&listCount=100
All you need to do is recreate that GET request with the details you want.
(although for the other things such as stock avaliability I have not looked as to where this is)
Firebug is your friend with this kind of thing.
I have a webpage which contains a table for displaying a large amount of data (on average from 2,000 to 10,000 rows).
This page takes a long time to load/render. Which is understandable.
The problem is, while the page is loading the PCs memory usage skyrockets (500mb on my test system is in use by iexplorer) and the whole PC grinds to a halt until it has finished, which can take a minute or two. IE hangs until it is complete, switching to another running program is the same.
I need to fix this - and ideally i want to accomplish 2 things:
1) Load individual parts of the page seperately. So the page can render initially without the large data table. A loading div will be placed there until it is ready.
2) Dont use up so much memory or local resources while rendering - so at least they can use a different tab/application at the same time.
How would I go about doing both or either of these?
I'm an applications programmer by trade so i am still a little fizzy on the things I can do in a web environment.
Cheers all.
Regarding the first part, it's called Ajax: display the page without the table, or with an empty table, and then use ajax requests to fetch the data (in html or any data format) and display it.
Regarding the second part, you want something called lazyloading: the possibility to load data only when the user needs it, ie when it's on the visible part of the document. You can look at this question for a DataGrid library capable of handling millions of rows.
Two basic options:
Pagination
Lazy loading (load as user scrolls down). See this jQuery plugin
You could try a couple of things:
Loading data Asynchronously
and
Paging