This is a design question.
I have a dynamically changing list that works by creating DOM elements and populating them with the fields and these list elements can be added and removed. However, I'm not sure how to design the interaction with the backend server through POST/GET requests. If it helps, I'm using mongoDB and python flask.
My problem is that I'm not sure how to, given an list element (a div container as a list element), retrieve sufficient information about said list element to complete the POST/GET requests.
Should I attach additional fields to the div element itself that holds data like name, description, timestamp? Or should I have a JSON object that keeps track of each list element by id (or something) and it's associated identification data? Or should I be doing something else altogether?
As a side node, where can I turn to learn these design/stylistic things? Thanks!
That's what forms are for.
<form name="form1" action="index.htm" method="GET">
(put fields here)
<input type="submit" value="Submit"></input>
</form>
Change index.htm to the name of the page. Put any fields you want to pass to a POST/GET request in there. Any input fields with a name attribute should have their value passed. Change GET to POST if that's what you prefer. Then you must use a server side language like PHP to interpret the sent data.
Related
How can I show the information I got from the place where I entered the title and text on the announcement page?
repo:https://github.com/qswezy/spa1
We have added the form and we want to show it in the announcements
Forms usually have target page. So, this is the page that will receive your submitted data, usually in some type of POST array (if you submitted it as a post.) If this assumes JavaScript, you probably need to run an Express server to do this.
My web app on the backend is Flask and I use Jinja2 and wtforms to dynamically generate content.
The main page that is generated is a table of all the sales for any given month. At the top of the table, there are select fields used to filter the sales, Month, Director, and Account Manager.
When someone selects an account manager, for example, from the Account Manager dropdown, I would like an event to be triggered that sends a "get" request back to the server with the selected account manager. The server would then generate the new filtered content and send the HTML page back to be rendered on the client.
I want the dynamic rendering to remain on the backend. I added an event listener to the Account Manager select field and then tried to use Axios to send an ajax call to the server using a "get" request, which works. I get the entire HTML document back as data.
My question is, how do I now render that entire HTML document returned to Axios? Or, is there a better way to do this?
I know I could easily create a form with those filter elements and then a submit button to send a "post" request back to the server and it will work. But, I really would like to send a "get" request when a select field changes without having the user click a button.
I was able to solve this on my own. I kind of answered it in my last paragraph of the question. A solution is to simply create a form that includes the filter select elements. I then added an event listener on each of the select elements. The function for the event listener then calls submit on the form. Pretty simple.
I need to populate form components(either select,checkbox) from database. The fields of the form depend on each other, i.e I need to populate a component based on user selection on the previous component. To do that, I am using onchange method, from which I raise a AJAX request for the data that need to populate the next tag. Right now, I am returning the string(HTML data) from the controller in backend and setting the corresponding id's innerHTML to these string. I am curious, whether the approach is correct way or should I take the json as the output from AJAX call and generate the HTML in js and then set the innerHTML value to the corresponding id. I am using JSP as View.
i think building the json and building up the components in the page side is safer becuse it makes your business login separate from the view. If it is required to construct a dynamic table without a POJO then there is no other go you have to use the html string data as the output of ajax
I just want to ask if there is a better way for me to pass IDs for the DB on the website.
Right now I pass it by changing the 'button' attribute 'ID' into the ID of the element I want to edit. so when I pass it to the controller, I pass along the values I want to upload and the button's ID for update. I know it's unsafe, but is there an alternative?
If it's better, can you at least point me at the right direction on good web design?
If it helps, I use Codeigniter.
Relax. There is nothing inherently insecure about passing the ID to the browser and POSTing it or putting it on the query string. The ID is not itself sensitive.
Just like Phil said above, a
<input type="hidden" name="id" value="123" />
is a common way to pass the ID around.
The element of safety comes in the handling of the next request. ALWAYS check that the user making the request is authorized to modify the data that correspond to the ID. This is generally done by checking the user's login cookie. There are other methods of authentication but the bottom line is to prove that the user you have should be editing the data they are trying to edit.
I read online about how to send a variable from javascript with ajax but I am not sure that solution fit my needs.
What I am trying to do is this:
I have an automated form for creating a row at my DB.
What I Want to do is run a javascript code that will create a variable with logic based on the user input and than send this variable along with all the other fields that are automatically being sent because of the automated creation and binding of the model.
Basically what I want is to add another array to the automated post call that I didn't wrote because it is being generated automatically by mvc. and than I can retrieve this variable (array at my case) at the create method on the controller
Do you have a solution for this?
Thank you very much
You could add some hidden fields to the form and use Javascript to fill their values in the submit event.