How to insert data into SQL database using jquery.

Question

0.00/5 (No votes)

See more:

I am trying to insert data into database using jQuery but data is not inserting.It is displaying alert as error.Can anyone help me with this.

What I have tried:

cs:

[WebMethod]
   public static void insertion(string Title,string Description,string Category,string Priority,string Attachment)
   {
       using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["msgscon"].ConnectionString))
       {
           using (SqlCommand cmd = new SqlCommand("INSERTMD", con))
           {
               cmd.CommandType = CommandType.StoredProcedure;
               cmd.Parameters.AddWithValue("@MD_TITLE", Title);
               cmd.Parameters.AddWithValue("@MD_DESC", Description);
               cmd.Parameters.AddWithValue("@MD_CAT_ID", Category);
               cmd.Parameters.AddWithValue("@MD_P_ID", Priority);
               cmd.Parameters.AddWithValue("@MD_ATTACHMENT", Attachment);
               con.Open();
               cmd.ExecuteNonQuery();
               con.Close();
           }
       }
   }

ASPX:

$('#btn_savemd').click(function () {
               var title = $('#tb_title').val();
               var cat = $('#DDL_cat option:selected').index();
               var prior = $('#DDL_prior option:selected').index();
               var desc = $('#tb_desc').val();
               var attach = $('#FileUpload1').val();
               var strfields = ''; var missfields = ''; var i = 0;
               if (title == '') {
                   missfields = true;
                   i = i + 1;
                   strfields += i + " Please enter  Title \n";
               }
               if (cat == 0) {
                   missfields = true;
                   i = i + 1;
                   strfields += i + " Please select Category \n";
               }
               if (prior == 0) {
                   missfields = true;
                   i = i + 1;
                   strfields += i + " Please select Priority \n";
               }
               if (desc == '') {
                   missfields = true;
                   i = i + 1;
                   strfields += i + " Please enter Description \n";
               }

               if (attach == '') {
                   missfields = true;
                   i = i + 1;
                   strfields += i + " Please select Attachment \n";
               }
               if (missfields) {
                   alert('Please fill following details \n' + strfields);
                   return false;
               }
               var data = { Title: title, Description: desc, Category: cat Priority: prior, Attachment: attach };
               $.ajax({
                   type: "POST",
                   contentType: "application/json; charset=utf-8",
                   url: "jQueryMsgs.aspx/insertion",
                   data: '{' + JSON.stringify(data) + '}',
                   dataType: "json",
                   success: function () {
                           alert('Message Details Added Successfully');
                   },
                   error: function () {
                       alert('Error');
                   }
               });
           });

Posted 15-May-19 0:08am

Member 14185275

Updated 22-May-19 20:08pm

Add a Solution

Comments

F-ES Sitecore 15-May-19 6:15am

Debug the web method to see if it is called, if it is examine the parameters being passed to it and see if any error is raised. One issue you might have is that you can't upload files the way you are doing, so that might be an issue. If the web method isn't being called then use the network section of the browser tools to examine the call to the webmethod and see what errors are happening, the response usually use more information about why the call failed. It could be as simple as a 404 error.

Dominic Burford 15-May-19 6:22am

What is the error? You need to update your error callback as follows to see the underlying error:

error: function (response) {
console.log(`Error${JSON.stringify(response)}`);
}

ZurdoDev 15-May-19 8:12am

Simple. All you have to do is debug it. Very simple.

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Richard Deeming · Answer 1 · 2019-05-16T04:12:00

Quote:

JavaScript

var data = { Title: title, Description: desc, Category: cat Priority: prior, Attachment: attach };

That object literal is not valid. You're missing a comma between the category and priority properties:

JavaScript

var data = { Title: title, Description: desc, Category: cat, Priority: prior, Attachment: attach };

Quote:

JavaScript

data: '{' + JSON.stringify(data) + '}',

What you're sending at the moment is not valid JSON:

{ { Title: "...", Description: "...", Category: "...", Priority: "...", Attachment: "..." } }

Remove the extra braces from your posted data:

JavaScript

data: JSON.stringify(data),

{ Title: "...", Description: "...", Category: "...", Priority: "...", Attachment: "..." }

Quote:

JavaScript

var attach = $('#FileUpload1').val();

C#

public static void insertion(..., string Attachment)

That's not how file uploads work. You're storing the path - or possibly just the name - of the file as it exists on the user's computer. The path will not be valid on the server, or on any other computer that accesses your site.

It might appear to work when you test the site in Visual Studio. But that's only because, in that specific case, the client and server are the same computer. As soon as you deploy your code to a real server, it will stop working.

To upload a file using AJAX, you will need to use the FormData object:
Using FormData Objects - Web APIs | MDN[^]

On the server, you will need to use the Request.Files collection to access the uploaded file. You will need to save it somewhere on your server, and store the path where you saved it in your database.

Jatinath · Answer 2 · 2019-05-22T20:09:00

Solution 2

Hi,

you have missed comma ',' [between cat Priority] while forming JSON object. add comma and try it.

var data = { Title: title, Description: desc, Category: cat , Priority: prior, Attachment: attach };

Posted 22-May-19 20:09pm

Jatinath

Comments

Richard Deeming 24-May-19 14:49pm

As I already said last week.

There are several other problems with the code from the question which also need to be addressed.

How to insert data into SQL database using jquery.

2 solutions

Solution 1

Solution 2

Add your solution here

Preview 0

Existing Members

...or Join us