im trying to learn nodejs and vainillajs for web development, making my first project after some months of tutorials, and im in having some very basic doubts, dont know if im conceptually wrong, if someone can point me in te right direcction ill be very grateful!
1-The user access my main page on route:/ receives the corresponding public html/css /JS and have the option to a fills a form, and send a post request with that data to route /validation.
2-on the server side i receive the post request, with the data provide by the user, i make some validations on that data
and here comes the part im very doubtfull
depending on the validation i want to send to the user a response with data containing reasigning values for existing variables inside the public js file sent in first place, (like setting the value of a variable to block, to open a modal, or just adding some innerhtml)
I believe i cannot modified the public js already sent, but i want to know if i can respond with a redirection to route / again, but adding the reasigned variable inside the response.
and is if that the proper way of doing what i im trying to do.
I know i can redirect my user to another totally diferente route, but in principle that is not how i would like it to be.
any help or guiding material about this topic would be greatly appreciated.
Related
Whenever I receive an IPN in this url: https://www.example.com/payment/notifications, I want to display with JavaScript some HTML content to https://www.example.com/stream/notifications/<token>.
The goal is to display some successful donation message to a streamer whose token is user.stream_token. Then he can take that url and configure the alert with OBS.
This token is unique to every "streamer" and I can access it by doing user.stream_token
I manage the IPN from the server like this:
#csrf_exempt
def notifications(request):
jrequest = json.loads(request.body)
if request.method == "POST":
if jrequest['action'] == 'payment.created':
# some code
return HttpResponse(status=200)
I want to run the JS function that displays the html content inside that block of code, because that's when I can confirm that a payment or donation has been approved.
I know that Django is server-side and JS is client-side so I cannot just run a JS function inside there.
Any ideas on how could I implement this in the simplest way possible? I read about WebSockets but the implementation is way too difficult for me to understand.
If you are okay with your user having to send a request to trigger this change in the document, then you don't need a WebSocket. As we talked about last night on your question, you only need a WebSocket in a situation where you want your server to send your user a message without any prompting by the user.
However, if you are okay with the user having to send a request, you are on the right track. You are going to need to use ajax or fetch, etc. to make a request in your js to this view you are creating now. Then, depending on the data in the response from the view, you can render new elements in the document.
I am having a hard time understanding what the user is doing exactly in the frontend, and what you need to show them based on what event. If you can elaborate more we can keep working this out!
I have seen this request
https://somesite.com/path/script.js?shop=xyz.com
https://somesite.com/path/script.js?shop=abc.com
the output for both requests are different
earlier I was thinking that .js file cant be treated like php and dynamic data cant be passed but I was wrong and some expert advised that its router which is passing these data and according to shop name they are serving.
I have php apache+ nginx server
can anyone tell how we can make this work. don't want to go with Nodejs as it won't allow to pass php code.
just for test i want to call above links and print this.
hi i am shop xyz
or hi i am shop abc
on respective calls.
can anyone share some details guidelines how to make router. any link any guide any advise will solv the purpose.
I have never dealth with such javascript ant it is damm easy in php extension but want to learn in javascript.
I'm wondering how favorite, subscribe or like buttons work.
I don't understand something.
For exemple:
A user like a post with id 243.
A ajax request is sent to the server with the id of the post (243) [here comes back end stuff, the user's favorite list is updated, including that post] and the server sends back a success response.
Now, how I suppose to deal with modifying the like button to actually display that is liked (permanently, including refresh).
How can I achieve that in Vue JS. How things get updated? I don't understand this part.
If the server sends back a successful response you can increment the number that is already there.
This initial number is something you have gotten either through a prop, directly from the server or through an initial AJAX request.
If you want to "permanently" update the amount of likes on your button you have to persist it to a database(or some other storage medium). On you server you could have a route that accepts a post id as an argument and increment that specific user post:
/incrementlike/243
That is where you would make a POST ajax request to. Most of the time in an MVC framework you would have a controller action/method mapped to this route that holds the logic to respond to this call.
If you are interested in the part that happens after you make an AJAX request to the server to increment your like on the backend side, I suggest you read up on routing or MVC structure.
How you would do this is really done on a case by case basis. It really depends on a number of things, for example what your backend does to a post when it is liked.
If you would like a general 'explanation' to the process I attach it below, this is not really Vue specific, but the general idea is the same:
Frontend side:
Modify the local state of you post to set the proper flag, ex. post1.liked = true immediately when it is clicked, before sending the request to the server.
Make sure your GUI represent this change. ex. Base the color of the button on the property 'liked' of each post.
If a failure response it received from the server, notify the user and allow them to 'try again' or something similar.
When refreshing the page, make sure changes are fetched from the server, If you have done the backend part correctly, the modification of the state of the post will be correct in the data you receive from your backend (post1.liked will be true)
Backend side
When the request comes in, modify the state of the post the correct way and make sure that next time the post is fetched, the new state is sent.
I was looking on how to get values of form data that are passed with POST requests and found this answer.
I know you you can get GET query parameters quite easily in JavaScript doing window.location.search but is there a way to do similar for POST request or document.forms is my only option?
To expand on what RUJordan said:
When you do a POST, the information is sent to the server using an entirely different method and does not show up in the URL or anywhere else that JavaScript can get access to it.
The server, and only the server, can see it.
Now, it is possible to take some of the form data and fill JavaScript variables and/or hidden form fields so the server can pass data back down to the client.
If you need more help, you'd be better off opening another question explaining exactly what problem you are trying to solve.
Do you want javascript to see the data was POSTed to load the current page?
JavaScript does not have access to the request body (where the POST content is) that loaded the page. If you want to be able to interact with the POSTed parameters, the server that received the request would need to respond with the necessary data written back out on the page where javascript can find it. This would be done after the form was submitted, as part of the response to that POST request.
Or do you want to know what your page could POST form the forms that are on it?
Inspecting document.forms will let you see what could be POSTed later if those forms were submitted. This would be done before the form was submitted, without a request being made.
Hello first I’d like to say, please excuse my ignorance to this all, as I’m very new to this all. I just started and still trying to understand this.
So far I have a database set up and I’m trying to retrieve values from a database to fill in a form on a page when it loads. The record or row/values that need to be retrieved from a database depend on the page’s URL.
I’m ok with html and css but still trying to learn more about jquery, JavaScript, sql, php and so on and so forth. I realize I have a ways to go and honestly some of the guides and tutorials online are kind of confusing because everyone has a different way of coding. So I’m a bit confused.
I’ve included a simple chart to breakdown what I’m trying to do.
If someone could point me in the right direction I’d be really grateful! Thanks.
If I understand you well, you want to setup a form and populate some fields of this form with a query forms a database, the primary key of the record being relative to the url.
The first step is to build the url, you can pass some parameters to an url by adding a ? at the end of the url followed by the parameter name, the = sign and the parameter value. If you have more than one parameter, you should separate each parameter with the sign &.
So your url could be something like this :
www.examplesite.com/page&.html?key=key_A1
Then, you'll have to choose if you want to build the page on the server side with a language like php, in which case you retrieve the parameter, query the database, build the html form and send it to the client.
You can also go client side with plain javascript or jquery, in which case you will still have to do some server side programming to query the database but will use an ajax call to get the data and will populate the fields in Javascript or JQuery.
You can do this using Javscript(using Ajax)
U need the key to search for get the results from database
Using ajax call get the data, You might have to write code to get the details from database using any server side prog language
Using javascript to fill the form input with the received data.
Google for jquery ajax examples, and how to populate input using javascript.
There are many frameworks out there that have DataBinding built-in that do the same job a lot easier. My favourite would be Angular Js, you can try Ember and lot more out there, choose the one you feel comfortable with.