ajax call not sending data

Question

I'm using ajax call but I don't get any answer. In the next image you can see that the call works correctly but i don't get a data.

My html is the next code:

<script> 
        // wait for the DOM to be loaded 
        $(document).ready(function() { 

            // bind 'myForm' and provide a simple callback function

            $('#form input').on('change', function() {  
                var valueSelected = $("#form").find('input:checked').val();         


                /*$.post("http://localhost:49918/Home/HandleForm", {howGood : valueSelected}, function(respuesta) {
                    console.log("La respuesta es:", respuesta)
});*/

                 $.ajax({
                       type: "POST",

                       url:   "http://localhost:49918/Home/HandleForm",

                       data: { howGood : valueSelected },
                     success: function(respuesta){
                     console.log("La respuesta es:", respuesta)
                     },
                     error: function(respuesta){
                     console.log("Fail:", respuesta)
                     }
                 });


            }); 
        }); 
    </script> 

<div class="content-area">
    <h1>How Good Are You</h1>
        <form name="form" id="form" method="post">
            <input type="radio" name="howGood" value="Excellent">Excellent<br>
            <input type="radio" name="howGood" value="VeryGood">Very Good<br>
            <input type="radio" name="howGood" value="Good">Good<br>
            <input type="radio" name="howGood" value="Average">Average<br>
            <input type="radio" name="howGood" value="Poor">Poor
            <br>
</form>             
    </div>

and my code in the server is(It works perfctly, I can debbug successly):

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using System.Web.Services;

namespace MvcApplication3.Controllers
{
    [HandleError]
    public class HomeController : Controller
    {
        public ActionResult Index()
        {

            return View();
        }

         [WebMethod]
         public string HandleForm()
        {
            string howGood = null; 
            try
            {
                howGood = Request.Form["howGood"];
                string connectionString = ConfigurationManager.ConnectionStrings["indivirtualTest"].ConnectionString;

                SqlDataAdapter SqlDataAdapter = new SqlDataAdapter();
                SqlCommand SqlCommand = new SqlCommand();

                SqlConnection conection = new SqlConnection(connectionString);
                conection.Open();
                string query = "UPDATE Howgoodareyou SET " + howGood + " = " + howGood + " + 1";
                SqlCommand myCom = new SqlCommand(query, conection);
                myCom.ExecuteNonQuery();
               // SqlDataReader dr = SqlCommand.ExecuteReader(CommandBehavior.CloseConnection);
                conection.Close();
            }
            catch (Exception e) { throw e;  }

            return howGood;
        }
    }
}

Can someone help me? I don't get any answer.... but the code is execute correctly.

Thank you,

Answer 1

You can't reference external URLs with ajax. The url parameter must be local.

You can, however, have a local server script grab the data, and then perform an ajax request on that script.

Answer 2

Hi Aroma Please use the below code for call ajax. I have changed javascript function.

<div class="content-area">
<h1>How Good Are You</h1>
    <form name="formnew" id="formnew" method="post">
        <input type="radio" name="howGood" value="Excellent" onchange="callUrl(this);">Excellent<br>
        <input type="radio" name="howGood" value="VeryGood" onchange="callUrl(this);">Very Good<br>
        <input type="radio" name="howGood" value="Good" onchange="callUrl(this);">Good<br>
        <input type="radio" name="howGood" value="Average" onchange="callUrl(this);">Average<br>
        <input type="radio" name="howGood" value="Poor" onchange="callUrl(this);">Poor
        <br>

function callUrl(obj) {
    var valueSelected = $(obj).val();
    $.ajax({
        type: "POST",

        url: "http://localhost:49918/Home/HandleForm",

        data: { howGood: valueSelected },
        success: function (respuesta) {
            console.log("La respuesta es:", respuesta)
        },
        error: function (respuesta) {
            console.log("Fail:", respuesta)
        }
    });
}
</script>