(Web dev newbie here)
I have created a simple one page React App that has an input form and, after a button click, calls an API and displays the response.
I would like to be able to share an URL that would take people directly to the app and would search automatically.
For instance, a user goes to the app (http://myapp.com/) and inputs sophie and 20. He then gets information about that person (a fetch is made with this input) - this is already working. But also, the url changes to something like this:
http://myapp.com/person?name=sophie&age=20
The user would now be able to share this URL and people would be redirected to the app which would show data about sophie, after calling the api with sophie and 20 as input again (without the user having to input anything).
What is the best way for doing this?
Related
When users log into my PHP website, they are automatically logged out after a period of inactivity.
I have a few input fields on the main page for searching for stuff. Input type="text" with JQuery autocomplete option on them. The JQuery autocomplete takes user input and sends it to a PHP file that searches the database and returns data in JSON format.
The original page displays the data returned in a clickable list.
Now, if users have been logged out due to inactivity, this isn't immediately obvious, unless of course they choose to reload the page. Most don't, however. So if they just start entering search words, they just get nothting, because they're not logged in.
I already have a routine to redirect users to the login page if they're not logged in. But this doesn't work in this case, because it's the JSON-generating page that is being redirected, that that doesn't really have any influence on the main page.
Also, I can't see how I can interact directly with what's being returned - it seems like JQuery does all of the data handling internally, so I can't really grab onto data returned and tell the main page to redirect in that case.
How do I achieve the desired result?
On server side ajax first check login condition and based on that give respons e like {login:false} something like that, in your jquery function check that response and if login=false then redirect using window.location.
I have a simple postcode search in my wordpress site. The user enters a postcode, clicks search and the browser directs to a new URL based on the postcode entered.
Presently, I have a large switch statement in the onclick handler of the button, which parses the postcode input in a text box and generates some display text and a URL which I then launch using window.open.
It works OK, but as I add more and more postcodes its bloating the code loaded into the browser and it's all visible in dev console. I'm also limited when it comes to making changes as I'm having to go in and modify the code to implement logic directly in my onclick handler. It's a bit of a mess!
What I would like to achieve is to store all of the relevant information in a mysql database, query the DB when the form button is clicked, and then launch the URL which will be returned by the db query (well, there'll be a bit more logic in the server script than that but ultimately I'll just be returning a URL and some text).
I'm struggling to get my head around how to implement this. It appears the DB queries need to be in PHP on the server and has to be queried asynchronously? I'm getting lost down a rabbit hole of AJAX which I'm struggling to understand!
I'm not looking to asynchronously update content on my page - at the point that we're running code in the onclick handler, we're ready to launch a new page based on the postcode entered. It appears the required solution is a little more complex than I hoped it might be.
Can anybody suggest how I might implement this? Do I have to use PHP & AJAX?
Thanks
Currently I'm working on a project where a user enters a lot of data constantly for a hour long window. I'm looking to have one user control all the data via some control panel and then have a link they can distribute to other users that will allow them to view that data without the ability to edit it.
Right now I'm doing some extremely weird methods. I have an XHR request on the control page that fires whenever a field is finished being edited. From there the data is sent to a php file that converts the data into a simple text file. Then the distributed link file will load that file one time and translate it into the necessary format.
Some potential problems I've run into are it seems odd that I'm sending starting as javascript data then going to a php file then to a text file then translating the data all the way back into javascript data again. Another problem I've come into is I'm not sure of a way to force users to reload the page when a field is edited in the control panel after the user has opened the view page.
Have I totally gone overboard here? What are some better concepts I could employ to accomplish this task?
If i understand what you want to do this is how i will do this:
First the data entry
if you have lot of fields you better use a form wizard, i don't have a particular one in mind right now but there is lot of them just search jQuery Form wizard
Here is an example:
http://i.stack.imgur.com/Luk2b.jpg
The concept of the form wizard is to guide user via multiple page and also validate the data. And click save when and the end.
Then save date in database.
Display content
All you need to do is to create a global separate page to display your content.
Let see something like: http://yourserver.com/view/{id}
where id is the identifier of the particular row in your database.
i'm not sure if i totally understand what u about to do. i'm trying to make your work description shorter here:
want to build a website that one person can edit a single page's content in 1 hour, and others can view the content change in that 1 hour.
if this is what u want to build, here's the module:
teacher: the one who can edit the page
student: the one who can only view the page
server: information center
teacher client edits page -> teacher client sends update data to server -> server saves data -> server sends update notice to student client -> student client receives update notice -> student fetches update data from server
to make this module work well, i suggest try socket instead of http reqeust, just like online games or IMs do.
well, try socket.io
I'm programatically creating a Google Form using Google App Scripts right now, and my script automatically generates a page for each of the respondants that the form will be emailed out to.
Currently, the form has a dropdown at the beginning that the person uses to select their page, and then it forwards them to it, however, I'd prefer it if the email already sent out a pre-responded form that already started them on their page.
The reason I'm throwing them all into a single form is because I'm using Triggers to detect the form's submission, and since I have more than 20 people that require a form, that would break the trigger limit.
EDIT:
Example code:
the Form.getPublishedUrl() function returns the URL to respond the form, starting on the first page, however, I would like a URL to respond to the form starting on the 3rd or 4th page.
While the FormResponse.toPrefilledUrl() will allow me to autofill the correct response on the first page, it will not allow me to start the responder on the page that he would be forwarded to based on his pre-filled response on the first page.
tldr; :
How do I get a link to a specific page on a Google Form using Google App Scripts?
This should be a comment but don't have 50 rep yet...
Why do you need various HTML pages?
I think you should refactor your code so every form is on the same HTML and everything shows and hides with Jquery or Javascript. You can send the same URL but with differente URL parameters.
If this isn't your case, you should post some code of yours and detail a little bit more your question. Also, wich limit does it triggers?
I'm working on a messaging system like Facebook. I do have on left a list of conversation, and on right a box where i load the messages, just like facebook does.
The basic system is complete (PHP/MySQL), and here some information on how it is structured:
messages.php - Main page, based on url parameters. Rewrited with.htaccess:
Examples:
URL = http://www.domain.com/messages/ - Right Box: Display form to send new message.
URL = http://www.domain.com/messages/Username - Ajax call to getUserMessages.php to load Messages between Logged in user and
Username and show them on the Right Box.
getUserMessages.php - Get from database messages between Logged in user and user selected. It does Output HTML ready to be displayed.
Now the system is partially Ajaxified, and i want it to be, just like Facebook does.
At the moment the Ajaxified part is:
When a user is vieweing a conversation, it display automatically new messages, and also update the conversation list with the last message.
If the user is not viewing a conversation, it does get new messages received and update the conversation list.
This is done with a PUSH service, to give Real Time experience to users.
I want to improve this, and make it to act like that:
The user click on the Conversation List, and it load the messages on the right Box, and also change the URL on the Address Bar, withut reload the entire page.
I can easily do the part to load messages when user click a conversation, but before i start i have two question:
1. How i do change the Address URL while displaying a User Conversation WITHOUT reload the page?
I found the answer.
2. How i do cache the conversations ? So if a user switch between two conversation, it does not call again the php file and query the database for all the messages, but appending only new messages (Maybe via another php File to fetch only Unread Messages)
EDIT
I comed up with a solution:
When a user open a conversation, i cache the entire Ajax response (that is HTML) in a variable, like messages-n, Where n is the user_id of the conversation selected, then if the user click again on that conversation, i check if messages-n is set, if it is, i print it and run an ajax request to get only unread message and append them.
That's only in my mind i didn't made it to actual code.
Could work well?
Solved 1/2 :
1. To change Address URL i'm using the HTML5 .pushState() event.
Since HTML5 Browsers implement the pushState method in different way, to have a Cross-Browser solution, and have support for HTML4 browsers with hash Fallback, i used Hystory.js.
2. To cache messages, i haven't found a solution yet, nor i tried to do it for now.
But as #Christopher suggested, i changed the Ajax response from HTML to Json.
If i find it i will update my answer.