I want the user to click the link then the window pops up, but I want the data inside the window to be pulled from a database, and I need to repeat this process for 5 links that are also pulled out of a database. Say the most popular items for the month. My question is how would this be best accomplished? Jquery, or AJAX. I am just trying to see which would be the easier way to go about coding this with .net and C#. If anyone has any tutorials related to this at all that would be wonderful. Thank you guys in advance.
The most simplest solution I think you can either just code the window as a separate page asp.net page. In the code behind you can get the data from the database. The link would just open this page as a popup modal window. When the page executes, it will get the data from your database.
A more elaborate solution if your doing something more fancy say if you want to use jQuery dialogs would mean that you would have to get the content of the dialog using ajax, which can be called when the user clicks the link.
You can use JQuery with the Ajax API - use the http://api.jquery.com/jQuery.get/ method to call a web service e.g. a .net wcf service over http. In the jquery script you can call the .get(...) method that calls your service (that then gets the data from the database). With the returned data you can replace the contents of a div element, which then you can use for a jQuery dialog.
$.get(WEB_METHOD_URL,
{ param1: XXX, param2: YYY },
function (data) {
$('#ID_OF_DIV').empty().append(data).dialog('open');
});
Related
I am on a C# .NET MVC project, and have a form that can dynamically add/remove n number of complex objects in a list. This complex object, for example represents a Person. This person has FirstName and Address properties.
When the user loads the page, all the People in the system are displayed in a list. When the user presses the 'add' button, two new text boxes show up for the Person's FirstName and Address properties. When the user presses the submit button, it will make a POST request to the server.
I know that you can write regular html in the View, and can use Javascript to add the new DOM elements for the FirstName and Address properties.
And with regards to when the user submits, I can use javascript to scrape all the data in the screen, and send a POST request to the server. Theoretically, another method is instead of using javascript, just make the button submit the form to the POST action of the controller; if I give my DOM elements the proper name attribute, the Action should recognize the data.
However, is there a MVC way of doing this? Maybe, with the help of Razor Helpers?
I am not sure what you are asking here; is it how to remove and add lists to your table or is it how to make a post?
I'll try to answer both:
1: Post without javascript:
Your assumption that you can post by naming the properties is correct! However, the page will have to reload if you want the new person in your table. Reading your description, I don't think this is really what you are looking for.
2: Add a row without javascript:
This cannot be done. You need javascript for this or a javascript framework which uses data-binding (there are a lot)
I would strongly advise you to make a decision on if a page reload is a deal-breaker or not for your solution. If it is, try to solve your issue with jQuery or better yet: investigate in javascript frameworks which use data-binding (knockoutjs, angular, react, etc...). There is a learning curve to these frameworks but they make your developer life so much easier and increase the maintainability of your code.
I've seen multiple websites on the web where they allow you to manipulate data. (i.e. Insert records, delete records, edit records).
The cool thing I've noticed is that when you click remove button, the item removes instantly from the grid. and then it asynchronously goes to a database and removes record from there without bothering a user.
For example in a regular asp.net application if you're using gridview you need to wait until database operation is complete, because gridview is a databound control. If you use update panel you still see item in grid until DataBind event fires again.
Question: is there any js/.net library that will allow me to add such a functionality to the project out of the box?
Maybe you want to use WebMethod on server side + Ajax calls on client side (using jQuery for example).
You can you Client Side Grid Like JQGrid. http://www.trirand.com/blog/jqgrid/jqgrid.html. For loading and editing data you can use Web method or web Services. You can also use ASP.net MVC .
Yes you can do.You have web method that read your data from your source such as database.
You can call this method using Ajax and you can bind ajax response to gridview
Here is example Link
I wrote a page which user can input a name and get some infos from the database. In the .cs file I got the texts from the database and assigned them to the labels and in the debugging mode, the labels did change their texts. BUT I don't know how to update them in the same page. I used some ways to update the page, but it updated the whole page and display nothing in the labels.
How can I achieve this function?
I google it and found the AJAX is a good way, but it's an emergency i have no time to learn AJAX?
does someone have good idea to help me solve it?
Thanks a lot!
What you're talking about is a postback. When the page posts back to the server, the page is refreshed.
If you want to set the labels and avoid losing the data with a postback, you can do so through an ajax call in your JavaScript code, you can set hidden fields or you can set the values in the Session object (not the best idea). There are numerous ways around this; you just have to pick one.
Do some reading on ajax (it's not as hard as you think). You can call the server through ajax, which will get the data from the Db and return it to your JavaScript as JSON. You can then use that to fill your labels.
You may want to look into an UpdatePanel as well. They aren't the fastest solution available, but they are very easy to implement.
I am trying to create a form which allow async file uploading with asp.net. I realize you cannot upload a file with ajax per se so I am examining alternatives
What is the best way to do this? Create an Iframe on the page with the entire form including the file input? Can I on the parent to the frame have the submit button which forces the frame to submit and then displays some sort of spinner to indicate file is uploading? Ideally upon completion I'd like to redirect the user to another page. Is there a somewhat easy way to do this???
Have you tried using one of the jquery plugins vice doing it by hand?
http://aquantum-demo.appspot.com/file-upload
Why not use the ASP.NET AJAX Control Toolkit's AsyncFileUpload control? It's free and works pretty well.
You could use http://jquery.malsup.com/form/#file-upload
Have it post to a page that will handle a file upload on the server side in your usual way.
I like to have the page return JSON with a success/failure flag and message, then parse the response to determine if the upload succeeded.
The user needs to click on browse button to browse his system .He then selects a text file & clicks ok.Once he clicks ok all the data in the text file should be displayed in a text area.How do I do that? I am using JavaScript & c# designing aspx pages.It would be preferable if i avoid round trip to the server.
You can't do it without a trip to the server, the only way for you to get the content of the file is by submitting it as part of a form. You can make the trip to the server happen in an iframe via XHR and then update the text area with the result from the XHR call, so it sort of seems like one wasn't involved, but you can't directly access the content of files of the user's machine, for obvious reasons.
I know you said you would prefer a round trip, but its the only way you are going to be able to accomplish what you want.
You could put the file upload in an iframe, and do the upload behind the scenes (No page refresh, gmail does this :) ) then use AJAX to download the data and insert it into the textarea.
It can't in general be done, as answers here outline.
However, it can be done in Firefox 3+ only, using the uploadfield.files array. Other browsers would have to fall back to the server round-trip.
For security reasons, JavaScript cannot access the local filesystem like that.
Javascript cannot do that without putting a severe security risk on the user. That said, the file will need to be posted to your server.
As other posters here have indicated, you're not allowed to access the local filesystem from Javascript directly. But you can set up an action on your server to take the file form POST input, and simply echo the data right back out to the response. If you hide an iframe inside your page as the form POST target, that response data can appear in the hidden iframe, and then the page won't have to reload. Then once the iframe has loaded with the text, you can use JS to pull the text out of the iframe, and put it into the text area that you're interested in.
Alternately, if you're inclined to restrict usage to Firefox users with an extension, you should be able to accomplish this without a roundtrip using a Greasemonkey user script (see www.greasespot.com) or something like it, that uses the custom Mozilla extensions.