How can I hit my database with an AJAX call using javascript?
- by tmedge
I am pretty new at this stuff, so bear with me.
I am using ASP.NET MVC.
I have created an overlay to cover the page when someone clicks a button corresponding to a certain database entry. Because of this, ALL of my code for this functionality is in a .js file contained within my project.
What I need to do is pull the info corresponding to my entry from the database itself using an AJAX call, and place that into my textboxes. Then, after the end-user has made the desired changes, I need to update that entry's values to match the input. I've been surfing the web for a while, and have failed to find an example that fits my needs effectively.
Here is my code in my javascript file thus far:
function editOverlay(picId) {
//pull up an overlay
$('body').append('<div class="overlay" />');
var $overlayClass = $('.overlay');
$overlayClass.append('<div class="dataModal" />');
var $data = $('.dataModal');
overlaySetup($overlayClass, $data);
//set up form
$data.append('<h1>Edit Picture</h1><br /><br />');
$data.append('Picture name: ');
$data.append('<input class="picName" /> <br /><br /><br />');
$data.append('Relative url: ');
$data.append('<input class="picRelURL" /> <br /><br /><br />');
$data.append('Description: ');
$data.append('<textarea class="picDescription" /> <br /><br /><br />');
var $nameBox = $('.picName');
var $urlBox = $('.picRelURL');
var $descBox = $('.picDescription');
var pic = null;
//this is where I need to pull the actual object from the db
//var imgList =
for (var temp in imgList) {
if (temp.Id == picId) {
pic= temp;
}
}
/*
$nameBox.attr('value', pic.Name);
$urlBox.attr('value', pic.RelativeURL);
$descBox.attr('value', pic.Description);
*/
//close buttons
$data.append('<input type="button" value="Save Changes" class="saveButton" />');
$data.append('<input type="button" value="Cancel" class="cancelButton" />');
$('.saveButton').click(function() {
/*
pic.Name = $nameBox.attr('value');
pic.RelativeURL = $urlBox.attr('value');
pic.Description = $descBox.attr('value');
*/
//make a call to my Save() method in my repository
CloseOverlay();
});
$('.cancelButton').click(function() {
CloseOverlay();
});
}
The stuff I have commented out is what I need to accomplish and/or is not available until prior issues are resolved.
Any and all advice is appreciated! Remember, I am VERY new to this stuff (two weeks, to be exact) and will probably need highly explicit instructions.
BTW: overlaySetup() and CloseOverlay() are functions I have living someplace else.
Thanks!
