I have a query. I am using JSP with tomcat for web development. I have a set of values which have been retrieved from database as a list. Now, I want to show the values one by one on a page with a next button. How this can be done? Do we make multiple pages or dynamically refresh the page with new value on pressing next button? Could some one please guide me on this?
if I'm not wrong, JSP does not provide any build in pagination control. you can use pagination through javascript, or create you own control for pagination. here is a link which might will you in pagination with javascript.
Tell me one thing, you are going to pick the records from database. So this is all dynamic data. So approach 1 is a big NO NO.
You should be dynamically refreshing, the page with Next button pointing to the next record to display. But don't you think having a single record to display in a page, can make a UI experience bad.
UI should be simple yet cover most information, so rather go for the standard solution with list of records in a table like format with action link to view details for each record which will point me to the desired record detailed page. In actual this detailed page will just be one, but displaying dynamic data.
You can have a look at Datatable in JQuery for pagination ofcourse.
Related
I'm new to spring-MVC, i created an application for performing CRUD operations, with separate views for insert,update and delete and view.
Now my requirement is i need all these in a single view( A form for collecting data, and a grid or table below which updates and shows the entire table as the user submits the above form).
But i also want to include options in the table for edit and delete ad when i click on edit the data in that row should auto populate in the form above the table, the same for delete also.
How to bring in this requirement.
Is there a tutorial or example for this...
The internet is full of tutorials, try to search the one who fits your requirements best. Maybe this tutorial can help you:
https://www.javatpoint.com/spring-mvc-crud-example
you can start with this and then you can adapt it to your requirement in case.
Try this one. Crud operations with Spring MVC and MySql database.
https://github.com/javabycode/spring-mvc-hibernate-mysql-integration-crud-example
I am a tester in a Scrumteam trying to automate our test regressionset.
Our front-end is developed in Java Angular and we use Tosca testsuite to automate our testset. The problem I am encountering is as follows:
With Tosca you can scan the application and all the fields, atributes, divs, and so on are shown to the user. The moment I scan one of our datatables I see them as what they are: a table. However, every field/button/icon/etc is being scanned as a seperate object.The table has 1 body, but the individual rows are not found. Meaning that the rows within the tables are not identified.
This makes it impossible for me to perform an automated search on a table, because the rows and therefor the colums are not identified, only the header is.
Anyone ever encountered this issue with a testtool or found a sollution how to fix this in the coding of the front-end in Java Angular?
This is a common scenario when the application under test is developed using UI Libraries, where the complex controls (e.g. Table, Combobox etc.) are rendered not as a single HTML tag (<TABLE> for Table or <SELECT> for combobox). Instead you will find bunch of other HTML tags (<DIV>, <SPAN>, <TABLE>, <UL> and what not!)
If I understood correctly, there are two ways to automate this scenario -
You mentioned that you are able to find a <TABLE> tag (The header). There good
chances that each row in the table is itself a <TABLE> and that's
why you are not able to see all the contents in a single one (you
can cross check this in the Content View section of XScan
window). If you just need a single row for verification (I am just
assuming!), you can select any one of them and use ConstraintIndex to get to the right row data. You can also look for a parent control (basically another <TABLE>) which clubs all the child table. This parent table might show all the data in one place. Table Verification will work with this control. Please remember that it is
just a workaround and might not fit into your scenario.
You can write a custom control to handle this. Custom control is a way where user can define how a control looks like. Once you implement this, Tosca will be able to recognize the table as a single control containing all the data. For more information on this, check the Tosca API reference here
In my play app I'm trying to offer the user the oppotunity to edit a specific item he selects from a table by clicking on a button in the same table row as the item.
To be more precise the user will edit the students that have enrolled for an exam. After clicking on the exam he wants to edit a modal will open. Inside the modal a table will show all available students with a checked checkbox for students which are already enrolled.
My only problem is: How do I pass the modal the id of the exam the user wants to edit? As far as I've researched I cant't define and edit variables inside of the template. In Angular I would just modify a variable in the scope.
What is the correct way to do this?
The general principle of moving initialization data from the back-end to the front-end is to inject it into the markup someplace, using the templating engine. In your case, in whatever loop you're using in your template to render the table rows, you simply drop the ID in it's own cell in the table, in a class or id attribute, or maybe most appropriately, in a data- attribute on the table row. I would say each of these options is pretty much equivalent, mostly differing aesthetically.
Then, in your click handler, you just use a relative selector on the event target to pull the ID into your script, wherever you stashed it.
The other approach is to render your table on the front-end, pulling this information from the back-end via API, in the style of a single-page app. Then, that association between ID and data lives in the model before its even rendered. This may be overkill for this one example, but if you've got rich interactivity with a dozen of these sorts of screens, I think this is a much more scalable approach.
We have a Struts2 Application in which we have implemented Dojo Tabs and DisplayTables.
There are 3 Tabs, each including a JSP in which data is displayed through Display Tables.
The issue is when we perform Sorting / Pagination in one tab, the same gets applied to the other two tabs as well.
Can anyone please suggest how to avoid this.
You have used the same action to paginate those tables. Once the request is made in one table it affects others because they are sensible to those requests. The solution would be to map different actions for each table, so it would not affect the state of the other tables. See the example Struts2 pagination using display tag.
Say you retrieve 100 records, and display them on a page. The user only updates 2 of the records on the page. Now you want to update only the two records, and not the other 98.
Is it best to have one submit on the page, then somehow know which 2 are updated, then send only those two to the db for an update?
What does the "somehow" look like?
Or, would you have an update-submit button for each row, and have it only update the record its tied to?
Of course there are different ways you could do this. In general, you can save yourself some trouble and server-side processing by using Javascript to assemble your POST data for only the records that have changed. Two thoughts on how this might work:
1) Go the ajax route and do live-editing. So records are presented in a table and appear to be non-editable. When a user clicks a particular row, that row becomes editable by using Javascript to create the appropriate html form on the fly. Then have either a submit button or some other handler (say, moving focus to another table row) which will trigger the POST which updates the DB (asynchronously via your preferred ajax method). Happily the mainstream Javascript frameworks can help a lot in this area.
2) Checkboxes - whenever a row is edited, its checkbox becomes checked. When the submit button is clicked, use javascript to post the POST data by grabbing everything in row whose checkbox is checked. A user can un-check a box to cancel changes to that row before submitting.
Ajax it using jQuery or some other JavaScript library and put and update button on each row.
There are many answers to this question and to some extent they depend upon your development tools and the "feel" of the site.
If you were implementing Ajax calls to do the updates on a line by line basis then this would logically seem right to have a button per line and then update it with an Ajax call when a line was changed.
This is also just the scenario that disconnected data sets were designed to solve and ADO.net handles these very well.
So as ever, the answer is "It Depends!"
You can use JavaScript to mark each field as changed when a user changes an input field. Create a hidden fields that has the id of the row you are updating, and dirty flag. (like is_dirty_$id) In JavaScript, create an onChange handler that sets the hidden field as dirty. when any input is changed.
Alternatively, you can create hidden fields for each real field you display. the hidden field would contain the initial values. check each field on the server side to determine what has changed.
You probably want to store a last_modified date as a hidden field for each record. This way if another user updates the same record, you can display an error message saying "this record has been updated by another user" or similar.
One submit button. I could foresee case I might use more then one, but in the general case just one. (Note, this looks like a web page question to me, so I'm answering with that assumption.)
There are 3 ways that come to mind which you could handle the tracking changes:
JavaScript: Put a onChange() function on the controls that update a hidden field. If that hidden has a value, then update the associated record. Requires JS on the browser, and doesn't tell you which fields to update, just which records.
Lots of form fields: Put a hidden field out with each control and compare them all when they come back. This would be ugly, but it would allow you to know which fields to update (not just the record). It would also allow you to know if someone undid a change that started.
Sessions: You could place the original values in session variables, then do the comparison when the values come back. This would be a little more elegant then lots of hidden fields, and less open to people playing with the posted back data (since you should never trust anything that comes back, even in hidden fields). Requires cookies on the browser and sessions on the server technology.