Cipher
Cipher

Reputation: 6092

Connecting jQuery with the SQL Server Database

I am trying to build a jQuery functionality for which the scenario is given below.

Consider a user clicks on an image in the website, a jQuery dialogue box pops up on the page. The dialogue box has a text field to enter the 'alternative text' for the image. When the user clicks on the submit button, the text from this page should get saved into my central website's database along with the url of the image.

I have been able to get the jQuery dialogue box working (by going step and step in jQuery) with the following code http://pastebin.com/nxALvAPP

But I wanted the help to save the 'image text' and it's url in the database from. How can that be done? I am not really a pro.

Thanks for help!

Upvotes: 2

Views: 38436

Answers (2)

Joshua - Pendo
Joshua - Pendo

Reputation: 4371

You'd have to pull an ajax request to a php page with the values of the fields as data. Take a look at http://api.jquery.com/jQuery.ajax/

As you've came so far, I don't believe this causes any problems for you.

///////////////////

Basically what you do is:

add an click-event to the submit button:

$('#button_id').click(function(e) { 
  e.preventDefault();
  // button action
});

within this action, you call up a file and add data, for example:

$.ajax({
  url: "savetext.asp",
  context: document.body,
  data: 'title='+$('#title').val(),
  success: function(){
    alert('ajax file called');
  }
});

This sends a request to savetext.asp with data 'title' (which has the value of the input field with the id title). I'm not sure what's the equivalent of PHP's $_REQUEST but this parameter (title) is send in the URL to the file savetext.asp.

Upvotes: 4

user53791
user53791

Reputation:

jQuery doesnt have any facility to interact with your SQL Server.

You will have to add a button or something that submits to some middleware ASP.Net, classic ASP or even PHP.

Then server side you take what jQuery has sent and issue a sql statement to update.

As a terrible terrible example:

$('#save-button').click(function() {
 var id = $('img.active-pic').data('id') // if using data-id="33"
 var altText = $('.alt-textbox').val()

 $.ajax({
   method: 'POST',
   url: '/ASPNetApplication1/UpdateAltText.aspx',
   data: { id: id, altText: altText }
   success: function() {
     alert("yeah it worked")
   }

 }
)
}

Upvotes: 2

Related Questions