Ajax Onclick Event不会进入服务器端

时间:2014-06-06 11:38:12

标签: jquery html asp.net ajax

我在html中有以下代码,带有HTML按钮..

               Name*:<input type="text" name="name" id="name" value="" />
               <br />
               Your Email*:<input type="text" name="email" id="email" value="" />
               <br />
               Phone Number:<input type="text" name="phone" id="phone" value="" />
              <br />
               Mobile*:&<input type="text" name="mobile" id="mobile" value="" />
               <br />
               Country*:<input type="text" name="country" id="country" value="" />
               <br />
               Please Describe About Requirements:
               <textarea id="TextArea1" name="S1" rows="1"></textarea>

                 <br /><br />
                <input type="submit" name="submit" id="submit" value="Submit" />

现在我想做一个ajax点击事件将数据发送到服务器端,但我没有得到任何XHR,而在服务器端看到代码我也无法调试。我正在使用Visual Studio 2010。

Ajax代码..

         <script type="text/javascript">
         $(document).ready(function () {

             $('#submit').click(function (evt) {
                 evt.preventDefault();
                 var name = $('#name').val();
                 var email = $('#email').val();
                 var phone = $('#phone').val();
                 var mobile = $('#mobile').val();
                 var country = $('#country').val();
                 var textarea = $('#TextArea1').val();

                 var URL = 'getGriddahico.ashx?name=' + $('#name').val() + '&email=' + $('#email').val() + '&phone=' + $('#phone').val() + '&mobile=' + $('#mobile').val() + '&country=' + $('#country').val() + '&textarea=' + $('#textarea').val();

                 alert("hii");

             });

         });

         </script>

虽然我能够在警报框中找到Hii .. 请帮帮我..

5 个答案:

答案 0 :(得分:1)

您缺少ajax调用本身。

var URL = 'getGriddahico.ashx?name=' + $('#name').val() + '&email=' + $('#email').val() 
           + '&phone=' + $('#phone').val() + '&mobile=' + $('#mobile').val() + 
         '&country=' + $('#country').val() + '&textarea=' + $('#TextArea1').val();

$.ajax({
 url:URL,
 type: "GET",// default is GET (as you are sending data as parameter)
 success:function(result){}
});

答案 1 :(得分:0)

在点击功能中使用此类AJAX调用

$.ajax({ url: "test.html", context: document.body }).done(function() { $( this ).addClass( "done" ); });

答案 2 :(得分:0)

进行这些修改

var formData= {name:"abc",age:"15"}; // add more parameters like this which you want to send on server.

$.ajax({
    url : "getGriddahico.ashx",
    type: "POST",
    data : formData,
    success: function(data, textStatus, jqXHR)
    {
        //data - response from server
    },
    error: function (jqXHR, textStatus, errorThrown)
    {

    }
});

答案 3 :(得分:0)

将您的html包裹在form代码中,例如:

<form id="form1"> </form>

并更改您的jquery以提交表单事件而不是单击:

$('#form1').submit(function (evt) { ... });

当然,你错过了AJAX本身......

答案 4 :(得分:0)

尝试这样并帮助你......

var URL = 'getGriddahico.ashx?name=' + $('#name').val() + '&email=' + $('#email').val() + '&phone=' + $('#phone').val() + '&mobile=' + $('#mobile').val() + '&country=' + $('#country').val() + '&textarea=' + $('#textarea').val();

$.ajax({
   url:URL,
   success:function(){
       alert("Hii")
   }
});