Hope you are having a great day.
I have a page where I let users browse related items (photo albums) posted by other users.
I show the album thumbnail, title, author, ratings views and category for each albums.
Now the number of related items can get large say 500 photo albums is related to a album user is viewing. I just show first 20 and drop a link saying 'View All'
Once the user clicks View All I take him to a page where I display 50 items per page.
Option 1: using a repeater\grid control
When user clicks a page I get the right items (using sql) and bind the result to the grid
The page is refreshed and user sees new page. So one big request and user sees all thumbs.
Option 2:
when user clicks the pager I use Ajax to get the thumbnail file name, title, rating, author etc.
Then I build the grid manually and set the src attribute of element using javascript
Then I append the resulting grid to a div. User sees the new grid without page refresh.
My concerns:
I have the thumbnails and all image files in file system (not database)
In second approach javascript will send 50 separate request to web server to get the image files. This will cause a lot of requests on the web server. Large concurrent users will flood the server with image file requests.
What is the best & efficient way to do paging and storing user files?
Is my app going to die by putting the images in file system since the app should handle millions of photos?
If you aren't already using one, a CDN (content delivery network, like Amazon S3 etc) will help (so you can download from multiple places concurrently).
Also, instead of requesting one image, request a page from the server. Let the server decide how many images to return.
You could try some css sprite techniques.
Definetely you shouldn't use Option 1 since it would take a lot of time for the page to load
Aldso the second alternative id not so good either.
You can use your GridView/ListView control but use server side paging to get the data. This way you could load only the information that is needed per page.
You can see how to implement a stored procedure for server side paging here : http://www.sqlteam.com/article/server-side-paging-using-sql-server-2005
Then you can bind the individual page the PageIndexChanging event handler of your Gridview
so only the page that is needed is actually loaded.
Related
I have a web page written in ASP.net where it finds a list of employees, displays them in a listview and allow the user to change different statuses for each employee.
On each row I have employee information like name, date of birth, address and then 4 status fields that are displayed as checkboxes and a comment field where the user can type a comment explaining why they changed a certain status.
Currently in Listview, there is an edit, delete button when they click edit, the checkboxes and text field are displayed the user updates them and click save.
asp.net will do a postback to save the changes for this row and then fetches the data again to refresh the list.
The problem I am having is the list is very large (more than 3000 names), so I am using pagination to show 50 to 100 names on each page. This is still a big performance problem because after every line update a query needs to run to fetch those names again, and with ASP.NET the server is generating the html and passing everything to the browser.
The customer wants the page to be mobile friendly too, so I am thinking to redo the page using Angular on front end with web-api or mvc.net on back end that returns JSON.
My question is there an easy way to do this and allow the user to change the status for multiple employees on the same page at once and then click one submit to update all the changes? if I do it this way, there will be less queries to run and it will be faster for the user because they don't have to wait after every line update.
Any examples will be greatly appreciated, unless there is a different way to implement this, in this case please let me know.
I have a thought that may work.
On load render names and use pagination.
Then use ajax to send the post to server and change data in database.
When editing has returned successful then only change the values that have been edited using javascript for the user to view.
Is there a way to only update part of the page and update the query string parameters at the same time without completely refreshing the whole page in ASP.NET?
I only need to update the "main" section of my page and not the whole page. I understand I can do a partial page postback (or use asp ajax) to do the partial page update, but then how do I update the query string parameters in the URL at the same time? Is that even possible?
Or is it not possible and I'll have to just do a Response.Redirect in the code behind of the partial page postback redirecting to the same page with new query params and just let the whole page refresh?
Use pushState.
This new feature offers you a way to change the URL displayed in the browser* through javascript without reloading the page. It will also create a back-button event and you even have a state object you can interact with.
window.history.pushState(“object or string”, “Title”, “/new-url”);
Described here
You have absolutely zero programmatic access to the address bar. The only way to change it is to redirect.
You could, however, do it like some sites do and provide a "send a link to this page to your friends" area. Youtube comes to mind - see how it provides a URL, querystring parameters included, for you to copy, should you wish to send someone a link to a video starting from some specific point.
Also check the handy "Share" link right under your question. You could provide a link like that, with the target URL, so for the user it's just a matter of right-clicking and copying from the context menu. A link well structured into your site is more user friendly than having the user copy directly from the bar, or from a text box. Specially for mobile browsers, where the sequence is usually press-and-hold, then copy. Copying from the address bar, on the other hand, may involve selecting the address bar text, which in some Android devices is a pain in the ass.
Good day.
I was using knockout in an asp.net web form master page. On master page i have an advanced search control completely with knockout. After selecting the search criteria by readio buttons, tabs and dropdowns, on clicking a search button redirect to a details page which is also inherited from the same master page.
I need to persists the selected view from the first page in the details page along with populating the search result.
But I'm unable to do it as an infant in knockout.
I guess if I can remove the binding and apply it again, it will be happen.(don't know I'm wrong or not).
Kindly advice me to get over this situation.
Thanks
Santhi
It sounds like you're doing a complete trip to the server between pages. In that case you'll need to store the state of your search box somehow before the redirect, and then load that state after the redirect. You have a couple ways to do this.
Using Cookies
You could serialize the state of your select control into a JSON string and store it in a cookie. When your search box loads, look for that cookie using JavaScript and if it exists, load the data into your search box.
Using the Query String
You could serialize the state of your select control into the query string, and load from that. This would be a little bit more reliable in case cookies are turned off on the user's browser.
Using Local Storage
If you're working in modern browsers and supporting HTML 5, you could use HTML 5 local storage to store the search state between postbacks. http://diveintohtml5.info/storage.html
Serializing your Model State
Take a look at this page of the Knockout JS documentation for more info on serializing your object graph. http://knockoutjs.com/documentation/json-data.html
I hope this helps!
I have an asp.net application with a search page, with criteria and result display on the same page. I want to keep a copy of the populated search page to redistribute it later to the same user, upon the button click on another page. It's kind of a "return to search" button. How can I do that?
Here is some context:
The search criteria is made up of some basic controls, and the results are then (after postback) displayed in a GridView. I also have a master page. Simple as that.
Now consider the following scenario: The user can investigate the results by clicking links that show detail pages, and can drill down over quite many detail pages with associated data. If he/she wants to get back to the search results he/she needs to click the back button of the browser quite many times.
I would like to provide a "Back to search" button on the master page that allows to return to the populated search page with one click.
Note:
I can not use the browser history in any way because it must work also when the user opened one of the detail views in another tab.
I have seen Keeping the Viewstate persistent and retrieve it on demand but it hope there is an easier solution because my grid is paginated and I have also more than one search page, where I would like to return to just the last one used.
Thanks, Marcel
I can offer some logical ways to resolve this problem, without using specialized asp.net features if they exist:
1) Is there some way to save the search string in GET request? So you can save it some way between moving through pages?
2) Another way is caching search pattern (with all filters or what you need there) somewhere - in database, for example and contain some key in get request, which would point on this pattern.
I have a question to understand the concept of ASP.NET with each client browser.
I am trying to update the XML on server when a user hits a particular page on my website.
This page is dynamic, but too large so I want it to load using an XML file also I have several drop downs on the page when user changes the value in drop down, I need to refresh the data based upon the selection, additionally my drop down is a custom designed here I do not get and selectedIndex change event.
So I'm using JQuery to get the changed value in my drop down and planning to read XML from jQuery and display the data.
But since the XML is updated on hit of the page on server, I want know, if multiple users hit the same page, will the data displayed as per each users selection or it will mix the data and show the last hits record.
If I'm not mistaken about your question, you basically ask the following:
You have an XML file, which is updated, on some event from user. The page, which is displayed to the user is based on this XML file. What info will users see, when multiple users are working with the application?
This greatly depends on how you are using that file. In general, if you try to write that file to disk each time, users will see the last update. Basically update from the last user.
However, you can synchronize access to this file, write the file on per-user basis and you will see a per-user output:
<data>
<selectedData user="user name">123</selectedData>
<!-- and so on -->
</data>
UPDATE:
For anonymous users this would not work well. However, if you need to store the selection only for the current user, you can use SessionState and not an XML file.
I would like to introduce a new way that it helped me to answer my above question.
What i did here is
on Page load we added all the information related to each section in different hidden fields.
suppose i have three section with my custom drop down!
What exactly we implemented is that on click on my custom drop-down, we separated the values from the hidden field with the separator we entered and displayed the data accordingly, small part of logic but it helped in displaying the data without post back.
and Jquery helps a lot to me for just changing the inner html of my block.